网站设计制作论文十篇

网站设计制作论文篇1

1.1工作式运行模式

工作室充分学习新加坡“教学工厂”的运营模式，建立“2+1+4+n”的工作室组织运行模式。即工作室由2名教师作为主要负责人，聘请1名高水平的企业专家顾问，选取4名左右素质高的学生作为核心群组成员，每个群组成员再带动n名学习同伴。

1.2组织管理机制

组织管理机制的工作内容主要包括：成员档案管理：更新成员基本情况、发展计划、发展情况等。活动管理档案：对工作室进行的每项活动由专人负责进行记录、总结和材料归档。经费管理：对于院系给予工作室的经费支持及工作室项目收入，由工作室负责人负责记录、定期向系部领导汇报财务收支情况。

1.3活动规划及实施机制

由工作室负责人根据工作室的发展状况及业务教学需要，制订学习培训、内部交流、教学研究、课题研究、示范辐射等活动规划，并且根据活动规划，切实执行，形成一个良性循环的活动规划及实施机制。

1.4政策激励机制

为了保证工作室负责人有足够的精力做好工作室的工作，可以相对减轻工作室负责人的教学工作量，系部安排教师外出培训、学术研讨等活动中适当倾斜。项目验收后，依据相关规章制度，根据项目团队成员的贡献大小分配收入。对于参加项目开发的学生除了发放津贴外，另外给予创新学分的奖励，学分的多少由考核小组根据其个人业绩核定。

1.5考核评价机制

由项目委托人、系部、教研室、外聘专家共同组成考核评估小组，制订考评标准，对工作室按学期进行考评指导，对工作室成员的工作情况进行绩效考核，奖励表现优秀的人员、调整表现不好的成员。

2工作室教学模式实施过程

在工作室教学模式实践中，结合承接项目的情况及专业发展需求，大概分为前台静态图片处理、DIV+CSS页面布局、FLASH动画制作及后台程序开发四个模块。以一个项目为例，说明工作室教学模式具体实施过程。

2.1项目立项

项目立项以甲乙双方签订项目开发合同为准。如果项目较小，内容较简单，简单的协议也可以替代合同。在此过程中，积极与企业专业顾问联系，确定项目开发所需技术要领及阶段性成果验收、付款方式等。

2.2成立项目小组

根据项目特点，成立项目小组，确定小组教师成员及学生成员。此部分工作主要集中在学生团队的选取方面，首先面向全系学生公示项目开发内容，接受学生申请，最后由班主任、任课教师、项目负责教师、辅导员组成选拔小组，择优选取综合素质高的学生加入开发团队。同时，向系部申请使用网站设计工作室，履行相关手续。

2.3项目开发

由负责老师将任务具体细化，根据学生特点将任务进行分工，整理出相关联的技能需求。工作室团队中的学生如果有不会的内容，由负责老师进行辅导，师生合作完成项目的开发。在此过程中，项目开发团队向教学团队提供技能需求，教学团队组织教师进行教学研讨，将技能需求分化到具体的知识点，然后确定相联系的课程，最后将知识点纳入到课程的教学任务中去，将教学效果辐射到全体学生。

2.4项目收尾

项目开发完成后，向委托方申请验收，验收合格以后，项目团开发队完成工作室的交接手续。然后，考核小组根据项目完成情况及收入，确定分配给项目开发团队的津贴。另外，教师和学生分别针对项目开发过程中的个人学习心得总结。

3网站设计工作室实践成果

经过两年的网站设计工作室运行机制的实践，取得了一些成果，包括如下三个方面。

3.1提高了教师的“双师”素质

以前的教学模式下，教师教学质量的好坏主要由学生对某一门课程的评价，而工作室教学模式下，由于承接的都是实际的项目，项目能不能顺利开发完成对教师影响比较大，面对这种压力，迫使教师加强专业能力的学习、更新教学观念、对领域内相关知识进行持续性学习。教师都反应切切实实提高了教学水平及实践技能。在两年的时间内，项目团队依托工作室完成了部级精品课程《食品生产技术》和《食品生物化学》两门课程网站建设，完成了中国食品药品职业教育联盟、海外合作与交流、网上校史馆宣传类网站制作，完成一些课程多媒体课件制作，教师个人获批市级课题、完成横向课题开发、获得相关的软件著作权等等。

3.2调动了学生自主学习的积极性

以前基于某门课程的教学，知识相对片面，学生其实学习的是一些零散的片断，在实际应用过程中，会遇到这样那样的问题。而工作室教学模式打破了陈旧的教学体系，面对需要开发完成的完整项目，学生不再在课堂在等待教师的传授和辅导，面对项目开发时间的限制及项目开发完成的奖励措施，遇到解决不了的问题，除了请教教师外，学生更多地会主动上网或是到图书馆借阅图书进行针对性学习，并且这种主动学习在其他学生中间起到了辐射作用。

3.3基于项目教学，创新教学模式

在基于工作室的实训教学模式中，构建了以职业能力培养为核心的教学内容体系及与之相适应的教学方法和教学手段。依托实际项目，普通采用的是小组讨论、阶段评审等新型教学模式。另外，采用真实项目教学，学生带着实际任务进入工作室，教师则转变成项目负责人。在这种接近真实的企业环境下，对于培养学生的职业素养非常有帮助，学生经常接触到团队合作、分工、事务管理等内容，对于学生的就业及创业非常有帮助。

4结语

网站设计制作论文篇2

关键词：“模块化教学法”，职业教育，网页设计与制作，教学设计

 

1引言

随着计算机、网络与通讯技术的发展，Internet在人们的生活、学习和工作中的位置越来越重要，经常性上网冲浪的生活已经成为现代人生活的一个重要特征。通过属于个人或者公司的Web站点向全世界宣传个人形象、推广公司产品或开展公关活动已成为一种新的流行趋势。因此精通网页的设计与制作等内容已经成为现代人必备的一种技能。对此，本文基于网页设计与制作课程本身固有的特点，采用模块化的教学方法，更好地加强了教学实践性，极大地提高了学生的实践能力。

2 “模块项目化”教学法在网页设计与制作课程中的应用

网页设计与制作模块项目化教学法是根据网页设计与制作教学大纲的要求，把教材划分为若干个模块，并将这些模块项目化，同时以学生为主，教师为主导作用，以教、学、练相结合，调动学生的学习兴趣，启发学生思维，以实践为主的教学方法。

2．1网页设计与制作课程模块化任务的设计

以项目开发为出发点，将该课程分成网站策划、网站规划、网页风格设计、网页制作、网站测试和网站上传与更新维护等六个知识模块，每一个小的模块项目又具体细化为一个个小的任务。论文大全。每个任务根据教学的实际情况可以再细化。课程知识体系结构图如图1所示。

图1 课程知识体系结构图

2.2网页设计与制作课程模块项目化设计

模块项目化教学法的关键在于项目的选取。教师所设计的项目，应将培养学生的职业能力作为出发点，联系市场发展，从企业需要出发，以实际项目开发流程来确立课程的知识体系，使知识体系结构中的各个知识模块包含学生应掌握的能力素质。表1是“模块项目化”教学法的学习模块分解表。论文大全。

表1 学习模块分解表

网站设计制作论文篇3

网络评论

评论是历年新闻奖评选中最受关注的类目之一，评论反映舆情、汇聚民意，好的评论作品更能产生强大的导向功能，因而评论成为衡量一个媒体特色和影响力的重要指标。网络评论在网络舆论事件中影响尤为突出，网民特有的情绪化倾向，更容易受到舆论的左右。因此，各新闻网站皆将网络评论作为网站关注的重点。

这次选送参加复评的网络评论作品共31件。根据评论类作品评选的基本原则，其参赛要求是：1、必须是新闻网站首发的原创评论；2、字数限制在2000字以内。在此基础上，进一步提出质量标准观点鲜明，立论有新意，言之有据，分析深刻，文笔犀利、生动、鲜活，有网络特色等。从以上评标选准中我们可以看出，衡量一个网络评论是否优秀，既要考察它内容的重要性、创新性，同时也要注意它的形式技巧，特别是网络媒体特有的表现技巧。

