网站设计与网页制作课程的教学改革研究与实践

张 琰

东南大学成贤学院 江苏南京 210088

网站设计与网页制作课程的教学改革研究与实践

张 琰

东南大学成贤学院 江苏南京 210088

网站设计与网页制作是电子商务专业必修的一门基础课程。该课程仍旧停留在动态ASP网站的理论与实践教学阶段，与当今最新的网站开发技术严重脱节。针对以上问题提出了利用Dreamweaver，Photoshop，Flash及PHP开发网站的教学内容改革研究与实践方案。

网站设计与网页制作；Photoshop；Flash；PHP；教学改革

如今，电子商务的应用已遍及人们生活的方方面面，网上购物、手机上网、网络通讯、搜索引擎基本成为人们生活的一部分。世界各国也都非常重视电子商务技术、电子商务模式的发展。为了顺应电子商务发展的趋势，保证对每年不断增加的电子商务人才需求的供给，我国各类高等院校竞相开设电子商务专业。其中网站设计网页制作课程是该专业的重点专业基础课。

笔者在分析学术教研文献的基础上[1-3]，结合自身的教学经验，发现目前网站设计与网页制作课程仍旧以Dreamweaver+IIS+Access为技术平台构建ASP动态网页。学生通过学习虽然能够掌握基本的网站设计，但与当今网站网页设计实践相去甚远，使得电子商务学生毕业后不能很快适应网站设计工作。因此，笔者结合最新的网站网页开发技术，即对前台网页制作采用Dreamweaver+Flash+Photoshop，对后台网站开发采用PHP+SQL数据库的技术平台，对原有的教学内容进行改革。在教学方法上采用项目教学法，培养学生的实际动手能力。

1 教学内容改革

网站设计网页制作课程不仅要求学生掌握网站框架搭建的方法，而且对网页界面的艺术性设计也提出了要求。网页界面艺术性设计的要素包括色彩、布局、构图等，这些要素设计是否合理在很大程度上决定了网站是否能够吸引并留住用户。因此有必要加强电子商务专业学生在网页界面艺术性设计方面的能力，改革原有的教学内容，包括以下几点：

(1)使用Photoshop编辑网页图像。Adobe公司开发的Photoshop软件是目前图像处理领域使用最多的一款软件，是集图像扫描、编辑修改、图像制作、广告创意，图像输入与输出于一体的图形图像处理软件。Photoshop的版本由最初的仅能实现色彩平衡、饱和度调整等简单功能的1.0升级为可以创建和编辑3D动画的CS5。将Photoshop应用到网页界面设计中已是行业里最常见的手段和方法。对电子商务专业的本科生来说需要掌握的理论与实践知识有：

①Photoshop的基本知识，包括常用菜单命令、图层、通道、路径、文件模式等概念。②Photoshop工具使用方法，如工作区的操作、图像分区、绘图工具、文字设计器、图层面板、图像修补工具等。③使用Photoshop制作网页实例，如制作电子商务交易网站、企业信息发布网站或者社交网站等。

(2)使用Flash创建动态交互式网站。Flash原是Macromedia公司旗下产品，现被Adobe公司收购，是一款制作二维矢量动画的软件。最新版本为Adobe Flash Professional CS5.5。Flash被大量应用于网页的矢量动画设计，因为使用向量运算方式，产生出来的Flash影片占用存储空间较小。目前，使用Flash建立全Flash站点成为业内流行的网站创建方法。本课程采用项目教学法，即以完成多种不同主题风格网站项目为主线，学习使用Flash工具创建网站，其中包括以下内容：

①网站项目的策划与制作；②社区网站项目；③广告网站项目；④信息网站项目；⑤购物网站项目；⑥旅行网站项目。

使学生掌握使用Flash制作HTML文件，应用CSS，制作导航栏、弹出式菜单，动画、文本、图像切片以及多种动画效果制作等能力。

(3)使用Dreamweaver+PHP+SQL构建网站后台。Dreamweaver的操作有建立PHP站点、数据库的连接、使用服务器行为等；PHP平台搭建包括Apache，PHP，MySQL的安装；PHPAdmin的安装与使用；MySQL数据库的创建、修改、删除等操作。

