网设计与制作实训指导书.doc

《网页设计与制作》

实

训

指

导

书

主编：王春艳

《网页设计与制作》实训指导书

目 录

一、总体说明 1
二、实训1 ——制作“班级网站”首页 3
三、实训2 ——制作“班级新闻”及其下级页面 4
四、实训3 ——制作“班级相册”页面 4
五、实训4 ——制作“关于我们”页面、“个人主页”页面 5
六、实训5 ——制作“网页设计”页面 6
七、实训6 ——制作“留言本”页面 6

一、总体说明
1、实训目的与要求
a、实训目的
《网页设计与制作》是一门实践性、操作性很强的课程，学生必须通过动手实践操作才能更好地掌握。因此，在本学期，特设置针对此课程的实训，集中一段时间使学生能将所学知识用于具体的实践。
b、实训要求
1）老师认真组织，充分调动学生的积极性与主动性，在规定的时间内按计划有步骤地完成课程设计的各项内容，达到预定的教学目的。
2）学生进入机房后，根据学号对应机号入座，不能随意移动机位。
3）实验室需提供方便，全力配合。
4）学生必须认真学习实训指导书，查阅相关参考资料，在教师的指导下按要求完成实训任务；学生每天按上课时间进行实训，不迟到、不早退、不准中途溜出，纪检委员负责考勤登记，并及时将考勤情况报指导老师；学生在实训过程中应勤于思考，刻苦钻研，把理论与实践结合起来，提高对理论知识的理解，增强动手能力。
2、实训内容
实训1——创建网站；绘制网页的布局图；制作“班级网站”首页
实训2——创建模板，利用模板制作“班级新闻”页面及其下级页面
实训3——利用模板制作“班级相册”页面
实训4——利用模板制作“关于我们”页面、“个人主页”页面
实训5——利用模板制作“网页设计”页面
实训6——利用模板制作“留言本”页面
3、参考课时
28课时
4、实训材料准备
硬件：一个机器性能较高的机房；投影仪
软件：Windows操作系统
Dreamweaver CS4、photoshop CS4、IE、FireFox、IETester等工具软件
PDF阅读器
广播教学软件
资料：《网页设计与制作》教材、《网页设计与制作》实训指导书
5、考核办法
1）出勤 10%
2）实训上交材料（包括实训报告、实训结果、实训总结） 10%
3）“班级网站”网页 80%

注意：
1）考勤：每迟到一次扣5分，早退一次扣5分，旷课一节扣15分，迟到十五分钟以上，算旷课一节。
2）整个实训完成后，将班级网站文件夹提交
3）整个实训完成后，各填写一份实训报告及实训总结提交。
4）未交实训资料或资料完全拷贝他人，均按不合格计。
二、实训1 ——创建网站；绘制首页的布局图；制作“班级网站”首页
1、创建网站
1）按下列要求，在DW中创建班级网站站点：
" 网站名称：ClassWebSite
" 网站文件夹：两位学号+中文姓名拼音+ClassWebSite
（示例：08ZhangSanClassWebSite）
2）按下列要求，在站点中创建如下子文件夹：
" 存放模板的子文件夹：Templates
" 存放图片素材的子文件夹：images
" 存放外部样式表的子文件夹：style
2、绘制首页布局图
参照表格布局的班级网站源代码，用Word绘制首页的布局图。要求word文档命名为“首页布局图.doc”
3、制作首页
首页文件名：index.html
注册页面：register.html
登录页面：login.html
三、实训2 ——绘制“班级新闻”页面的布局图；创建模板；利用模板制作“班级新闻”及其下级页面
1、绘制“班级新闻”页面布局图
参照表格布局的班级网站源代码，用Word绘制“班级新闻”页面的布局图。要求word文档命名为“班级新闻布局图.doc”

2、创建模板
模板文件名：template.dwt
3、制作“班级新闻”页面
“班级新闻”文件名：news.html
4、制作下级页面
" 普通话页面：putonghua.html
" 名曲欣赏页面：music.html
" 奥运史页面：olympic.html
" 卫生健康页面：health.html

四、实训3 ——绘制“班级相册”页面的布局图；利用模板制作“班级相册”页面
1、绘制“班级相册”页面布局图
参照表格布局的班级网站源代码，用Word绘制“班级相册”页面的布局图。要求word文档命名为“班级相册布局图.doc”

2、制作“班级相册”页面
“班级相册”文件名：photo.html
3、制作下级页面
" 风景欣赏页面：photo1.html
" 牡丹页面：photo2.html
" 学生风采页面：photo3.html

五、实训4 ——利用模板制作“关于我们”页面、“个人主页”页面
1、制作“关于我们”页面
“关于我们”文件名：aboutus.html
2、制作“个人主页”页面
“个人主页”文件名：personal.html

六、实训5 —— 利用模板制作“网页设计”页面
1、制作“网页设计”页面
“网页设计”页面：webdesign.html
2、制作“目录”页面
“目录”页面：left.html
3、各章内容，可直接使用源代码中的页面，并将相应页面按下列要求重新命名
“第一章内容”页面：chapter1.html
“第二章内容”页面：chapter2.html
……
“第十一章内容”页面：chapter11.html
“经典代码”页面：classiccode.html
七、实训6 —— 利用模板制作“留言本”页面
“留言本”页面：message.html