网络评论评选的结果，获得金奖的作品有二：新华网选送的《达赖喇嘛提出“高度自治”意在颠覆中国的社会制度》、红网选送的《别把商业经营“意识形态化”》，中央新闻网站与地方新闻网站各占其一。这两篇作品能获取复评金奖，其共同特征是：内容大气、导向明确、影响显著。

《达赖喇嘛提出“高度自治”意在颠覆中国的社会制度》一文，早在3・14拉萨事件爆发前半年，针对达赖喇嘛在西方宣扬，中央外宣办就以高度的敏锐授权新华网独家编写英文评论，详述我国政府对的一贯政策以及社会的发展状况，并将评论播发在频道首页的突出位置上。文章刊出后，众多国内英文网站以及多家西方媒体，或全文转载，或部分摘登。其影响极大帮助了国外读者了解问题，澄清事实真相。事隔半年，拉萨事件爆发，更凸显了该评论的预见性与积极影响。《别把商业经营“意识形态化”》一文，针对闹得沸沸扬扬的故宫星巴克事件，中西文化交流的敏感论争在网上激烈展开，网站在关键时刻邀请特约评论员撰写该评论，作者以极为冷静与理性的姿态指出人们文化焦虑的关键所在，保护文化传统的根本途径是交流与包容，而不是盲目排外，并指出过分商业开发的弊端，文章的前瞻性、逻辑性、深刻性在众多文章中独树一帜，很快被100多家网站所转载。

金奖之外，银奖作品有四：人民网选送的《华南虎事件能否成为一个契机》、中国新闻网选送的《反思九江踏桥，人人称职为何桥毁人亡》、中国广播网选送的《民生脉动最关情》、荆楚网选送的《谁代表网友给小慧的后妈道歉》。铜奖作品有六：国际在线选送的《初次分配公平是和谐共享的基石》、中国经济网选送的《房子，还需要我们透支多久》、河北新闻网选送的《比炫富更可怕的是媚富》、中安在线选送的《安徽再次感动中国》、金羊网选送的《大桥坍塌的中美调查之别》、天津北方网选送的《大学生应聘搓澡工值得肯定》、大江网选送的《中国红歌会，呼唤红色精神的回归》。

以上作品的共同之处是，都特别注重正面的舆论导向，注重对社会热点问题的反思，思考问题视角独特、分析问题犀利敏锐、语言生动俏皮，很好的体现了政治性、新闻性、网络优势的高度统一。

网络专栏

专栏的成功往往得益于风格突出，定位准确，它们多以品牌效应来提高用户黏度。

网络新闻专栏作品评选标准是：网络新闻专栏(包括论坛)要求选题重要，信息量大，交互性强，图文音像并茂，编排制作精良，社会影响较大，有比较固定的位置。因此，衡量一个网络专栏是否优秀，要全面考虑到栏目的内容特征、表现形式、多媒体技术、影响力等诸多要素。

本次参评的网络专栏作品15件，因为复评不要求分出等级，所以只推选出6项获奖作品，这六件作品是：中央新闻网站3件――新华网的“新华直播”、人民网的“人民时评”、光明网的“文化日记”；地方新闻网站3件――红网的“百姓呼声”、胶东在线的“网上民声”、福建东南新闻网的“西岸时评”。

新华网的新华直播，创办于2003年2月10日，是新华网重点建设的核心栏目。该栏目定位于对党和国家重大活动、国务院及各部委重要会议、国务院领导同志重要活动、国际国内重大事件的现场直播和连线直播上。页面设计简洁明朗。由于新华网特殊的媒体地位，其内容时效、快捷、精准、丰富，成为国内网络媒体现场直播的典范。人民网的人民时评，是创办于2001年3月的原创评论栏目。其基本定位是，围绕舆论关注的焦点、百姓关心的热点、党和政府工作的重点进行评说，针砭时弊。其严格的审稿制度使它成为人民网正确引导舆论的重要平台。光明网的“文化日记”，创办于2006年11月30日，以独特的日记体形式，“逐日记载中华文化重要瞬间，适时把握和谐文化演进轨迹”，帮助网民以最短的时间及时掌握每天最重要的中国文化信息。这三大中央级新闻网站的获奖栏目，其内容或直击政府动态、或关注舆论焦点、或弘扬民族文化，各自展示自己的优势与特色。

红网的“百姓呼声”，创办于2001年5月1日，其基本定位是“聚焦百姓呼声、化解社会矛盾、关注国计民生、推进依法治国，做党委、政府与百姓沟通的桥梁”该栏目在反映群众呼声、开展舆论监督、化解社会矛盾方面尤为突出。胶东在线的“网上民声”，创办于2003年5月28日，以沟通政府部门与市民为主旨，关心群众热点，解决群众疑难。福建东南新闻网的“西岸时评”，创办于2002年9月5日，其基本定位是，“关注海西发展，感怀民生冷暖，评析时政热点”。这三家地方级新闻网站的获奖栏目，皆以民生、民意为重要关注点，反映了网络时代媒体突出的沟通功能与安全阀作用。

在网络专栏的评选上，显然，其内容的重要性，影响的深远性占据重要的地位。

网页设计

新闻网页设计是本届中国新闻奖网络新闻类新增设的评选类目之一。该类目对选送作品的基本要求是：新闻网站首页设计作品或新闻频道首页设计作品。评选标准是：主题鲜明，风格独特；能够完美、准确展示新闻内容、体现网站(新闻频道)首页功能性；布局合理、富于创新：细节精致、色彩协讽符合读者阅读习惯，体现新闻性、艺术性和网络特点的完美统一。因此，衡量一个网页设计是否优秀，要从更加多元的视角进行审视，主题、风格、功能、细节、色彩等都不能忽视，审美意义上的衡量占据十分重要的位置。

网站设计制作论文篇4

关键词：网站设计；课程改革；内容优化

中图分类号：TP393.09 文献标识码：A 文章编号：1009-3044（2016）17-0100-02

1 引言

“网站设计”是使用标识性语言，通过一系列策划、设计、建模、优化、开发步骤产生网站，最终以图形用户界面的形式展现给用户[1]。在计算机相关学科的教学中，网站设计课程是一门重要的专业课，其知识多、操作性强、课程难度较大[2]。

当前，各院校普遍开设了网站设计类课程，但是在其教学过程中，我们发现学生内驱力较弱、动手能力有限、学习主动性较差、动手能力不足、横向竞争力差等问题[3]。考虑到目前社会上对网站设计人员的需求，我们认为改革现有教学模式、提高学生实践能力、增加职业竞争力等，是亟须解决的问题。因此，对“网站设计”相关类课程进行改革势在必行。

2 文献综述

目前对网站设计类课程的改革研究体现在很多方面，例如：任锁平 [4]基于搜索引擎优化的视角下，探析教学资源网站设计策略。分别从策划层次、开发层次、界面设计层次、维护层次四个方面阐述了教学资源网站设计的策略。荣益 [5]从信息技术课程教学网站的需求分析与功能定位以及信息技术课程教学网站的内容设计两方面探讨了信息技术课程教学网站设计实现。张慧丽 [6]将Moodle平台应用到《网站设计与制作》课程教学中，采用问卷调查法对Moodle平台应用教学效果进行了分析。杨铭 [7]介绍了如何基于项目化实现网站设计与开发课程的教学内容，并总结了课程的特色与创新点。章早立 [8]讨论了基于“分层分类”理念的高职《网页制作与网站设计》课程教学新模式探究。郝静 [9]通过对近年来教学过程中课程教学模式的研究、教学方法和手段的改革的探讨，阐述如何在该课程中实现工作过程系统化的"教学做"合一。杨敬飞 [10]以文化洛阳网站的设计为例，讲述了如何在网页设计课程中应用项目教学法，将教学内容和教学目标巧妙地包含于项目设置之中。

