中职《Dreamweaver网页制作》课程教学方法探究

李亚秋

摘 要：中等职业学校的目标是为国家培养大量技能型人才和高素质劳动者，这就需要中职教师在教学方法上做相应的改革，不断探索和优化能够更好地与经济社会发展相适应，促进学生专业技能的掌握、职业综合能力提高的教学方法。笔者经过多年教学实践阐述了Dreamweaver网页制作课程的几种行之有效的教学方法，结合教学实例具体阐述了控制变量教学法、任务驱动教学法、项目教学法的内涵、适用范围和该教学方法的具体实施。

关键词：网页制作 控制变量法 任务驱动教学法 项目教学法

中图分类号：TP393.0 文献标识码：A 文章编号：1672-3791（2016）12（c）-0171-02

《网页设计与制作》课程是计算机多媒体技术专业的核心学习领域课程。对于中职学生并且又是网页制作这门课程的初学者来说，传统的讲授法、练习法、开放式自主探究教学法显然不能达到较好的教学效果，如何提高Dreamweaver课程的课堂教学效果，培养学生的实践动手能力，让学生适应社会的需求，是教师在教学中要关注的问题。笔者在几年来的教学实践中，总结了几种行之有效的有针对性的教学方法，以下笔者将从这几种教学方法的内涵、该教学方法的适用范围、该教学方法的具体实施几个方面和大家做一个交流和探讨。

1 控制变量教学法

1.1 控制变量教学法的内涵

物理学中对于多因素（多变量）的问题，常常把多因素的问题变成多个单因素的问题，只改变其中的某一个因素，从而研究这个因素对事物的影响，分别加以研究，最后再综合解决，这种方法叫控制变量法。笔者认为可以将这种方法用于网页制作的教学，因为网页制作是可以通过改变代码或者通过改变某一个属性的值，从而直观地看到页面的变化，即可以直观地看到效果。那么面对CSS面板中的“背景、区块、方框、边框、列表、定位”等众多的属性值，让学生了解每一个属性的作用，教师可采用控制其他属性值不变，而只改变其中一个属性，让学生观察相应的页面的变化，从而让学生自己说出该属性的作用，这样的教学方法比老师直接讲授效果好得多。

1.2 控制变量教学法的适用范围

适用于《Dreamweaver網页制作》课程的初期，对网页制作的基本知识和Dreamweaver软件基本操作学习的过程中。

1.3 控制变量教学法的应用

使用DIV进行页面布局是网页制作中的一个重点，尤其是在传统的教学方法下讲解填充（padding）和边界（margin）的时候学生容易产生混淆，加之软件是英文版，对于中职学生理解起来就更困难了。笔者在讲解“margin-left”这一属性值时，保持其他变量不变，把“margin-left”的值由0增加到200，发现DIV的方框向右移动200像素，让学生直观地观察网页发生的变化，学生发现增大了左边界的值，DIV向右移动了，从而知道了margin-left的含义及如何运用margin-left去定位DIV。然后保持其他变量不变再增大margin-left的值，由200像素增加到300像素，这时笔者提问DIV会怎么移动，学生就可以异口同声地回答出，div继续向右移动100像素。

2 任务驱动教学法

2.1 任务驱动教学的含义

“任务驱动”教学法中，教师在整个教学过程中通过创设情境、分析任务、细化任务，让学生带着真实的任务在探索中学习，使学生拥有学习的主动权，学生学习不单是知识由外到内进行转移和传递，更是学生主动建构自己知识经验，通过新经验和原有知识经验的相互作用，充实和丰富自身的知识、能力的过程。最终使学生有效地实现对当前所学知识的意义建构的目的，培养学生提出问题、分析问题和解决问题的综合能力。

2.2 任务驱动教学法的适用范围

任务驱动教学法是Dreamweaver网页制作等操作型技能型课程普遍采用的教学方法，适用于对Dreamweaver软件初步掌握对网页制作基本知识有一定了解的学生。

2.3 任务驱动教学法的具体实施

2.3.1 提出任务，激发兴趣

在“任务驱动”教学法中，“任务”的提出是非常重要的，它决定学生是主动学习还是被动学习。尤其对于中职学生，可以采用“成果展示”的方式，调动学生渴望完成任务的动机，激发学生的参与意识。

2.3.2 分析任务

任务提出之后，不要急于讲解，教师可以把一个大任务细分为一些小任务。任务应从易到难，小任务应紧密围绕总体任务去一个个地实现，让学生对呈现的任务进行仔细思考、分析和讨论，提出完成任务需要解决哪些问题，再让学生明确：哪一些问题是学生以前学过的，自己就可以解决；哪些问题是没有学过的，即新知识，这部分需要学生去获取信息获得新技能。这里仍然以“制作家乡山水”网页为例，在分析任务这一环节中，老师引导学生要想实现当鼠标单击一个景区时，会打开相应的景区介绍的页面，这说明要建立一个标记，使得景区地图和景区介绍有一个一一对应的关系，接下来引入热点和锚记这两个功能。

