武汉商贸职业学院
信息工程学院
《网页设计与制作综合实训》实训指导书
软
件教研室
2013 年9月
《网页设计与制作综合实训》实训指导书
目录
实训目的 (1)
实训内容及要求 (1)
实训性质、实训地点、实习时间安排，适用专业班级 (2)
实训一站点的规划设计 (3)
实训二设计案例网站LOGO (4)
实训三设计案例网站BANNER (5)
实训四设计案例网站导航条 (6)
实训五设计案例网站网页内容和网页版权声明 (7)
实训六对案例网站版面切图 (8)
实训七制作完成案例网站首页 (9)
实训八案例网站模板的制作 (10)
实训九案例网页超级链接的添加 (11)
实训十案例网站加入动态元素 (12)
第2 页
实训目的
在前一阶段，学生完成了《网页设计与制作》、《图形图像处理》、《CSS设计》、等专业课程的学习，为了让学生将前期的专业课程学以致用，融会贯通，特开设本系统化实训。
本次综合实训基于学生的兴趣，选取专业建设网站开发为主题，基于网页开发的流程，把实训周期当做是一个项目的开发周期，严格把握项目进度，最终要求学生完成网站的前台设计。
通过本次实训希望达到以下目的：
1.熟悉和掌握Dreamweaver软件的使用方法；
2.熟悉和掌握PS软件的使用方法；
3.熟悉FLASH软件应用的方法；
4.学会使用CSS+DIV做网页布局；
5.熟练掌握站点的规划与设计
实训内容及要求
本实训的内容简述：
1. 网站首页
（1）专业概况
（2）专业建设规划
（3）展示最新动态文章标题（8条）
（4）专业建设成效的文章标题（8项）
（5）专业建设特色文章标题（8项）
2. 专业概况
点击项目概况，显示相关文本
3. 专业建设规划
点击项目申报书菜单，显示flashpaper格式的申报书内容
4. 专业建设特色
显示专业建设特色的文章标题列表，点击标题进入内容
5. 专业建设动态
显示专业建设动态的标题列表，点击标题进入成果详细展示
6. 专业建设成效
显示专业建设成效的标题列表，点击标题进入成果详细展示。
本实训的要求：
1.应用css和html（div+css）技术完成至少4个页面，其中必须包括网站主
页面设计、栏目页设计、管理员管理登陆页面、管理员登录以后的页面。2.显示环境：网页视觉效果应采用Internet Explorer 6.0以上版本浏览器，
显示分辨率以1024×768状态为准。
3.网页规模：网页总量原则上不应超过10M，且必须要是不连接互联网就可以
进行展示的作品。
4.网站结构：要求结构清晰，文件有清晰的分类，比如图片都放在images文
件夹下等。
5.要求页面美观大方、颜色搭配协调；
6.作品留存，下学期或下一阶段继续完善、开发。
实训性质、实训地点、实习时间安排，适用专业班级
该实训为校内模拟实训。根据高等教育教学大纲规定和学院教学计划安排及培养学生职业技能的要求，软微班的学生于第一学期进行为期4周的校内实训，项目名称为《网页设计与制作综合实训》。
实训时间：2013-2014学年第一学期第15-18周
实训班级：软件1301班、软件1302班
实训地点：学校机房
实训一站点的规划设计
1、学时分配：6学时
2、实训目的
（1）熟悉Dreamweaver软件的界面布局和工作环境。
（2）熟练掌握本地站点创建和管理的方法。
3、实训任务
（1）创建一个静态网站站点。
（2）从网络上收集网页素材。
（3）根据提供的网站策划方案范本，结合自己要制作完成的网站，开始着手书写网站策划方案。
4、实训内容
（1）打开Dreamweaver软件，熟悉软件的界面布局和工作面板的摆放，能够熟练使用Dreamweaver 软件。
（2）在本机D盘上创建文件夹“home”，在“home”文件夹下根据网站的规划设计，创建相关的文件夹，用来放置不同的文件。
（3）在Dreamweaver软件中，将D盘“home”文件夹定义成静态网站站点，站点名称任意。
5、实训要求
（1）由指导教师讲清实训的基本原理，要求，实训目的。
（2）实训不分小组，要求每位同学均能独立地完全相关实训的设计与制作。（3）教学实训除了验证课程理论外，还要求学生掌握网络资源的搜索与应用。
（4）除了教师的指导外，还要着重培养学生自学的能力。
实训二设计案例网站LOGO
1、学时分配：6学时
2、实训目的
（1）熟悉Photoshop软件的界面布局和工作环境。
（2）熟练掌握网站LOGO的设计方法。
（3）创建项目案例网站的LOGO。
3、实训任务
（1）掌握Photoshop软件文字工具工具的使用方法。
（2）查看网络上相关网站LOGO。
（3）根据小组讨论结果，实际动手完成网站的LOGO。
4、实训内容
（1）打开Photoshop软件，熟悉软件的界面布局和工作面板的摆放，能够熟练使用Photoshop软件。
（2）新建Photoshop文件，大小为980*600像素，分辨率为72像素/英寸，颜色模式为RGB颜色8位，背景颜色为白色或者透明都可以。
（3）使用文字工具，输入MZD三个字母，设置文字属性。
（4）栅格化文字图层，将栅格化后的图层上的3个字母分别移动到不同的3个图层上。
（5）分别对3个字母进行艺术化处理。
（6）输入其他的文字。
（7）为输入的文字图层设置“混合选项”。
（8）保存文件。
5、实训要求
（1）由指导教师讲清实训的基本原理，要求，实训目的。
（2）实训不分小组，要求每位同学均能独立地完全相关实训的设计与制作。（3）教学实训除了验证课程理论外，还要求学生掌握网络资源的搜索与应用。
（4）除了教师的指导外，还要着重培养学生自学的能力。