然而，上述论文并没有从课程的内容结构上进行优化。“网站设计”课程的难点在于内容多而碎，需要较多的先修课程知识。本文拟从课程设置的角度出发，深入探讨如何设计该课程的内容，并以本人就职南京师范大学中北学院以来的教学经验，汇报作者对网络设计课程的授课计划。

3 方法

传统的“网站设计”类课程，仅包含基础的HTML语言、JavaScript语言、CSS+DIV、图像处理、动画制作。选取的软件仅包括网页三剑客之一与Photoshop的搭配处理。然而我们认为上述授课内容过于陈旧、没有紧跟前沿、缺少及时更新。为此，作者设置授课计划如表 1所示。

4 结果

实验对象选择南京师范大学中北学院2011级某班。通过问卷调查方式对改革前后的教学效果进行调查，共发出问卷33份，回收问卷33份，其中有效问卷32份，有效率96.97%。对回收的问卷通过Excel进行统计处理。表 2给出分析结果。

5 讨论

表 2可见，课程改革后，大部分学生认为新的课程知识面更广、内容更新颖、更适合自学、能提高学习效率、可激发想象力、使课堂变得更加有趣、并能推动学生课后学习。因此，我们认为对“网站设计”教学内容的重新规划是成功的。需要注意的是，新的课程内容需要至少72学时。对某些院校，教师反映仅分配36学时给“网站设计”课程，这种情况下本文提出的新的授课计划并不适用，需要进行删减。

6 结论与展望

本文通过提出了一种针对“课程设计”的授课内容改革探索，经过问卷调查证实其有效。下一步我们将要收集学生考试成绩，对其进行量化分析。此外，可以考虑引入双语教学[11]，以及将其他程序语言例如Matlab[12]嵌入到课程设计中去。

参考文献：

[1] 胡珍新. 基于计算思维的网站设计教学研究[J]. 计算机教育， 2014（20）：56-58.

[2] 费丽君. 基于JSP的农业院校的大学计算机基础教学网站设计研究[J]. 安徽农业科学， 2014，42（7）：2176-2177.

[3] 田久乐. 浅谈独立院校电子商务网站设计课程教学改革[J]. 中小企业管理与科技， 2014（13）：288-289.

[4] 任锁平. 搜索引擎优化视角下教学资源网站设计策略[J]. 自动化与仪器仪表， 2014（6）：194-196.

[5] 荣益. 探讨信息技术课程教学网站设计[J]. 计算机光盘软件与应用， 2014，17（18）：222-222.

[6] 张慧丽. 基于 Moodle平台的《网站设计与制作》教学应用研究[J]. 软件导刊教育技术， 2014，13（3）： 29-30.

[7] 杨铭. 基于项目化教学的网站设计与开发课程改革探索[J]. 学园， 2014（36）： 21-22.

[8] 章早立. 基于“分层分类”理念的高职《网页制作与网站设计》课程教学新模式探究[J]. 福建电脑， 2014，30（8）：146-147.

[9] 郝静. 学习领域课程教学模式和方法的研究――以动态网站设计与制作课程为例[J]. 湖北工业职业技术学院学报， 2014，27（2）：93-95.

[10] 杨敬飞. 项目教学法在艺术设计专业网页设计课程中的应用实践――以文化洛阳网站设计为例[J]. 美术教育研究， 2014（5）：122-124.

网站设计制作论文篇5

关键词：网页设计；案例教学；教学方法

中图分类号：TP393.092-4 文献标识码：A 文章编号：1007-9599(2011)23-0000-01

Vocational Colleges’"Web Design" Course Teaching Practice and Study

Teng Jipeng

(Jiaxing Nanyang Polytechnic,Jiaxing 314003,China)

Abstract:"Web Design" is the Vocational and Technical College computer class of a strong operational and practical courses.In this paper, "Web Design" course from the classroom teaching the theory,practice,and how to improve teaching and student interest in this course,and several other aspects are discussed.

Keywords:Web design;Case teaching;Teaching methods

一、明确教学目的，把握教学内容

基础学习很重要，要打好网页设计的基础。学完网页设计这门课程，学生最基本的是要掌握至少一门的网页编辑软件并制作出简单的页面。就此，老师来安排自己的教学。

（一）掌握一门好的网页制作工具。我认为，目前最好的网页制作工具是Dreamweaver。Dreamweaver一直以来作为可视网页编辑工作的标准，它在代码编辑和应用程序开发方面的功能比较强大。同时，制作网页中的动画素材可以选择Flash，处理和制作网页中的图片可以选择Fireworks，这三个软件具有良好的嵌入性，被称为“网页三剑客”。

（二）要求学生能够利用Dreamweaver设计各种网页，开发一定规模的网站

授课时以Dreamweaver为主线，讲授网页设计、HTML语言、CSS、Javascript语言及动态网页设计的基础知识。1.重视对HTML的教学，HTML可以说是网页的灵魂，网页的最基本构成是HTML标记符。熟练掌握了HTML语言，可以很轻松的修改你的网站的网页结构，而且对SEO网站优化很有用处，另外，无论是PHP、ASP、.NET、JSP等网站编程语言，都要用到HTML。所以说学习HTML是我们想想学习制作动态网页的基础。2.掌握CSS的基本使用。CSS就是一种叫做样式表的技术，也有的人称之为层叠样式表。在主页制作时采用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制，可以轻松地控制页面的布局。3.掌握Javascript脚本语言应用基础。Javascript语言简单，但功能强大，具体有几点功能：（1）制作网页特效。（2）提升使用性能。（3）窗口动态操作。（4）拜托现实环境的束缚。

所以，学生掌握Javascript脚本语言应用对网页制作有很大的帮助。

二、把握好课堂，多采用实例教学

（一）教学，首先要把握好课堂。一次课，90分钟的理论教学是枯燥和沉闷的，因此首先要在多媒体教学课件上下功夫。课堂教学的灵魂是多媒体教学课件，它不只是文字与图像的组合，还融合了音频、视频和动画信息等各种元素，使课堂变得更加生动和精彩，这样可以大大提高学生的学习兴趣。

（二）用实例作为课堂切入点。要想让课堂生动活跃，就要充分调动学生的学习积极性。为此，我们需要找到令学生感兴趣的内容作为切入点。网页设计是一门实践性很强的课程，教师可以用实例作为课堂切入点。课堂上可以先演示实例，让学生看到实际效果，引起学生学习兴趣，然后以实例引出具体知识点，将知识点融入到具体实例中。比如，在表格布局和内嵌框架的教学模块中，我们采用任务驱动教学内容如下表：

演示案例 制作一个介绍作者“川端康成”的站点，包含6个页面，主页为内嵌框架页，其余页面为“作者生平”、“作品简介”、“文学评论”等等。页面导航放置在表格左下位置，框架内放置目录中超链接的内容。

基本要求 在此案例中，再添加“经典文章”和“关于我们”两个内容，资料在网络中获取，适当设置网页的背景以及文本属性，页面美观大方。

较高要求 用此站点结构制作一个介绍自己的个人站点，要求至少包括6个页面以上，主页用内嵌框架结构，站点中导航清晰，布局合理美观大方。

三、多种形式的考核方式

根据高职院校的教学需要和课程教学特点，课程考核形式要能全面地评价学生的综合素质和技能应用能力。在高职网页课程的考核过程中可采用多种考核方式相互补充的多样化考核方式。这种考核方式更适合网页课程的特点，更加强调学生学习的灵活多样性。各高职院校的期末总评学习成绩可由三部分组成：过程考核（平时到课考勤、上课回答问题、课堂作业和阶段测验作品）占40%、技能考核（期末上机考试）占30%和期末考核（期末综合作品）占30%。这种考核方式注重实践操作和应用开发能力的培养，可大大发挥学生的学习积极性和主动性。可以以作品评价代替传统理论考试。要求学生在一定时间内完成一整个网站项目的设计与制作，项目中包含一个学期中所学过的全部知识点和技能点。其中三分之一时间浏览给出的网站素材，根据要求构思一个网站，写出该网站设计方案，网站设计方案要求包含网站主题、网站栏目设计、网站布局设计，另外三分之二时间制作页面，必须按网站设计方案的内容来制作页面。

