1、WEB技术开发基础篇实训指导书编著:曾晓亮 吴琼 2010年12月WEB技术开发基础篇实训指导书 本实训主要面向计算机网络、电子商务专业、信息系统专业的学生。时间为一周。实训目的与性质实训的主要目的是让学生对网页开发进行实践,理解网页开发的基本技术。本实训为必做应用性课程实训,可安排在第3、4学期,每个实训建议为2学分。实训环境的准备本实训的环境要求安装Windows2000以上版本操作系统,Web服务器采用IIS5以上版本,网页开发软件安装Dreamweaver。实训程序及进度安排本实训以学生的网页设计活动为主线,在此过程中,教师给予适当的指导并重点控制实训进度安排。教学程序建议如下:1)布
2、置任务和要求指导教师说明网页设计实训的基本要求和实训的要点。2)网页设计根据要求,完成网页的设计。实训评测及考核方法本实训的成绩将以个人为单位给出, 进行上机实训检查,按开发出的网页运行效果、正确性及先进性等因素进行评分,同时学生要提交实训报告,平时上机检查成绩占15%,整体作品检查60%,实训报告成绩占25%。实训内容一共安排十一个实训,分别对网页设计的每一章节进行实践。实训一 网页设计基础1. 用Dreamweaver制作一个简单的网页,可以在网页中加入文字、图片等,并设置网页的背景色以及网页标题。2. 设计一个网站。要求创建一个支持ASP VBScript的站点。实训二 表格的应用1.
3、利用表格布局制作一个效果如下图的个人主页。(图片材料可以自己准备)实训三 超级链接1. 利用超级链接创建几个唐诗的链接,使得网页能够在点击唐诗的题目时进行页面的转换。2. 做一个友情链接页面,提供例如搜狐、网易、雅虎中国等网站的图片链接,要求新窗口中打开链接。3. 做一个软件下载页面,提供一些小软件的下载功能。4. 在一个图片上分别创建矩形热点、圆形热点和一个不规则形状的热点,并分别设置不同的链接。5. 创建一个电子邮件链接,链接目标为自己的电子邮件。实训四 图像和多媒体在网页上插入背景音乐循环播放和flash图片。实训五 CSS样式表创建几个外部CSS样式表文件,用来统一某个网站中不同网页的
4、格式。(如:正文、标题等)实训六 网页布局设计1. 用表格布局的方法布局下图2. 灵活运用布局方法仿照新浪网的网页进行布局。实训七 灵活应用图层和行为1. 熟悉并应用软件中内置的其他行为动作,尝试使用“拖动层”的行为动作命令来制作网页中元素的拖拽效果。2. 尝试把“可控制滚动方向的图片”实例进行完善,实现鼠标移动到图片上时能使得图片停止运动,鼠标离开时继续移动。实训八 扩展Dreamweaver的应用1. 自己搜集一张图片,在Fireworks或Photoshop中进行切片处理,并给切片增加交换图像行为,并导出HTML文件。尝试切片的鼠标右键菜单中其他功能。2. 根据自己的爱好去搜集经典的插件
5、,并安装运行。实训九 模版、库和站点管理1. 创建一个简单的个人网站模版,新建两个基于该模版的网页,并填上简单的内容。2. 将上题完成的网页中的某个元素(如图象、表格、声音和Flash文件等)转化为库项目。然后更改这个库项目,并更新使用这个库项目的所有网页。3. 运用站点管理功能进行上传,并能对本地文件和远程站点的文件进行同步更新。实训十 打造一个互动留言板1. 打造一个互动留言板程序。(asp程序,)实训十一 精彩网站制作实战本部分要求整合之前完成的全部内容,形成完整的网站,巩固网页设计的操作技能。要求按照以下顺序进行。1. 网站总体策划2. 网站的建立3. 制作主页面4. 制作其他页面5. 链接主页面和其他页面6. 将网页上传到因特网上(下载FTP软件或用Dreamweaver自带软件上传)