项目教学法在网页设计技术教学中的应用探析

田玉昆

(广东培正学院数据科学与计算机学院，广东 广州 510830)

0 引言

网页设计技术课程主要学习DreamWeaver 的安装与使用、网页的组成、网页各元素的添加、表格与表单的创建与使用、网页整体布局、超链接、模板、CSS样式等内容，让学生学校与上机实操同步进行[1]。它是一门开阔视野、增长知识、提高实际工作能力的计算机课程，也是PHP、JSP与Java Web等动态Web应用程序设计的基础课程。通过本课程的学习，使学生能够学会基本的网页制作，熟悉网页的基本布局，掌握开发静态网页的过程。本课程的设计性比较强，主要侧重于从代码方面让学生掌握基本的网页设计方法，比较适合案例驱动的项目教学法，以用带学，把知识点应用于具体网页设计项目过程中，既训练了学生的实际动手与应用能力，又加深了理论知识的掌握程度，理论与实践相辅相成。

1 项目教学法简介

1.1 项目教学法概念与特点

项目教学法(Project-based Learning)又叫基于项目的学习方法，是对探究式教学法、任务驱动教学法与案例教学法进行融合的一种新的教学方法[2]。它是用项目作为任务点，在老师的指导下，让学生负责完成项目的需求分析、资料收集、方案设计、项目实施与项目评价等一系列过程的教学活动。教师在整个项目中起辅助和引导作用，主体完成人是学生。老师在设计此项目时，把授课知识点渗透到项目中去，让学生在具体的应用中进行学习，用理论指导实践，以实践印证理论并加深认识，从而促使项目的顺序完成。

项目教学法的优点在于：目标指向的多重性、训练周期短且见效快、可控性好、注重理论与实践相结合[3]。

1.2 项目教学法在网页设计技术课程中的优势

1）由传统教学改为实践教学

网页设计技术课程的操作性强，由理论指导实践。传统的教学方式重理论轻实践，导致学生的实操能力与理论出现很大偏差[4]。而项目教学法就是要弥补这种教学的偏差，在授课过程中，以项目作为任务驱动，用理论指导实践，训练学生的实际设计能力。最终，学生的理论知识以作品的形式呈现出来，真正地学会网页设计。

2）提高教学效率，激发学生的学习兴趣

项目教学法能让每个学生都参与到课程的学习任务中去，学期初就先明确知识点、项目任务与分工，并以项目设计的质量作为衡量标准，这在很大程度上能够激发学生的学习兴趣。由项目为主线，牵引着学生进行学习、实践，可以活跃课堂气氛，从而提高教学效率。

3）激励学生自主学习，充分发挥学生的主观能动性

在项目教学法的教学方式下，每个学生基本上每节课都有设计任务，通过任务促使他们要主动学习，边学边做。有些能力强的学生在完成设计任务的过程中，会把自己的创意体现出来，能充分发挥他们的主观能动性。

1.3 项目教学法的步骤

项目教学法在此课程的教学过程中，主要通过以下几个步骤进行实施：①确定项目；②制定计划；③项目的实施；④项目评价；⑤项目总结。

2 项目教学法在网页设计技术课程教学中的具体应用

2.1 项目的确定

由于网页设计技术课程涉及的知识面广、宽，并融合了其他学科知识[5]。因此，在项目教学法实施过程中，既要教会学生对零散的知识点的应用及多种软件的使用，又要注重学生综合能力的培养。教师作为项目总指导与项目负责人，设计的项目既要容易理解，又要在难度上适应于学生现有的能力与知识水平，还要覆盖所学的知识点。

根据教学内容的不同，网页设计技术这门课程可分为10个由浅深不一、难度不同的项目：项目1：在线购物网站产品展示。项目2：使用锚链接制作电子书阅读网页。项目3：制作商品报价单。项目4：制作学生信息统计表。项目5：制作新闻页面。项目6：制作简单图文混排网页。项目7：制作简单生活资讯主页。项目8：制作用户登录页面。项目9：将段落转变成列表。项目10：制作在线购物类网页。

2.2 制定计划

1）确定好分组。在教学项目实施过程中，为了项目完成的需要，教师须对班级里的学生进行分组。分组时，教师要综合考虑学生的平时表现与专业水平、内因与外因等综合素质，把学生分为“优—良—普通”三个层次。教师可依此对学生进行异质分组，均衡每组人员的能力，做到优带差，优生得到锻炼，差生得到提高。

以本人所带的2020级软件工程3班的53人为例，可分为11个组，其中有一组为3名同学，其余10组每组有5名同学，每组成员都有“优—良—普通”的学生，且指定优秀的学生担任项目组长。

2）小组内分工。小组组长按组员的能力进行任务分工，教师指导每组学生进行项目需求分析、可行性分析。教师再根据每组上交的需求分析文件，指导他们划分项目的功能模块，并进行项目的概要设计，设计项目的功能结构图，制定项目完成计划书。

本例中项目10是一个综合项目，内容丰富，应用性强，能吸引学生的学习兴趣。以此为例，阐明项目教学法的应用。图1 为项目10 在线购物类网页的功能模块图。