《网页设计》课程是当前一种全新的教学内容，教师在教学中应将全新的教学理念运用于教学方法中，既让学生学会它的制作方法，又能在制作过程中充分体现创新性，从而能培养更多适应信息化社会的学习型和实用型网页设计人才。

四、其他方式

要想让学生学习掌握网页设计课程，单靠课堂教学还是不够的，可以在校园内举办一些网页设计的比赛，通过比赛，既可以更大的提高他们对此课程的积极性，也可让学生找到差距，激励他们努力，不断提高网页设计水平。

五、结束语

在教学过程中，从学生感兴趣的角度出发，对课堂理论教学、实例教学和课程实训等方面进行探索和改革，能使学生从被动学习转变为主动学习，提高其实践操作技能，拓展其知识面。在未来的社会中，网页在生活中所起的作用越来越重要，对这门课程的教学的要求是越来越高，教师的教学要适应科技的变化，要有改革进取的精神，培养能真正适应社会的人才。

参考文献：

[1]韩陵宜.高职院校《网页制作》课程教学的探讨.电脑知识与技术,2005

网站设计制作论文篇6

一、绪论 Flash网站设计是指用用Flash软件制作的网站，网页内容多数甚至全部是flash。Flash是一种创作工具，设计人员和开发人员可使用它来创建演示文稿、应用程序和其它允许用户交互的内容。Flash特别适用于创建通过Internet提供的内容，因为它的文件非常小。 本动漫网站的设计特点：构架是以flash为主要框架页面，结合一般的html网页构成；风格为主体颜色为棕色，有金属感、复古感。页面间切换时有动画效果，菜单、按钮、目录等也做了动态效果。主页共分迷你游戏、赏漫软件、精品动画、酷站导航、酷炫漫画、关于作品等六个导航按钮，每一个导航按钮指向一个具有独立内容的子页面。 二、网站涉及的开发工具与开发语言 （一）网站使用的开发工具 AdobePhotoshopCS2：作为图形图像处理软件，在falsh网站设计时一些图片素材如背景图片、按钮、LOGO等在载入flash库前有必要用Photoshop做适当的处理。 MacromediaFlash8.0Pro：该软件增强了为移动设备开发的功能,方便创建FlashWeb增强的网络视频，配合其内置的ActionScript2.0能够完美实现网站设计中所需要的各种动态效果和交互效果，而我此次所做的flash网站就是在MacromediaFlash8.0Pro的环境下制作。 AdobeDreamweaverCS3：Dreamveaver是一款功能强大的网站制作和维护工具，利用Dreamveaver能够实现所见即所得式的网页制作制作方式，只需像Word一样编辑页面，Dreamveaver会在后台自动生成其相应的HTML语句。在设计flash网站是我们会利用Dreamveaver设计一些简单的页面配合flash设计的网站主体形成更加内容丰富、更加具有实用性的网站。 （二）网站开发语言 ActionScript2.0：ActionScript是用来向Flash应用程序添加交互性的语言，此类应用程序可以是简单的SWF动画文件，也可以是更复杂的功能丰富的Internet应用程序。 HTML：HTML文件是用ASCLL代码编写成的，可以保存为最简单的TXT文本文件，这样用任何一个文字处理软件都可以进行编写，这也是他能够迅速迅速普及，并十分受欢迎的一个原因。 三、网站设计中的各种技术解析 （一）主页界面设计解析 1、flash网站加载时的进度条设计。 2、网站LOGO与站名设计 网站LOGO设计：（1）新建图形元件“元件42”；（2）利用矩形工具建立一个白色矩形，在矩形正中建立一稍小些的背景色矩形形成白色矩形框；（3）利用任意变形工具将白色矩形框变形成为白色平行四边形框。用线条工具进行分割裁剪，旋转变换得到要设计的网站LOGO。 站名设计：（1）新建图形元件“元件17”；（2）利用文本工具输入本站名称“动漫主题网站”，另起一行输入网址；（3）选中站名将字体字号设，进行属性设计。3、网站导航条的设计（1）新建图形元件“元件22”，作为导航条背景；（2）建立6个图形元件分别在各元件中设计各导航按钮文字；（3）给每个按钮附加动作。 4、进入主页界面前动态效果设计 （1）新建图形元件“元件29”，创建长条图行，作为三个小窗口推荐酷站、本站作品、站内更新的上框；（2）新建图像元件，在其上创建与小窗口等大的白色和背景色的矩形色块，在不同图层中各小窗口的上框和窗体依次在时间轴上载入并做形状补间动画；（3）导航条、网页头尾的图片条以相同方式在时间轴上依次载入并做形状补间效果，就可以完全载入主页界面获得完整的主页框架界面。 5、进入主页时的音效设置：（1）挑选合适的音效载入库中；（2）选择适当的音效添加到时间轴上的适当位置，使动态效果更具表现力。 （二）“迷你游戏”flash子页面设计 子页面载入特效设计：子页面载入特效在多个页面中都有应用，此处的特效所采用的技术是依次在时间轴的适当位置利用图形元件的alpha值、亮度的调节及形状的改变做成补间动画来实现的。 （三）“赏漫软件”flash子页面设计：“赏漫软件”目录的制作，赏漫软件目录的制作大体上与游戏目录相仿，所不同的是不需要转换和滑动，也就比游戏目录要好做多，同时目录中软件按钮的制作也和游戏目录中按钮一样，按钮附加动作代码：on（press）{unloadMovieNum（3）;loadMovieNum（"此处最好填所连接swf文件的相对位置",2）;}；赏漫软件的图片文字介绍部分制作，该部分是以一个小的swf文件单独存在的，在点击软件按钮时会载入相应的swf文件在界面的适当位置。 （四）“精品动画”flash子页面设计：“精品动画”flash子页面是一个与前几个子页面略有不同的子页面，页面的设计风格与前几个页面有些许差异，不规则的背景使得页面整体显得翘起生动。 四、结论 Flash网站具有设计精美，拥有更多声效、动画、流媒体剪辑、美术效果及兼顾互动性等特征，非常适合公司作在线产品展示。制作全Flash网站和制作html网站类似，事先应先在纸上画出结构关系图，Flash网站基本以图形和动画为主，所以比较适合做那些文字内容不太多，以平面、动画效果为主的应用。

网站设计制作论文篇7

【关键词】网页制作 HTML 教学改革 一体化教学

一、课程在专业中的地位与作用

《网页设计与制作》课程是计算机专业、电子商务等专业的一门专业课程，是一门实践性很强的专业技术基础课程，又是一门主干课程，是为加强对学生技术应用能力的培养而开设的综合性课程，它涵盖了HTML语言 Dreamweaver、photoshop、Flash等相关知识，全面介绍WEB站点开发、设计、制作、维护等技术。通过本课程的学习，使学生掌握该软件的操作方法和操作技巧，学会运用其创建个人网站、具备一定的网站设计能力，学会网站的测试、维护、及推广等。通过实例的讲解，让学生掌握网页制作和网站开发的知识。从如何策划网站、收集网站资料、准备素材、各个页面的逻辑关系和链接的建立到网站动态系统的开发，如何申请空间和域名，如何上传网站以及网站测试、维护、及推广等。

二、课程学习目标

通过本课程的学习，使学生掌握 HTML 语言的语法规则及文字、链接、列表、表格、表单、图像、多媒体、框架元素标签及属性，能设计出多窗口网页、动态网页；能熟练运用Dreamweaver进行网站的导入、规划、管理、的相关技术及网页制作的操作技能；能熟练运用photoshop、进行图片处理，能熟练运用Flash制作网页动画；能维护、管理和设计WEB应用程序；能独立设计WEB站点。