2.3.3 完成任务

这个阶段教师不要直接告诉学生如何去做，而应向学生提供解决该问题的线索，要引导学生利用已有的知识储备知识结构去构建新知识，学生结合已有的知识自行完成任务，教师在一旁起到“引和导”、助教、助学的作用，学生通过自主探究或者协作开展探究活动，在完成任务过程中掌握新知识，并将所学知识融会贯通，进而运用到实际中去。

2.3.4 评价与反馈

评价与反馈在整个教学环节的重要性不言而喻，就好像玩游戏做任务拿到悬赏金币或者累积经验值可以升级，如果不给予网页作品优秀的学生一定表扬和鼓励，恐怕他再去做任务时的获取成功动机会大跌。笔者在教学实践中发现，在课程初期，学生完成任务的网页作品都一样，都是按照课本要求完成，只是掌握较好的学生做得快，掌握较慢的学生做得慢，出现优秀生先做出来帮助后进生做的情况。笔者采用最先完成任务的5人得10分，接下来完成的10人得8分，再接下来的10人得7分，最后完成的10人得6分的评价方式。在课程后期，学生已经掌握网页制作的基本知识，能独立完成一个网页甚至一个网站的制作的时候，就可以给予多元化评价，不仅仅是评价最后完成任务的结果，学生的学习能力、分析解决问题的能力、探究能力和创新意识都可以作为评价的方面，学生网页布局是否合理、导航是否清晰、网页是否美观都要纳入作品考核内容。老师可以挑出较优秀的作品，让作者本人上台展示自己的作品，讲解自己的制作方法，达到鼓励和激发其他同学设计热情的效果。

3 项目教学法

3.1 项目教学法

学生在教师的指导下亲自处理一个项目的全过程，在这一过程中学习掌握教学计划内的教学内容。学生全部或部分独立组织、安排学习行为，解决在处理项目中遇到的困难，提高了学生的兴趣，自然能调动学习的积极性。

3.2 项目教学法的适用范围

在《Dreamweaver网页制作》这门课程中项目教学法适用于课程的后期，学生已经掌握网页制作的基本操作和DIV+CSS的网页布局和网页美化方法，可以独立或者分小组开始做公司网站或者门户网站时采用此方法效果较好。

3.3 项目教学法的具体实施

对应于中职学校面向职业面向技术的特点，“项目”的设置应尽量贴近网站开发企业标准化的工作流程，体现网站开发横向工作过程，结合真实网站开发企业从网站需求分析到整站制作，细化五大开发环节，进行针对性的项目教学。

下面笔者以制作企业网站为例阐述项目教学法在网页制作课程中的具体实施过程。

3.3.1 根据需求分析确定网站主题和网站结构

教师模拟企业真实项目，给出甲方的需求分析，把班上的学生分成不同的小组，每一个小组要根据需要设计出网站导航。如图1是学生设计出的导航结构（A Watch艾特表业网站导航图）。

3.3.2 素材收集和确定网站风格

网页制作过程中，素材的收集是非常重要的，素材的来源通常有以下几方面。

（1）客户提供的素材：主要是与产品或企业相关的图片和文字，例如产品外观图像等。

（2）网上收集的素材：主要是一些與网站主题相关的辅助性图像，这些图像的装饰性较强，例如背景图片、按钮图片等。

（3）独自创作的素材：利用相关软件自行设计制作。

小组讨论确定网站的主色调，主体文字颜色、大小，显示内容宽度，以保证各个页面风格一致。

3.3.3 网页制作过程

在这一步骤中，小组分工合作，遇到困难可以参考有关书目自主学习，解决问题或者求助网络，借助网络资源。整个过程是开放式的，学生遇到问题可以求助于老师，老师在这个过程中注意观察记录每一个同学的表现，在团队中属于主力还是协助者，遇到不会的问题是积极解决还是放弃。同时老师还要起到督促、管理的作用。

3.3.4 网站项目的评估

网页制作的项目评估是为了检验学生实现项目的成果，教师可设计一个项目评估表格，对学生作品从总体设计、样式美观度、导航结构是否清晰、内容完整度等几个方面进行综合评价。

3.3.5 成果报告

每个小组最后均要上交项目报告单，每一小组同学上来介绍本小组设计的网站，并说明自己在整个项目中做了什么。老师结合平时的观察记录和对展示同学针对自己做的部分的提问给出他在这个项目中的成绩。

参考文献

[1] 徐娴.元认知策略对中职网页制作项目教学的启示[J].教科文汇旬刊，2010（18）：79.

[2] 王君学，孙海伦，金哲.网页设计与制作（项目教学）[M].人民邮电出版社，2013.

[3] 李翠白，李芒.基于计算机的教学设计任务驱动式学习方法[J].中国电化教育，2001（12）：9-13.