图1 在线购物类网页功能结构图

3）确定项目进度

按每组的项目计划书，组长根据组员的分工，随时监督他们的任务进度情况，并对有困难的成员进行技术指导或帮助，以保证项目如期完成。并把每个步骤中所遇到的困难或问题与解决方式等都记录下来，项目结束时连同项目书一起上交给教师，方便教师对项目进行总结与评价。

2.3 项目的实施

项目实施是项目教学法在教学过程中的具体应用。此过程需要教师适时地对学生进行引导，根据项目计划书，按进度完成分模块设计，确保项目顺利完成，实现课程教学目标。由于本人所授课班级的学生之前未接触过网页制作，不会使用DreamWeaver 等相关软件，所以此课程前几节课要先给学生讲解软件使用方法，等熟悉了软件操作后，再实施项目教学内容。具体实施过程大致可分为以下三个阶段。

2.3.1 网页设计技术基础知识及软件操作学习

本课程所授课的教室为机房，方便学生在课堂上随时练习。项目实施前，利用三周时间先给学生讲授网页设计的基本知识。在初期的教学过程中，教师起主导作用。教师主要采用讲练相结合的方式进行授课，用专项习题引导学生在软件上熟练操做网页设计的各个知识点。

在此阶段，让学生在熟练软件操作的同时，完成项目运行平台的搭建，为后期项目设计做准备。对于基础薄弱或是无基础的同学，可在教师或是同组中能力强的同学的引导下完成这一环节。

2.3.2 项目开发

在此阶段，学生要按照项目分组及同组成员的分工，结合项目计划书进行设计各个功能模块。这个阶段是项目实施的关键点，因此，教师在这个阶段中针对每组学生所遇到的不同问题或困难，要给予相对应的指导，让学生把前期的基础知识消化并应用到此阶段的项目中去，是学以致用的关键阶段，并督促每组学生按进度完成项目设计工作。

组长在此过程中起总指挥与调度的作用，既要对每个组员的作品进行把关，又要在最后阶段对每个组员提交上来的功能模块进行最后的整合、调试工作，做好最后的收尾工作。

2.3.3 撰写项目设计书和总结报告书

在此阶段，项目设计工作已完成，教师要求每组成员对自己所负责的设计任务及过程中遇到的问题与解决方法等进行文件整理，上交给组长，由组长汇总并撰写项目设计书与总结报告书，以组为单位上交给教师，教师以每组的作品、项目设计书与总结报告书作为他们项目的主要考核标准。

2.4 项目评价

2.4.1 作品展示性评价

每个组在课堂上对自己的项目进行演示与讲解，并解答老师和其他组学生的提问，接受他们的打分与评价。由此可让学生欣赏到每一组的项目成果，而且在组与组之间能形成相互学习、相互借鉴、相互促进的良好学习氛围。

2.4.2 调查问卷式评价

在项目完成后，为了让老师更好地了解学生在项目实施过程中的具体情况与想法，老师采用下发调查问卷[6]的形式来收集信息。此调查问卷主要从学生对此课程是否感兴趣、感兴趣的原因、学习此课程的收获这三大方面进行调查统计。

2.5 项目总结

2.5.1 从项目成果来总结

每组的项目作品、打分情况与小结由老师收集上来并进行整理，既能为老师后期的教学内容与教学方式等起到指引作用，也能让后届的学生借鉴或参考，同时也为学院的专业学科建设提供丰富的资料。

2.5.2 从调卷问卷结果来总结

根据最近学期的教学安排，对2020级软件工程3班的53人的问卷调查中，可进行如下分析。

1）对此课程是否感兴趣

此调查问卷第一项内容主要调查了学生对此课程感兴趣的程度，分为非常感兴趣、感兴趣、一般、不感兴趣四个等级。对全班53个人的调查统计结果具体如图2所示。

图2 学生对此课程感兴趣比例图

2）对课程产生兴趣的原因

此调查问卷第二项内容主要调查了学生对此课程感兴趣的原因，具体原因分为参与评优、学到技术、完成项目有成就感、毕业压力与其他等五项内容。对全班53个人的调查统计结果具体如图3所示。

图3 学生对此课程感兴趣原因分析图

3）此课程的收获

此调查问卷第三项内容主要调查了学生学习后的收获，具体收获分为网页设计能力、解决问题的能力、自学能力、创新能力、团队协作能力、写作水平、调查/搜集素材能力与其他等八项内容。对全班53个人的调查统计结果具体如图4所示。

图4 学生学习此课程的收获总结图

3 总结

网页设计技术是一门操作性较强的课程，采用传统的教学模式已不能达到预期的教学效果，而项目教学法有项目、教师和学生三个角色，以教师为指导，以项目为驱动，以学生为主导来实现一系列教学活动，比较符合网页设计技术课程的教学要求。项目教学法具有实践性、自主性、探究性、综合性等显著特点，以项目促进教学，能调动学生自主学习的积极性，同时也培养了学生的动手能力、团队意识、创新意识与合作精神，以做带学，使学生能真正地掌握一门技能，从而更好地适应社会的发展。