（一）通过综合实训进一步巩固、深化和扩展学生的理论知识与专业技能。

（1）掌握规划网站的内容结构、目录结构、链接结构的方法。

（2）熟练掌握网页制作软件Dreamweaver cs5的基本操作和使用技能。

（3）掌握页面的整体控制和头部内容设置的方法。

（4）熟练掌握网页页面布局的各种方法。

（5）熟练掌握在网页中输入、设置标题和正文文字的方法。

（6）熟练掌握在网页中插入图像、flas、背景音乐的方法。

（7）掌握建立各种形式超级链接的方法。

（8）掌握表单网页制作方法。

（9）掌握网页特效的制作方法。

（10）掌握网站测试的方法。

（二）训练和培养学生获取信息和处理信息的能力，充分培养和提高学生的动手能力，学会通过网站、书籍、素材光盘等方式收集所需的文字资料、图像资料、flas和网页特效等。

（三）培养学生运用所学的理论知识和技能解决网站开发过程中所遇到的实际问题的能力及其基本工作素质。

（四）培养学生理论联系实际的工作作风、严肃认真的科学态度以及独立工作的能力，树立自信心。

（五）训练和培养团队协作精神和共同开发网站的综合能力。

三、考试、考核课改思路

本门课程的传统教学方法是采取全课堂制授课方法，考核的方法也大都采用统一试卷的考核方式，学生所学的知识大部分集中在理论基础方面，进而偏离了当今《网页设计与制作》的发展方向。

在“教学做一体化”的教学模式中为了培养和突出学生的能力，故在实践教学中突出以学生“做”为主，就是要像在企业里一样，只给你要求说明或样板，自己用所学知识自己设计、自己制作，然后由全班评选出最好的作品出来。所以在实际教学中也以此为主线来教学，多种教学方法相结合帮助学生学的好，做的更好。

（一）把理论教学穿插在课堂始终的教学理念

以前《网页设计与制作》教学是分开讲的，在实践课上学生比较活跃，而在理论课上学生觉得没用听得累，老师讲得“累”，觉得自己的辛苦不被学生所接纳，心“累”。为了改变这种现状，在教学计划里压缩了单纯的理论课，在学生实际操作时，再将运用到的理论知识，理论指导实践。

（二）基于工作过程为导向，突出学生“做”的重要性

“教学做一体化”的教学模式在教学实施中把课堂教学转向工作情境，课堂由教师为主转向以学生为中心，在教学中把课程分为几大模块，每一个模块又分成几个项目实施教学，每一个项目又划分成几个小任务，这些小任务由几个基本操作去完成。教师只要说清楚课堂要完成的作品和课后作业的要求，让他们在课堂照着案例做，每一个小任务要求用10分钟时间做，教师巡视并作个别指导，10分钟后教师根据学生提出的问题和自己的观察及经验分析难点，演示讲解，学生再继续做，如此反复，按计划完成一个项目。

“教学做一体化”的教学模式产生了很好教学效果，主要体现在学生们的问题多并能及时询问，学生之间互相学习和比拼，不再为交作业而做作业，而是把它作为衡量自己能力和展示才华的一次机会，为他们将来走上工作岗位奠定了坚实的基础。

（三）多种教学方法结合

鉴于学生的基础和接受能力的差别，课堂教学重点之一是教法设计，教师根据所教模块的特点，采用灵活多样的教学方式。在教学中首先采用项目教学法贯穿始终，在授课中，采用项目要求说明一学生做，老师巡视指导一讲解示范一训练纠正一师生共评的基于工作过程的项目方式教学，更有利于学生在“做”中学，学习如何完成任务、与人合作、解决实际问题，这些能力是就业必不可少的。

建立帮助小组，对底子薄的同学多关注，留意他是否也能按时完成或遇到那些需要及时解决的问题，使大家顺利完成各项任务。在教学过程中也可以适当应用问题教学法，提高学生的学习兴趣，精讲多练，达到了“教学做一体化”满意的教学效果。

四、开展“过程考核”考试的效果

开展“过程考核”教学，调动了学生的学习兴趣，通过对商务3131班40名学生的调查表明，实践证明，该教学方法收到了良好的教学效果。

网站设计制作论文篇8

1 实验网站总体设计

1.1 网站整体功能

现代教育技术实验教学网站的主要功能是辅助公共课实验教学，为师生提供交流互动的平台。因此，网站应具有如下功能：

(1)提供丰富的教学素材，方便学生练习。

(2)为师生提供信息存储，学科教师可以将教学信息、教学参考资料、教案和课件到网站中，学生可以将自己的作业或实验报告到网站中。

(3)提供在线学习、进行虚拟实验和实验报告提交等，实现师生互动。

(4)能够提供相关信息的下载，如相关教学资料、软件、课件等。

(5)能为教师提供网站管理的能力，如学生的注册，对网站的相关信息进行有效管理(增加、删除、修改)；开辟教学论坛、供师生互动。

1.2 网站设计原则

(1)服务于实验教学

教学网站的功能主要是为实验教学服务，因此要体现实验特色，在呈现实验内容、了解实验注意事项的基础上，结合实际情况，突出实验特色栏目，让学生进行在线虚拟实验。(2)简洁明了原则教学网站主要是为教学服务，因此设计制作时应以教学为中心，版面结构、颜色、字体要简洁明了，网站导航清晰明确，某些指示性的图形含义要前后保持一致，整个网站的页面风格统一。

(3)维护、管理方便，安全性高

在设计网站时就要提高数据的安全性，降低管理、维护网站的成本。后台的管理要做到简单易行，操作方便。数据库要采用一定的安全机制，提供数据信息的授权访问，防止随意删改。此部分功能主要依赖校园精品课网站制作系统完成。

2 实验网站教学设计

2.1 学习资源设计

实验教学网站根据不同教学内容设置了结构化学习资源，如：背景材料、讲解性材料、案例、练习、测试等；非结构化学习资源，如：教师的引导与回应、学习伙伴、主题同步讨论、主题异步讨论、外部链接等。

2.2 学习策略设计

为避免简单静态或少有变化的教学方式,实验网站中综合运用讲授策略、先行组织者策略、抛锚策略、教练策略、随机进入策略、反思策略进行实验教学。

2.3 学习活动设计

学习活动是网站教学设计的核心，主要表现为学习任务的设计，学习任务规定学习者所要完成的学习目标、成果形式、活动内容、活动策略和方法来引发学习者内部的认知加工和思维。从而达到发展学习者心理机能的目的。本网站从学生与教材、教师与学生、学生与学生3个角度设计了课程的教学互动，包括了：导学活动(网上学习指导、课程引导、师生见面、学习风格调查问卷等)、辅导活动(头脑风暴讨论、辩论讨论、问题讨论、问题答疑、邮件答疑等)。

3 实验网站模块设计

3.1 结构设计

本课程网站在结构的设计上以前面设计的实验内容为框架，按模块与任务进行选择，在各任务内部根据知识点之间的联系设置如图1的超文本链接结构。

3.2 界面设计

网站界面设计的优劣将直接影响学习者的学习兴趣和学习效率。因此在设计界面时，根据教学内容和使用对象的特点，力求做到界面友好，操作方便，交互性、可控性强。具体遵循以下几项基本原则：

(1)界面设计风格统一，如字体、标签风格、颜色、术语、显示提示信息等；

(2)界面层次结构清晰；

(3)界面能适当提供反馈信息，如对话框、状态栏、声音提示、错误提示等；

(4)容错性高，避免一些可预料的错误对学习者思路造成中断。基于以上要求，设计的界面如图2所示：

3.3 导航设计

