《网页设计与制作》实训课教学探索
摘 要：《网页设计与制作》是中等职业学校计算机专业学生的一门核心专业课程。通过这门课的学习，学生能够掌握网页设计与制作的基本技能。但是，传统的教学方式对于这样一门技能型课程来说还远远不够，只有通过实训才能加深学生对于各知识点的了解和掌握。本文旨在通过在《网页设计与制作》课程实训中运用多种教学方法进行项目式教学的案例，对教学过程进行总结，探讨适合中等职业学校学生的一些教学方法。
关键词：网页设计与制作 综合实训 案例教学 任务驱动
中图分类号：g633 文献标识码：a 文章编号：1673-9795（2013）05（b）-0173-02
近年来，随着我国职业教育改革的进一步深化，计算机专业课程改革面临着进一步完善，这就对《网页设计与制作》课程改革提出了更高的要求。《网页设计与制作》课程是中职学校计算机应用技术和计算机网络专业中一门创新性和实践性很强的专业课程，要求学生不但要学好理论知识，还需要掌握实践技能，关键是要具有解决实际问题的能力。但是，这样一门看似简单好学的课程，却经常得不到很好的教学效果。学生在学完课程之后，要么设计结果达不到应有的功能和视觉效果，要么不能独立地进行网站规划和页面设计。因此，笔者在《网页设计与制作》课程的教学实训中，对教学内容、教学方法、教学手段、考核方式等进行了一些尝试，收到了良好的效果。 1 实训阶段
以我校计算机应用专业为例，《网页设计与制作》综合实训课安排时间为60个课时，以集中训练的方式进行。在综合实训之前，学生已经学习理论知识和上机操作，对课程的重点、难点进行了相关的练习。笔者在教学中发现，虽然学生经过指导能够完成课堂上布置的任务，但是只能根据规定的操作步骤进行，学生没有独立设计和制作网页的能力。学生的操作依赖性很强，学习之后很快就遗忘。针对这些问题，笔者制定了切合实际的实训计划，主要目的是培养他们团队中协作能力，独力完成所承担的网站需求分析、网站规划、网页设计、综合测试等工作，从而使学生牢固掌握所学知识，实现以技能培养为核心，培育适合当前职业岗位需求的应用型、技能型人才。本课程综合实训如下所示。
一、实训背景
随着互联网技术的飞速发展，动态网页已成为现代网站建设的重要组成部分。为了提高我的网页设计与制作能力，我在老师的指导下，参加了本次动态网页实训。通过本次实训，我对动态网页的制作原理、技术实现及实际应用有了更深入的了解。
二、实训目标
1. 掌握动态网页的基本概念和制作原理；
2. 熟悉常用的动态网页开发技术，如HTML、CSS、JavaScript、PHP、MySQL等；
3. 学会使用动态网页开发工具，如Dreamweaver、HBuilder等；
4. 能够独立设计和制作简单的动态网页。
三、实训内容
1. 动态网页基本概念及制作原理
动态网页是指网页内容能够根据用户的需求、操作或服务器端的计算结果进行实时更新和变化的网页。它主要由静态网页和服务器端脚本组成。静态网页是固定不变的，而动态网页则可以根据用户的需求动态生成。
2. 动态网页开发技术
（1）HTML：超文本标记语言，用于构建网页的基本结构。
（2）CSS：层叠样式表，用于美化网页的样式。
（3）JavaScript：一种客户端脚本语言，用于实现网页的交互功能。
（4）PHP：一种服务器端脚本语言，用于处理数据库操作、文件上传等功能。
（5）MySQL：一种关系型数据库管理系统，用于存储网页数据。
3. 动态网页开发工具
（1）Dreamweaver：一款专业的网页设计软件，支持HTML、CSS、JavaScript等多种开发技术。
（2）HBuilder：一款功能强大的前端开发工具，支持HTML、CSS、JavaScript、PHP等多种开发技术。 四、实训过程
1. 学习阶段
在实训初期，我通过查阅资料、观看视频等方式，对动态网页的基本概念、制作原理及常用开发技术进行了系统学习。
2. 实践阶段
在实践阶段，我按照以下步骤进行动态网页的制作：
（1）确定网页主题和功能需求；
（2）设计网页布局和样式；
（3）编写HTML、CSS、JavaScript代码；
本实训项目的目的与任务是使学生根据问题的要求， 构思一个主题，并运用网页 制作工具，
制作和发布网页，并对此进行更新和维护，掌握网站发布的工作 流程，了解域名申请、空间申请
的方法，能在校园网及英特网上发布网页。
实训学时数：125 （ 5周）
课外学时数：100
适用方向：办公自动化、 电子商务
执笔者：王平露
编写日期：2006年4月
一、 实训教学的目的与任务
本实训项目的目的与任务是使学生根据问题的要求，构思一个主题，并运用网页制作
工具，制作和发布网页，并对此进行更新和维护， 掌握网站发布的工作流程， 了解域名申请、 空间申请的方法，能在校园网及英特网上发布网页。 通过设计、编辑和发布网页全过程的实 际训练使学生对网页整体设计流程有一个深刻的 认识，并且熟练掌握网页制作工具
（Dreamweaver MX ）的使用，初步掌握 HTML、CSS语法格式，能借助手册看懂代码， 能进行简单的代码改写工作，了解客户端脚本和服务端脚本区别， 了解在网页上进行简单代
码的嵌入与改写，会与其他工具结合使用以便实现更高效高质量的网页效果， 进一步提高办
公自动化效率和水平。
二、 实训项目的基本要求及考核标准
基本要求：
（一）网页内容要求：
1、主题内容：创意突出，体现校园园区精神文明 建设体现本班级 大学生风貌，学习气
氛浓厚，作品内容健康。严禁发布反对 政府、宣传迷信、传播色情、 系统破坏、黑客教程等
违法信息。
2 、具体内容：标徽、标题、各链接页具体内容，站内搜索、计数器、留言系统、电子 邮件地址、弹出窗口、漂浮广告、背景音乐、网页特效、友情链接、版权信息等。
（二）制作基本要求：
1 、至少有 10 个页面，链接结构应有三层，下一层必须有返回上层的按钮或链接。有 整体框架结构，导航栏，表格定位，布局合理，色彩搭配协调统一。
2 、主页的文件名为： index.htm 。文件名一般用英文小写字母。
Dreamweaver版式设计
1 .内容要求：根据选择的网站主题，通过网上搜索下载相关图片及文字素材。
2 .首页要求：栏目数量至少5个，网页为全屏显示：宽度固定，长度不限。版面格局、排布位置、字体设置均不受图表的限制，可任意发挥创作。界面风格要求明快简练，色彩不少于两种颜色。
3 .整个网站设计页面不少于6页，至少包括一个FlaSh动画。
4 .技术要求：将图片及图片说明文字做超文本链接，并且进入二级页面，显示相关信息。二级页面界面设计要求清晰明了、独特，色彩可根据首页及图片信息的特质来设定，链接流畅无误。
5 .网站保存：首页命名为index,htm(或index,html),完整的站点设置与内容，相应的页面及素材文件夹。
