网页设计与制作课程实践能力培养策略

郑德忠

摘要：网页设计与制作课程实践性很强，如何创新教学，将“教、学、练、做”有机融为一体，培养学生实践应用能力是探究的目的。通过在教学过程中贯穿案例项目，加入“竞赛+实例”模式，充分激发学生的学习兴趣，挖掘学习潜能，从而有效提高学生的实战应用能力和创新能力。

关键词：实践能力；案例项目；任务驱动；竞赛+实例；团队协作

中图分类号：TP37 文献标识码：A 文章编号：1009-3044（2017）05-0175-02

信息化和网络化是现代社会的标志，网络更是信息化社会的技术支撑。作为广大网络使用者，直接面对的是网页交互，因此网页设计与制作就成为最直接服务于用户，最大限度展示于用户的工作行为。顺应现实社会的需求，在高校很多专业都开设网页设计与制作课程，特别是计算机类专业、电子信息类专业、新闻传播类专业、电商类专业更是把它作为专业核心课程，因此该课程的地位和重要性不言而喻。

1日常教学中存在的现象和问题

對于网页设计与制作这门课程，在通常的教学中，教师在课堂中讲解理论，演示软件中基本工具的使用，即使举例也是一些零碎的和现实脱节的教学例子，学生上机实习也是局限于练习软件工具的使用方法，缺乏设计规划和实际综合运用能力。看起来操作性很强的一门课程，学生在学完后教学效果并不好，要么是独立进行网站规划和页面设计的能力缺乏，要么是设计出的作品缺少应有的功能，视觉效果也难以让人满意。

2课程实践能力培养的思路

追求实战能力，需要有培养实践能力的良好途径。在教学过程中，我们力求突出案例项目的实践性，依据完成一个案例项目的行动体系，筹划技能训练单元及相关理论知识的讲解，综合学习内容，紧紧围绕着完成案例任务这一目标来组织教学。在教学实践过程中，以提高学生综合素质、知识水平和创新实践能力为原则。

2.1课程内容模块化，化解难点，循序渐进

在课堂的内容讲解上，把网页内容设置分为几大模块，并细心讲解每个小模块，让学生能够更好地理解和掌握版面的设置，进而能更好地对整个网页页面的设计进行统筹和整合。善于运用循序渐进的教学方式，将学生带入网页制作的“乐园”当中，并让学生学在其中，乐在其中。

2.2精挑细选案例项目，完善和优化教学设计

把现实中的真实案例、竞赛中有代表性的案例融入到教学全过程，凡是课程中重要的知识点都与实际应用结合起来。另外，在教学和实践的过程中，注重学生创新思维培养，引导学生重视团队学习和合作。注重教学方法的灵活运用，例如经典赏析使学生开阔视野，积累热情；知识讲授使学生吸收能量，积累思维；课堂练习和实践辅导使学生掌握技能，积累经验；创新操作更使学生获得成功，积累成就感。在学习形式上，除了利用多媒体教学，还有网上学习、交流沟通等手段。虽然教学和实践中方式方法较多，但教学案例法是最频繁也是最重要的教学方法和手段。对于案例的选择，在前期备课阶段都有详细的考虑和斟酌；不仅要找到生动形象与现实融合的案例，还要找到适合堂课教学重点的案例；与此同时，还有配合整个案例的逻辑框架结构的讲解，这样学生更容易吸收所学的案例。

2.3融合“教师教、学生学、独立练、实战做”为一体

落实在教学上就是，首先将逐个学习情景设计好案例，然后在教学中分配任务，将教师过程演示、学生练习设计、互相展示评价等一系列环节落实到位。在学会课程任务的同时，学生与学生之间通过展示评价互相交流和学习，往往更有意外收获。

2.4倡导使用任务驱动教学思想

任务驱动教学理念，摒弃了传统按部就班讲解的思路，以目标任务为导向，明确每节课的知识、技能目标，再根据这些目标设计具体的学习任务，目的性强，很有吸引力。另外，任务驱动教学法能较好地以目标引领学生自学，有很好的推动作用。

2.5加强课堂教学互动，激发学习热情

在课堂上重视并设计师生互动环节和学生之间的互动环节，在活跃课堂气氛中激发学生学习兴趣，进而提高学生分析问题、解决问题的实际能力。学生的学习积极性和主动性增强了，学习能力、应用能力和创新能力自然就提高了。因此案例驱动教学和基本知识紧密结合的教学模式，使得在整个教学过程中把分析讲解、操作演示、动手练习、独立实践有效结合，效果极好。

2.6以赛促教，以赛促学，以赛促改

在教学中加入“竞赛+实例”的教学模式，使学生的主体作用和教师的主导作用充分发挥。在指导学生参赛过程中，按比赛的要求对学生进行了网页设计与界面的审美能力和综合调度力进行了专门的训练。着重培养学生的网页编程能力，艺术设计能力。每个参赛队设置一名队长，队长对整个网站项目统筹管理，给队员分备任务，全队成员在合作中把整个项目完成，不经得到了知识能力的提高，而且锻炼了团队合作、与人沟通、创新发现等能力，培养了职业精神。教学过程参照实际应用，着眼于学生的发展，使知识的单向传播变为互动传播，引导积极主动的学习氛围，也带来了竞争与合作的理念。俗话说“一人为木，众人成林”，单人的能量是有限的，重视团队合作是成功的砝码。因此在教学过程中，多鼓励学生参与竞赛，在身临其境的实践中磨炼和完善自己，同时也培养了团队协作精神。