导航可以为学习者提供学习路径指导，帮助学习者快速获得需要学习的资料，避免偏离课程目标。本课的导航设计以学习者为中心，重在体现信息的明确性。导航设计具体、完整，可以让用户获得整个实验网站范围内的全域性导航，按钮、快捷操作键等操作简单，能做到随进随出，起到高效引导的作用。

3.4 系统实现

课程网站综合使用3DMax，VRML，QuiekTimeVR，Flash，Html，Css，Javascript，Asp完成网站的制作。效果图如图4所示：

3.4.1 网站效果图

3.4.2 虚拟实验效果图

3.4.3 网站互动教学版块中主题讨论模块的部分代码：

(1)几个必要的文件：数据库，用来储存发表的帖子，命名为b b s.mdb；有数据库就必须连接数据库，该文件用来连接数据库，命名为conn.asp；发表帖子的文件，命名为say.asp；保存发表帖子内容的文件，命名为save.asp；显示帖子标题的文件，命名为index.asp；显示帖子内容的文件，即点击标题后所进入的页面，命名为show.asp。

(2)bbs.mdb打开这个数据库，建立一个表，命名为bbs。该表中有几个字段：id(自动给帖子编号)，其数据类型设为“自动编号”；name(用来储存帖子的作者)，数据类型为“文本”；title(用来储存帖子的主题)，数据类型为“文本”；body(用来储存帖子的内容)，数据类型为“备注”。(3)conn.asp源代码为：< % S e r v e r . s c r i p t T i m e o u t = " 1 0 "connstr="DBQ="+server.mappath("bbs.mdb")+";DefaultDir=;DRIVER={Microsoft Access Driver(*.mdb)};"set conn=Server.CreateObject("ADODB.connection")conn.open connstr%>(4)say.asp 源代码为：form method="POST" action="save.asp">大名：<input type="text" name="name" size="20">标题：<input type="text" name="title" size="91">内容：<textarea rows="11" name="body" cols="97"></textarea><input type="submit" value="提交" name="B1"><inputtype="reset" value="重置" name="B2"> </form>(5)save.asp 源代码：<!--#include file="conn.asp"--><%name=Replace(Request.Form("name"),"’","’’")title=Replace(Request.Form("title"),"’","’’")body=Replace(Request.Form("body"),"’","’’") %><%if name="" or title="" or body="" then%>请<a href="javascript：history.go(-1)">后退</a>填写完整资料，你才能发表帖子！<%else%><%setsavebbs=conn.execute("insert intobbs(name,title,body)values(’"&name&"’,’"&title&"’,’"&body&"’)")%>发表成功！<a href="index.asp">查看帖子</a><%end ifset savebbs=nothing %>

网站设计制作论文篇9

关键词：学习环境（PBLEs）；网站设计；心智技能

中图分类号： 文献标识码：A 文章编号：1672-7800（2014）003-0168-03

作者简介：秦书荣（1987-），女，硕士，广东农工商职业技术学院艺术系实验员，研究方向为网站建设、三维动画设计、影视后期制作；李新（1981-），男，广东农工商职业技术学院艺术系讲师，研究方向为影视后期制作、新媒体艺术设计、美术学。

0 引言

为了回答“高职高专院校在网页设计课程的教学中，如何使学生具备旨在适用的网页设计心智技能”这一问题，研究者不约而同地聚焦基于问题的学习环境（PBLEs）这一关键词，并普遍认同，问题的解决是在职业技能培养过程中广泛采用的学习活动方式。从实践层面出发，学生网页设计心智技能习得的成败与基于问题的学习环境设计密切相关。同时，谈及学习环境的设计，无疑需要关注认知心理学领域心智技能培养的理论研究。毕竟，只有依据人的心理工作方式设计的学习环境才能促使学生进行有意义的学习[1]。

本文将从培养“网页设计师”这一视角，关注学生网页设计心智技能的形成，着力为网页设计课程引入认知心理学领域的心智技能培养研究结论，并依托案例，论述如何将心智技能研究合理有效地应用到基于问题的学习环境设计中，从而促进学生适用的职业技能形成。

1 网页设计心智技能与基于问题的学习环境

1.1 网页设计心智技能

借鉴我国教育心理学家冯忠良教授关于心智技能的观点，可将网页设计心智技能视为在网站构思、设计、制作过程中通过有目的、有计划的学习或练习而形成的，用以调节和控制解读分析客户需求、构思网站的局部与整体、设计网页各部分要素及制作与整合网站各部分的一系列合乎网页设计规则的思维、方法和经验。

1.2 基于问题的学习环境

戴维·H·乔纳森将基于问题的学习环境（PBLEs）描述为“以问题解决为核心，相关案例、信息资源、认知工具、会话或协作工具及社会或境脉五要素为支撑的学习环境，其最主要的特征就是为学生提供脚手架支持的问题来驱动学生开展问题解决的学习活动[2]。

根据Merrill的观点，“有效教学就是‘问题为中心’的教学”[3]。上述两个关键词之间存在相辅相承的关系。一方面，心智技能研究结论将为基于问题的网页设计学习环境提供认知心理学的理论依据；另一方面，基于问题的学习是网页设计心智技能培养实践活动中广泛采用的方式。

2 心智技能三阶段理论对网页设计心智技能形成的启示

冯忠良教授认为，心智技能形成需要经过原型定向、原型操作及原型内化3个基本阶段。所谓原型，可以理解为外化的心智活动的实践模式[4]。本研究认为，网页设计心智技能的形成同样要经历上述3个阶段。而“原型”作为贯穿心智技能形成的核心，其建构意义重大。本文的先期研究在对已经具备了网页设计心智技能的熟手问卷调查基础上，利用“心理模拟法”创拟了“网页设计活动原型”，如图1所示， 本研究将讨论如何利用该原型展开三阶段的培养。

对学生而言，网页设计活动的原型定向往往需要教师的示范和讲解，那么教师首先应该使学生明确网页设计活动原型的结构、各个环节的操作原则及必要性并利用脚手架支持的问题来驱动启发学生的主动性和自觉性；然后按照原型正确示范和讲解完成某一网站建设任务的完整过程。这里需要强调的是，教师需要将原型中每一个心智动作详细展开。原型定向阶段的教学，只是网页设计活动心智技能教学的开端，要使学生真正形成心智技能，还需要进行实际操作。

学生利用上述在定向阶段形成的原型，亲自从事某一网页设计活动，将在头脑中建立起来的活动程序计划以外显的方式付诸执行。在这个阶段，应该借助脚手架支持问题来驱动学生利用原型，把构成这一活动的所有动作系列，依照一定的顺序作出不能遗漏和缺失，教师可以提出以下要求：①要根据“原型“严格遵循动作序列逐一执行，及时检查和矫正动作的执行情况；②学生在实践模式的每个环节提交一些阶段性材料或者记录一些完成过程来保证是按照实践模式的步骤完成任务的；③建议学生将动作执行和言语相结合，边说边做。

网页设计心智技能的原型内化阶段是将上述实践模式向头脑内部转化的过程，表现为学生从事网站建设任务时可以离开实践模式，借助语言指导来完成。学生只有在多种不同的实践条件下反复进行网站建设的具体活动，才能不断从原型中抽取本质的东西，最后形成普遍适用于不同实践条件的原型（心智技能），只有到这一步心智技能才算真正形成。

3 一个充分体现心智技能三阶段理论的PBLEs设计

在网页心智技能培养三阶段理论的指导下，学习环境设计比较合理的安排是：首先依托一个充分体现原型的范例讲解和操作，完成活动原型中蕴含的相关知识和操作流程的讲解，初步形成“原型定向”。这一阶段教师应该关注脚手架支持的问题设计。然后，实施基于项目的学习，指导学生利用课后时间自主完成几项网站建设的综合任务，将原型进行操作和内化，最终使学生具备网页设计心智技能。下面就从“原型定向”阶段PBLEs设计最关注的脚手架支持问题展开叙述。