2 教学方法改革

改革原有的“教师讲，学生听”教学方式，采用“以学生为主导，教师为辅导”，围绕项目开展网站设计学习的方式，即采用项目教学法。所谓项目教学法是指将整个学习过程分解为一个个具体的项目或事件，设计出项目教学方案，不仅传授给学生理论知识和操作技能，更重要的是培养他们的专业能力。将该方法应用于网页设计课程的教学中，主要是指结合教学要点，给定学生网站设计的要求，让学生独立完成网站设计与制作的任务，具体体现在以下几个方面：

(1)介绍网站设计成功案例。为了使学生形成一定的网站设计构想，有必要将目前国内外在设计方面有创意的网站展示给学生，如匡威、立顿茶饮、开心网等。通过这些网站使学生了解现在较流行的网站设计风格、设计思路及设计手段。

(2)理论教学围绕项目展开。每节课设定一个网站制作项目，如Dreamweaver站点建立、Photoshop图层的使用、Flash与ASP技术的结合等，并给学生讲解每个项目的设计目标、预达到的效果、设计思路和制作的具体步骤。以课堂演示操作为手段，边讲解边操作演示，进而使学生有感性上的认识与体会。

(3)上机实验课要求学生模拟完成课堂讲解的项目。该课程有1/3的学时是安排学生上机操作，这是实现项目教学法的必备条件，即在理论学习的同时安排学生上机操作，将课堂上教师完成的项目由学生自己上机实现，由易到难，引起学生的兴趣并锻炼其制作网站的动手能力。

(4)课程考核以大作业形式实现。改变原来闭卷笔试的考核形式，要求学生在课程结束后独立形成一个完整的网站，主题自拟，使用Dreamweaver，Photoshop和Flash等网站制作工具实现至少80%课上讲解的项目功能。对使用课外的工具和手段使得网站更生动的学生可加分，即鼓励学生自己摸索和创新网站制作方法。最终成绩的评定依据网站使用工具先进性、主题的新颖性、界面设计的艺术性和实现功能的完善性四个方面来评分。本课程最后的综合成绩评定除了依据上述大作业完成情况，还依据平时上课情况和上机实验完成情况，其比例分别为60%，10%和30%。

(5)利用学生业余时间创办网站设计大赛。组织学生组成团队共同设计制作网站，在条件允许的情况下将网站发布于互联网上，发动全校师生上网访问参赛作品并评分。根据访问者的评分得出大赛一、二、三等奖，并给予奖励。

3 结束语

综上所述，电子商务专业的网站设计与网页制作课程必须与时俱进，使用先进的设计制作工具，使学生接触最新的网站设计方法，即采用Dramweaver+Flash+Photoshop的组合，使学生学习制作的网站能跟上时代发展步伐。

在教学方式上采用项目教学法，围绕具体的网站设计与制作项目展开教学与实践，锻炼了学生的动手能力而且也让其了解了制作网站的流程与步骤，从而大大提高了学生的专业素质和就业能力。

[1] 贾珺.网页设计与制作课程体系建设与教学实践改革[J].现代计算机,2010,6:72-75.

[2] 纪明明.浅谈“项目教学法”在网页制作与网站设计课程教学中的应用[J].中国新技术新产品,2010,24:239.

[3] 卢新建.试谈ASP动态网页课程的教学探索[J].计算机应用教学研究,2010,10:147-159.

Research on teaching reformation of Web site design and Web page making

Zhang Yan
Southeast university, Nanjing, 210088, China

Web site design and Web page making is one of the fundamental courses for the major electronic commerce. But the teaching content and method of this course still stay in ASP Web site design and making which means the content and method of teaching are out of style. So we need to teach new content such as using Dreamweaver, Photoshop, Flash and PHP to make web site.

Web site design and Web page making; Photoshop; Flash; PHP; teaching reformation

2011-09-22

张琰，硕士，讲师。