3课程实践能力培养的点睛之处

培养网页设计与制作课程实践能力的重要一环，就是参赛。针对竞赛的性质和特点对学生进行课外辅导，重点要做好以下工作。

3.1准备阶段

第一是确定网站主题。学生首先要有兴趣点才能做出好的作品，引导学生做一些贴近生活并有意义的事情，在此以“合肥三河古镇”网站设计为例。之所以确立设计三河古镇网站，是因为很多同学都去过三河古镇，相对比较了解，资料容易搜集。网站确定了栏目，从三河风光、三河历史、三河文化、三河美食、互动空间五大方面让人深入了解三河，爱上三河，爱上中国的古镇，从而由衷地敬仰中国古镇的悠久历史文化，达到宣扬中国历史文化名镇的意义。

第二是确定网站风格。针对竞赛的特点，引导学生查看优秀的历届获奖比赛作品，以及知名度较高的网页设计作品，使学生在提高审美能力的同时，激发他们对网页美术设计的灵感与热情。为突出三河古镇的古典风格，考虑网站以水墨画为背景，重点突出悠久的历史。教师指导学生在网站设计的细节上塑造整个网页浓郁的古典风格。

第三是确定使用的技术和数据库。学生对于asp程序和access数据库比较熟悉，为了提高团队效率，我们利用课余时间对学生进行补习asp程序设计、Dreamweaver、flash、PS软件的高级应用方法，提高学生网页设计综合能力，为后期动手制作打下良好的基础。

第四是对优秀的、学生比较喜爱的多个网页设计案例进行分析与讲解，最终确定参赛队的网页美术设计风格以及所用元素，讓学生能够明确优秀的网页美术设计流程和最终效果。

3.2制作阶段（以合肥三河古镇为例）

第一步让学生利用PS、flash软件将网页界面的整体效果图制作出来，其中包括导航条、按钮的图形、页眉、页脚等一些重要的板块。在制作期间，运用课余时间进行辅导，并时刻强调风格与元素运用的统一，对整体风格做出良好的定位。

第二步在首页中运用了一个动态的flash动画，增添了整个页面的动感，更全面地诠释了三河古镇的风貌。首页的文字排版严谨而不严肃，充分体现工整的同时，更好的突出了“三河古镇”标题。在flash动画下面的背景色运用了一张具有徽派建筑的图片，图片在背景中若隐若现，且光感度强，将整个视线集中到flash的播放框中，主次分明且主题明确。

第三步将主页面中导航条、按钮的字体和背景以及整体的背景色饱含古典元素，让人在不知不觉中进入到一个古香古色的情境中，引发人们观光旅游的欲望。整个网页布局合理，色彩搭配协调。

第四步应用内联框架布局，css页面控制网页格式，提高了制作的网页的效率，也方便网页后期维护。应用asp程序语言和access数据库达到了留言板的功能。

第五步是指导学生注重细节。在各个板块制作完毕的基础上，对整个界面设计效果进行测试，发现细节上的问题和错误，及时进行修改。

3.3网站发布

作品设计完成，通过测试后，指导学生使用FTP等软件把作品发布到互联网服务器上。服务器需要web服务器软件，如iis，apache、tomcat等，最后指导学生熟练使用相关软件。

4课程实践能力培养的硕果

网页设计与制作是综合实践性很强的专业核心课程，通过构建这样的实践能力培养模式平台，使学生学习和实践活动的气氛更浓，学习意识更强，学习效果更加坚实。这种实践能力培养策略一改过去“注重理论”和“被动接受”的学习思路，学生积极性和主动性明显提高，实践教学也变得生动、活泼。以上卓有成效的实践技能培养，以赛促教，以赛促改，以赛促学，充分调动学生学习的积极性。教学过程突出案例项目的实践性，高效地提高了学生综合素质、知识水平和创新实践能力；案例课程的教学使理论知识点讲解穿插于实践教学过程中，边实践边训练，实现理论知识和实践教学真正意义上的有机统一。

从实际成果看，以岗位职业能力、竞赛能力为导向的案例项目课程策略，注重知识、能力、素质的协调发展，适合教育教学改革实际，具有可持续性发展的教学思想；特别是不断鼓励和指导学生参加各类设计竞赛活动，使学生在实战中体验和发挥，在实战中完善和提升。2016年安徽省“中国大学生计算机程序设计”大赛上，我院2014级计算机多媒体技术专业2名同学荣获高职高专组网站建设一等奖和二等奖，2014级电子商务1名同学获网站建设二等奖。

参考文献：

[1] 张莉. 网页设计与制作课程教学改革初探[J]. 合肥：电脑知识与技术，2014（4）.

[2] 张奕. 浅述职校《网页设计与制作》教学改革实践[J].成功（教育），2011（8）.

[3] 罗静. 网页设计课程教学改革的思考[J].计算机光盘软件与应用，2012（11）.

[4] 杜卫军. 课程改革背景下《网页设计》课程教学的探索与实践[J].新课程研究（中旬刊），2011（1）.

[5] 王德才. 基于项目导向的高职综合课程开发研究[D].山东师范大学，2009.

[6] 张雅茹.《网页设计与制作》的教学设计与实践[J].陕西教育（高教），2009（11）.

[7] 刘丽娜. 基于CDIO理念的“ASP.NET”课程改革实践[J].石家庄铁路职业技术学院学报，2011（12）.

[8] 陈港能，霍英杰. 活学现用 学赛结合[J].印刷工业，2014（6）.