在“原型定向”阶段，教师需要提取“网页设计活动基本原型（如图1）”中的4个核心环节，然后把这4个核心环节中蕴含的相关知识和操作流程设计成脚手架支持的问题，继而通过教师逐步示范和讲解一系列问题的解决过程，完成网页设计活动的定向。例如，附件网页设计活动原型定向阶段PBLEs设计方案中，对应“网站方案设计环节”的学习内容，将其转化成9个具体的脚手架问题。它们分别对应网站建设过程中“需求分析”、“系统分析”、“风格设计”、“UI版面初步布局”、“色彩定位”及“网站建设日程规划”等重要学习内容。这些脚手架支持的问题是以完成“网站方案设计”这一环节为驱动力而提出的，将引发和维持学生在该学习阶段中的学习兴趣和动机，引导他们带着明确的问题与目标，模仿教师的示范行为，开展真实的问题解决过程。在脚手架支持的问题设计方面，教师需要依据学生能力临近发展水平，问题难度要居于该临近发展区内，这样学生就可以调动己有的网页设计基础知识及操作技能等认知经验来解决当前面临的脚手架问题。

网页设计活动是一个渐进过程，脚手架支持的问题是依照这个渐进过程的发展顺序提出的，难度一般是逐级升高。因此，在设计这些脚手架支持的问题时，还需要注意合理安排难点和重点、考虑子任务的大小、所需知识技能含量、相关影响因素等多个方面。根据问题的难度，我们提供了支持指导、相关案例、辅助资料等，并创设必要的实践条件，使问题解决具有操作性。这一阶段，还要求教师关注各个问题解决的策略选择和转换的讲解、示范及独立、协作及竞争等组织策略的合理运用。而学生则以教师演示的优秀范例为榜样，利用大量的相关案例、信息资源、认知工具、协作工具及境脉等展开原型的定向学习。事实上，教师演示如何根据客户要求完成网站建设任务的过程就充分体现了网页设计活动原型的范例，这将给予学生解决问题的逻辑结构和方法过程，它包含了一种内在的逻辑，为学生提供了支架，通过对范例的学习，学生可以模仿其中的路径和方法，从而完成原型的定向。

在原型的操作阶段，比较适合采用基于项目的学习方式，即教师布置几个不同的网站建设任务，以完成作品为驱动，通过一系列脚手架支持的问题来引导学生利用上一阶段获得的网页设计活动原型完成网站建设。这一阶段要求学生依照一定的顺序，不能遗漏和缺失地作出原型定向中的所有动作系列。该阶段的重点在于任务的设计，我们设计了以“个人网站”、“品牌推广网站”及“公司企业网站”为主题的具体项目。这3个项目的难度逐级升高，有一定的挑战性。教师还需要提供支持指导和辅助材料，并创设必要的实践条件，使任务具有可操作性，这样，学习者就能够在实践中掌握问题解决技能和方法。

在原型内化阶段，学生所从事的网站建设任务是可以离开实践模式的。教师需要为学生提供在多种不同的实践条件下反复进行网站建设活动的机会。例如，我们设计了以“小组为团队”，为本学院设计制作一个学院网站这一具体任务，期望学生通过不同的实践过程，不断的从操作原型中抽取更本质的东西，最后形成普遍适用于不同实践条件的心智技能。

案例：网页设计活动原型定向阶段的脚手架支持问题设计。

客户要求：XX化妆品公司预借助互联网塑造良好的企业和产品形象，提高品牌知名度、美誉度和特色度。针对这这次品牌推广，我公司公开竞标，请有合作意向的设计团队于本月底之前提交设计方案及网站一稿，我方将从提交的方案和初稿中挑选出最满意的设计，并与其设计团队正式签约，预付30%的定金。同时，我们将提供企业LOGO、广告语、企业品牌发展历史、品牌产品的图片，推广活动视频等资料。

学习目的：学生通过观察、模仿学习教师是如何根据客户要求完成网站建设任务的完整过程。

脚手架支持的问题设计：

（1）网站方案设计环节的学习。

脚手架支持的问题：

①接到企业网站建设任务后，作为网页设计师的我们首先要作什么？

②如何与客户沟通，提取与网站任务相关的关键词，解读网站主题，分析市场前景？

③从哪些方面分析目标用户群体特征？

④如何结合网站主题、目标用户群体特征、企业机构已有VI色彩特征、客户提供的原始素材等确定网站的主色？

⑤鉴于主色，如何依据色彩设计原则（互补色，分裂互补三色组，类似色搭配原则等），确定网站整体的色彩定位？

⑥如何根据网站主题和信息量大小，结合布局特征，选择适用的UI版面布局？

⑦结合客户的要求及公司或机构的性质，如何对网站的功能模块进行规划设计，绘制出网站层次结构图，描述各功能模块及作用？

⑧如何展开网站的风格设计？你了解常用的网站风格设计原则吗？

⑨结合上述分析，如何撰写网站设计方案？

（2）主要页面效果的设计与制作环节的学习。

脚手架支持的问题：

①根据网站设计方案中确定的页面尺寸，色彩定位，UI版面布局设计，风格设计，功能模块设计等信息，利用“PhotoShop”完成页面效果图设计的步骤和方法是什么？

②利用“Firework”制作网页切片的技巧和原则是什么？

（3）基于Htnl+CSS技术的网页基本制作环节的学习。

脚手架支持的问题：

专家熟手利用html+CSS技术制作网页有什么技巧？在制作过程可能遇到什么样的难题，该如何应对？

（4）网页动画效果设计与制作环节的学习。

脚手架支持的问题：

①如何利用JavaScript或Flash技术炫动你的网页？给页面添加动画的时候有什么需要注意的地方？

②完整的较为准确的三维动画建模创作流程是怎样的？

③三维动画建模活动中，“创意构思”、“模型设计”及“模型制作”这3个关键环节的目的、过程及阶段性成果分别是什么？

任务活动：结合自己的建模经验说明三维动画建模活动的完整流程，然后小组交流。

问题思考：①如何进行创意构思？②如何进行模型设计？③如何进行模型制作？

任务活动：①仔细聆听教师的范例讲解，然后借助因特网资料展开品牌场景的创意构思、设计与制作的活动，创建场景模型形成阶段性成果和建模作品；②交流和评价其他人的作品，通过竞争选出3个最优秀的场景模型。

范例讲解：展示了完成企业品牌场景任务的建模过程（审题、构思、设计、制作）。

4 结语

PBLEs作为网页设计心智技能形成的关键，应该广泛引起教学实践者的关注。基于问题的学习始终应该在构建一个有意义的、真实的任务情境下，提供给学习者一系列基于案例的脚手架支持的问题，继而通过专家熟练的示范让学生明确完成任务的思维过程和问题求解的方法。在这样的学习环境中，教师承担着教练或导师的角色，需要促进学习者进行社会协商，并同步或异步的给予协助和指导。另外，后续研究应该关注学生网页设计活动原型的内化，比较适合采用基于项目的学习。该学习过程是拟真的、映射真实世界的生产活动，依照学习者的自我想法和方式来完成建站任务。只有经过这样的完整训练，学生才能真正形成网页设计心智技能，从而满足业界对网站前端设计人才的职业技能需求。

参考文献：

[1] 高文.学会用技术解决问题—一个建构主义者的视角[M].北京：教育科学出版社.2007：5-14.

[2] DAVID H JONASSEN， DEMEI SHEN， ROSE M MARRA， et al .Engaging and Supporting Problem Solving in Engineering EthicsDavid[J].Journal of Engineering Education， Washington， 2009，98（3）.

[3] 祝智庭，顾小清.教学设计和技术的趋势与问题[M].第2版.华东师范大学出版社，2002：91.

[4] 冯忠良.结构化与定向化教学心理学原理[M]. 北京：北京师范大学出版社，1998： 29.

[5] 秦书荣，李冬睿，梁仲佳.网页设计活动原型构建研究[J].软件导刊，2013（9）：144.

