网设计与制作实验大纲Word下载.docx
《网设计与制作实验大纲Word下载.docx》由会员分享,可在线阅读,更多相关《网设计与制作实验大纲Word下载.docx(10页珍藏版)》请在冰豆网上搜索。
能够运用flash制作与网页相关的小动画。
从而能够承担网站制作的规划、设计以及制作;
能够有清晰思路和动手能力解决各种各样的实际问题;
并具有与客户沟通、与团队成员协作的能力。
从而培养学生的开发网站的能力和职业素质。
二、实验教学目的及要求
通过上机实践,让学生掌握网页设计与制作的基本知识和基本技能,能较熟练地在Dreamweaver平台下合理设计网页并对站点进行规划、管理、发布,从而为下一阶段学习动态网页技术和高级Web程序设计打下良好的理论和实践基础。
三、实验项目设置表
序号
实验名称
实验
学时
仪器
套数
每套
人数
实验要求
实验类型
面向专业
1
HTML语言
2
掌握WWW工作原理、HTML语言基础
验证
信息管理、应用技术、软件技术、多媒体技术
使用Dreamweaver建立和管理站点
熟悉Dreamweaver
制作工具;
学会如何建立站点和管理站点。
3
文档的基本操作
掌握文档的基本操作、文本的基本操作。
4
表格
掌握表格的基本操作,以及用布局表格来设计网页。
5
图像和其他多媒体
掌握对图像、声音、动画和视频的基本操作。
6
链接
掌握创建链接和管理链接的方法。
7
框架集
掌握如何创建具有框架结构的页面。
8
CSS样式表
掌握制作CSS样式表的方法以及其应用方式。
9
层和时间轴
掌握如何创建层、编辑层,如何创建时间轴动画等。
10
行为
掌握添加行为和编辑行为的方法。
11
库和模板
掌握创建库和模板的方法,并熟练地对其进行管理和应用。
12
表单
掌握如何设计表单,如何添加表单对象等。
13
综合实例
学会设计并制作一个美观的静态主页
综合
(注:
“实验类型”:
指演示性、验证性、设计性、综合性、研究性等)
四、考核方法与评分标准
上机部分考核采取上机表现成绩结合实验报告成绩的方式进行,分数组成为:
上机成绩=上机表现成绩(50%)+实验报告成绩(50%)。
上机部分的成绩在本课程总成绩中占有的分值为20。
上机表现成绩基于上机实验出勤情况及上机过程的表现,每次上机对应1分。
实验报告成绩基于每个项目对应的实验报告完成情况,一个项目对应1分。
五、教材或指导书
1、教材:
《网页设计与制作》,马占欣、周文刚、支建飞编着,中国水利水电出版社,2007
2、主要参考书:
1)马占欣、周文刚、支建飞.网页设计与制作.北京:
中国水利水电出版社,2007.
2)甘登岱.网页设计三剑客(第5版).北京:
机械工业出版社,2006.
六、单项实验的内容和要求
1、实验名称:
使用HTML语言进行简单的网页设计
实验内容:
用记事本或写字板编写HTML文档,该文档文件名为“姓名”,使得最后显示效果如下图所示:
实验要求:
1.掌握WWW的工作原理;
2.掌握HTML语言的基本语法,并利用该语言进行简单的网页设计。
2、实验名称:
使用Dreamweaver创建站点和主页文件
1.建立本地站点
(1)在D盘建立一个名为“mysite”的文件夹。
(2)在文件夹“mysite”基础上建立一个名为“我的个人网站”的站点。
(提示:
站点|新建站点)
2.在“mysite”中创建和设置网站主页文件,要求如下:
(1)标题为“我的个人网站”,设置作为背景,上边距和左边距设为0
(2)网页中插入三行文字
1)第一行为“欢迎光临我的个人网站”(格式要求:
居中,字体大小为7)2)第二行为“这是我做的第一个网页”(格式要求:
居左,字体大小为5)3)第三行为“请多多指教”(格式要求:
居右,字体大小为1)
(3)在网页适当的位置插入一条水平线,结合网页背景设置水平线的颜色
1.掌握站点的创建
2.掌握网页文件的基本操作;
页面属性的设置;
文本的插入和格式设置
3、实验名称:
文档的基本操作
1.使用Dreamweaver制作如下一个页面,命名为“”,并在浏览器中运行,结果如下图所示。
在主页“”中,要求添加背景颜色,每句诗之间要空行,且整个诗要求居中,在“QQ的生活”创建一个空链接。
掌握文档的基本操作,掌握文本的属性设置。
4、实验名称:
表格的创建和使用
1.创建如下图所示的表格
2.使用表格完成如下图所示的页面布局。
1.掌握表格的创建;
表格的基本操作
2.掌握使用表格或布局表格设计网页的布局
5、实验名称:
多媒体元素的插入
1.使用布局表格完成效果如下图所示的页面布局,并插入网页的基本元素。
2、任选图像和文本,掌握两者的相互对齐方式
掌握图像、声音、动画、视频和其他多媒体元素的插入。
6、实验名称:
链接
1.将上次的作业复制到d盘,对主页文件””进行以下操作:
(1)选中图像”美食介绍”,链接到网页“”
(2)选中文本“伪满皇宫”,链接到网页“”
(3)为文本“联系我们”创建电子邮件链接,地址为自己的邮箱
2.创建一个网页“”,将图片””插入到网页中,请地图中创建若干热点,点击各热点时要求如下:
1)点击周口地区时,链接到文件上(在原窗口中显示)。
2)点击三门峡地区时,链接到某个图片上(在新窗口中显示)。
3)点击郑州地区时,做一个电子邮件链接,收件人是你本人的邮箱地址.4)
5)点击南阳地区时,做一个脚本链接,用alert函数弹出任意内容的信息窗口
6)点击洛阳地区时,要求跳到文件的底部(在该文件底部添加命名锚记)
7)在网页的顶部添加标题“河南省地图导航”,并将它做成一个超链接,要求鼠标放上时,右下角显示标题“这是河南图象地图”,链接目标为空链接(任意一种),并且可以使用“alt+d”
快捷键直接选中该链接。
1.掌握相对路径的设置
2.掌握基本超级链接、电子邮件链接、热点链接、锚点链接、脚本链接的创建
7、实验名称:
制作具有框架结构的网页
1、建立一个名为“花的世界”的站点,自己定义站点文件夹名,并创建一个如下所示的框架集,根据需要对其中各个框架的大小和属性进行设置并保存(文件|保存全部),保存时建议输入一个好记的名称。
当单击左边框架花的名称,主框架中会显示对应的内容。
1.了解框架集和框架的概念
2.掌握框架结构网页的创建及常用属性的设置
8、实验名称:
创建CSS样式表
1.完成以下操作:
(1)使用重定义标签的方法把中的表格中的所有文字设置成12像素,红色,应用范围仅对该文档。
(2)首先把中的表格中“连接”两个字做成空链接,然后把该链接使用重定义标签的方法设置成没有下划线,绿色,14象素大小。
应用范围是外部的样式表文件,名字为
(3)使用CSS高级样式,把中的链接的四种状态分别定义为:
正常状态(link)为红色,12像素;
鼠标放上状态(hovor)为蓝色,14像素;
正在点击状态(active)为黄色,16像素;
访问过的状态(visitied)为黑色,18像素。
以上四种状态都没有下划线。
应用范围仅对该文档。
(4)使用自定义样式(class)的方法,把中的4句话分别设置4种不同颜色和字体的的自定义样式,名字任意。
(5)新建一个文件,在其中建立一个链接,用链接外部样式表的形式把中的样式应用到当前文档中。
1.了解CSS的基本概念
2.掌握三种CSS样式类型的创建及应用
3.掌握”CSS规则定义”对话框中样式八大类别的使用
9、实验名称:
利用时间轴创建层动画
1、建立文件,要求在图片背景上,使用能够扇动翅膀的3张蝴蝶图片(GIF格式),结合层和时间轴设计出自由纷飞的效果。
2、建立文件,利用层的嵌套属性结合时间轴能够制作出站点中常见的公告板,公告板中的文字从下向上循环运动,能够对网页中的重要内容进行动态分布.
3、建立文件,利用录制层路径的方法创建一个动画,要求层运动的轨迹是一个近似圆形,预览时,动画在打开浏览器两秒钟后才开始播放,请根据时间轴的相关知识实现。
1.了解时间轴
2.掌握应用层和时间轴制作动画的方法
10、实验名称:
添加行为
1.在页面中继续回车换行,插入一个层,设置层的背景颜色为绿色,当在层上单击鼠标时,层的背景颜色变为红色。
2.建立页面,插入图片“”,在图片上3个圆形区域“机器猫”“小黑熊”“米老鼠”上分别创建3个热点。
当鼠标移到相应热点上时,显示相应的图片,鼠标移开时,所有图片消失。
请根据层和行为实现。
效果如下入所示:
1.熟悉对象、事件、动作和行为的基本概念
2.掌握使用行为面板添加和编辑各种行为
3.掌握Dreamweaver自带行为的应用
11、实验名称:
创建模板和库
1.利用模板制作如下图所示的网页。
图人与自然首页
图植物天地页面
图动物世界页面
1.掌握利用资源面板管理站点中各种资源
2.掌握利用模板和库制作统一风格的网站,并更新网站中的各个网页
12、实验名称:
制作表单
结合表格的布局功能和CSS样式表的相关知识,设计如下图所示的表单页面。
1.掌握在网页中插入表单的操作
2.掌握表单元素属性的设置的操作
3.能够运用表单及表单对象制作网页
13、实验名称:
制作一个静态网页
1.请按照图中所示进行主页设计,在完成设计后的“个人信息”栏中写上自己的姓名,学号。
2.页面布局要合理,不能出现表格偏移,错位的情况。
页面要分成明显的图片标题区,导航条区,
3.主内容区以及最下面的版权说明区。