Research on the Mental Skills of Web Designing Under PBLEs

网站设计制作论文篇10

关键词：WebQuest教学模式；计算机基础课；教学案例设计；网站制作

中图分类号：G633.98 文献标志码：A 文章编号：1674-9324（2014）25-0169-03

一、WebQuest教学模式的含义及组成

WebQuest教学模式中的“web”指的是“网络”，“Quest”指的是“探究”、“调查”、“寻求”，WebQuest指一种基于网络的“专题探究”活动，是一种在网络环境下由教师引导，以一定任务驱动学生自主探究学习的教学方式，它主要是通过学生的自主学习和合作学习，培养学生获取信息、分析信息、评价信息并运用信息解决问题的能力，以及交流与合作的能力。

二、WebQuest教学模式的实施案例

[教学内容分析]：中国石油大学出版社出版的《计算机文化基础》的第八章提到了网页制作内容，要求学生通过课堂学习能掌握网站和网页的制作，特别是能动手制作个人网站展示自己，让更多的人通过网络来了解自己。而这对于学生来说，也是有一定吸引力的，对于这种能解决实际问题的学习内容，大多学生都表现出一定的兴趣，并且学习的愿望特别强烈。

[教学目标分析]：知识目标：认识网站和网页的设计原则；了解网站的和维护流程；使用FrontPage2003新建站点和网页；在网页中编辑文字和图片；熟练利用表格进行内容定位和页面布局；文本图片等各类信息的超级链接设置；利用框架制作导航栏页面。技能目标：采用任务驱动、小组教学的方式，以学生自主探究、协作学习为主，教师提供课堂讲解与学习资源为辅，两者结合让学生掌握网页制作的各章节知识，培养学生利用计算机网络自主学习的能力，提高学生自主学习能力和动手能力。情感目标：培养学生高尚的审美情操，使学生能够热爱美、欣赏美、创造美；鼓励学生发展个性，通过学生自己做的作品，培养学生的探索创新精神、团队合作精神。

[学习者特征分析]：本案例的学习者是大二绘画专业二班学生，该班级有美术功底，对网站美观度有独到的见解。在一年级开设过PhotoShop图像处理课程，具备图形图像处理能力。

[案例介绍]：随着计算机网络的兴起，越来越多的人开始接触并了解互联网，在互联网上浏览新闻、查资料、发邮件、找工作已经成了非常普通的事情。互联网上信息的大部分都是通过网站的形式的，比如说想看新闻可以去中华新闻网等，发邮件需要访问163邮箱等，查资料上百度网站等。那平常同学们都是上网去访问别人做好的网站，有没有想过有一天可以在互联网上访问属于自己的网站，让更多的人去了解自己，向更多的人去展示自己的绘画作品呢？今天我们就来学习如何制作并网站。

1.任务。本章内容学习时间为三周，学习任务是制作网站。该任务由三个子任务组成，每个子任务均由各学习小组课下完成，在每周的课堂时间上进行任务成果展示和讨论。子任务一：认识网页，任务完成形式：PowerPoint课件；子任务二：设计网页，任务完成形式：小组自行设计的网页单页；子任务三：制作网站，任务完成形式：小组网站。

2.教学环境及资源准备。教材：石油大学出版社《计算机文化基础》的第八章。FrontPage 2003视频教程：网页设计欣赏，网页设计作品http：///html/59/网页设计图片作品欣赏http：///show/s118/教师提供的网站评价体系表。

3.教学过程。第一阶段：认识网页。第一步：组成一个合作小组。第二步：上网查找资料（文字资料、图片资料、视频资料等），浏览各类典型网站或网页设计类网站，利用屏幕切图保存有价值的图片。第三步：分门别类地归纳汇总网站的设计排版类型，如按功能分类、按布局分类等，并配以图片解释，形成小组初步成果PPT。第四步：课堂展示。作品赏析：小组成员向其他小组讲解自己的PPT，介绍本组对网页的设计分类，演示成果；过程反思；填写分工表。第五步：教师组织学生分别讨论网站和网页的设计原则，进行总结归纳。第二阶段：设计网页。第一步：小组讨论创建小组网站的主题，确定网站主题和风格。第二步：围绕网站主题和风格，充分利用学生的美术知识背景，要求每位学生用电脑设计一幅网页设计图，可以上网查找资料（文字资料、图片资料、视频资料等）。第三步：小组内部评价推荐出最好的设计图，并以该设计图为核心局部修改其他网页设计图，以形成网站的统一风格。第四步：教师指点用图像软件把网页设计图切割为网页的方法，并提示学生在切割时考虑需要注意哪些事项。小组讨论切割方法，将设计图做成合理的网页形式。第五步：课堂展示。作品赏析：小组成员向其他小组讲解自己组的设计，介绍本组对网页的设计思想和演示成果；过程反思：小组陈述在讨论和制作过程中所遇到的困难和解决办法，并分享过程中的体验及所学到的知识；填写分工表：小组成员要清楚列出分工细节，对细节进行量化描述，让教师了解小组成员间的分工情况。第六步：小组间互评，互相学习各组的优点，找到自身不足的地方，进行改进。第三阶段：制作网站。第一步：小组认真学习资料资源，仔细研究教师给出的网站评价体系。第二步：小组搜集网站相关资料，丰富各网页内容，不断地补充修改设计，并记录好制作修改过程，最后确定完成小组网站最终稿提交。第三步：课堂展示。作品赏析：小组推荐某成员向其他小组讲解展示自己组的网站，演示成果；负责演示的角色要由小组内各成员轮流担任；评价反思：采用教师之前提供的网站评价体系表来对各组的网站进行评价，包括组内评价和组间评价。在互评过程中有学生成员发现问题，该评价体系并不能非常完整详细的把每个网站的优劣体现出来。经各小组讨论，最后得出一份新的网站评价指标明细表，通过该表对各小组网站重新进行了评价。第四步：教师对学生制作网站的知识点进行归纳讲解，帮助学生对掌握的知识进行系统的梳理。第五步：各小组通过评价结果和教师指导对网站进行局部修改。第六步：教师展示网站的流程，在教师帮助下各小组在互联网上自己组的网站，并邀请朋友浏览观看。

4.填写分工表：小组成员要清楚列出分工细节，对细节进行量化描述，让教师了解小组成员间的分工情况。

5.评价方法。评价主要通过三个方面来进行：（1）组内自评。做完任务之后，首先进行小组内部自评，自评时尽量要客观，形成评价报告。（2）组间互评。小组之间通过展示环节观看对方的作品进行互评，互评时要客观，不能互相攻击。（3）教师评价。主要通过学生撰写提交的各项小组成果、小组分工表和评价报告，采用事先制定的评价体系表来进行评价。

WebQuest教学模式是一种在网络环境下由教师引导，以一定任务驱动学生自主探究学习的教学方式，它主要是通过学生的自主学习和合作学习，培养学生收集信息和处理信息的能力、分析和解决问题的能力以及交流与合作的能力。

本案例采用WebQuest教学模式进行教学设计，教师在教学的三个阶段设定不同的任务，引导学生自主学习教学内容，灵活使用信息搜集和分析处理能力，通过小组合作完成任务提交成果。本案例中的评价存在于教学过程中的每个阶段，包括自我评价、组内评价和组间评价，学生通过评价发现任务的不足进而及时修改完善作品成果。本案例在学生学习新知识的同时，还锻炼了学生运用刚刚学过的网络基础知识，有效地利用信息技术环境和网络资源来学习，提高了学生的信息搜集和处理能力。

参考文献：

[1]奚晓霞，罗会棣.基于WebQuest的建构探究学习模式[J].电化教育研究，2004，（2）.

[2]郝丽华.基于WebQuest教学模式的大学英语教学实例研究[J].三峡大学学报（人文社会科学版），2011，（6）.

[3]田洁，王黎.基于WebQuest的高中英语课堂教学设计[J].中小学电教，2010，（5）.