网页设计与制作-实验大纲

1、网页设计与制作课程实验教学大纲 课程性质：独立设课 课程属性：专业基础实验课 适用专业：应用技术、多媒体技术 学 时：总学时96实验学时 32 开岀时间：二_年级一学期 综合性、设计性实验项目数：4学时 先修课程：计算机基础 一、课程简介 网页设汁与制作课程是计算机专业的一门必修专业课程。它涵盖Dreamweaver网页 设计、Flash动画制作、Photoshop图像处理、动态等多项相关知识，通过开发一个，全而 介绍WEB站点设计的基本操作技术和使用技巧，为后续XML语言、动态网页制 作等课程打下一个坚实的基础。 通过本课程的学习，使学生掌握运用Dreamweaver进行的导入、规划、管理、

2、发布 的相关技术及网页制作的操作技能；能够熟练运用HTML中的文字、列表、表格、表单、图 像、多媒体、等设计出多窗口网页、动态网页：能够利用Photoshop设计网页界而，处理图 像：能够运用flash制作与网页相关的小动画。从而能够承担制作的规划、设汁以及制作： 能够有清晰思路和动手能力解决各种各样的实际问题：并具有与客户沟通、与团队成员协作 的能力。从而培养学生的开发的能力和职业素质。 二、实验教学目的及要求 通过上机实践，让学生掌握网页设计与制作的基本知识和基本技能，能较熟练地在 Dreamweaver平台下合理设计网页并对站点进行规划、管理、发布，从而为下一阶段学习动 态网页技术和高级

3、Web程序设计打下良好的理论和实践基础。 三、实验项目设置表 序 号 实验 名称 实验 学时 仪器 套数 每套 人数 实验要求 实验类型 面向专业 1 HTML 语 亠 ri 2 1 1 掌握WWW工作原理、 HTML语言基础 验证 信息管理、应用 技术、软件技术、 多媒体技术 2 使用 Dreamw eaver 建立和 管理站 点 2 1 1 熟悉 Dreamweaver 制作工具：学会如 何建立站点和管理 站点a 验证 信息管理、应用 技术、软件技术、 多媒体技术 3 文档的 基本操 作 2 1 1 掌握文档的基本操作、 文本的基本操作。 验证 信息管理、应用 技术、软件技术、 多媒体技术

4、 4 表格 2 1 1 掌握表格的基本操作， 以及用布局表格来设讣 网页。 验证 信息管理、应用 技术、软件技术、 多媒体技术 5 图像和 其他多 媒体 2 1 1 掌握对图像、声音、动 画和视频的基本操作。 验证 信息管理、应用 技术、软件技术、 多媒体技术 6 2 1 1 掌握创建和管理的 方法。 验证 信息管理、应用 技术、软件技术、 多媒体技术 7 框架集 2 1 1 掌握如何创建具有 框架结构的页面。 验证 信息管理、应用 技术、软件技术、 多媒体技术 8 CSS样 式表 2 1 1 掌握制作CSS样式表的 方法以及其应用方式。 验证 信息管理、应用 技术、软件技术、 多媒体技术 9

5、 层和时 间轴 4 1 1 掌握如何创建层、编辑 层，如何创建时间轴动 画等。 验证 信息管理、应用 技术、软件技术、 多媒体技术 10 行为 4 1 1 掌握添加行为和编 辑行为的方法。 验证 信息管理、应用 技术、软件技术、 多媒体技术 11 库和模 板 2 1 1 掌握创建库和模板 的方法，并熟练地 对其进行管理和应 用。 验证 信息管理、应用 技术、软件技术、 多媒体技术 12 表单 2 1 1 掌握如何设计表 单，如何添加表单 对象等。 验证 信息管理、应用 技术、软件技术、 多媒体技术 13 综合实 例 4 1 1 学会设计并制作一 个美观的静态主页 综介 信息管理、应用 技术、软

6、件技术、 多媒体技术 （注：“实验类型”：指演示性、验证性、设计性、综合性、研究性等） 四、考核方法与评分标准 上机部分考核采取上机表现成绩结合实验报告成绩的方式进行，分数组成为： 上机成绩二上机表现成绩（50%） +实验报告成绩（50% ） 上机部分的成绩在本课程总成绩中占有的分值为20.上机表现成绩基于上机实验出勤 情况及上机过程的表现，每次上机对应1分。实验报告成绩基于每个项目对应的实验报告完 成情况，一个项目对应1分。 五、教材或指导书 1、教材：网页设计与制作，马占欣、周文刚、支建飞编著，中国水利水电，2007 2、主要参考书： 1）马占欣、周文刚、支建飞.网页设计与制作：中国水利水

7、电，2007. 2）甘登岱.网页设计三剑客（第5版）.：机械工业,2006. 六、单项实验的容和要求 1、实验名称：使用HTML语言进行简单的网页设计 实验容： 用记事本或写字板编写HTML文档，该文档文件紅为.htm”，使得最后显示效果如 下图所示： 实验要求： 1. 掌握WWW的工作原理： 2. 掌握HTML语言的基本语法，并利用该语言进行简单的网页设计。 2、实验名称：使用Dreamweaver创建站点和主页文件 实验容： 1. 建立本地站点 （1）在D盘建立一个冬为“mysitc”的文件夹。 （2）在文件夹“mysitc”基础上建立一个名为“我的个人”的站点。（提示：站点I新建站点）

8、2. 在“mysitc”中创建和设置主页文件indcx.html,要求如下： （1）标题为“我的个人”，设置bg.jpg作为背景，上边距和左边距设为0 （2）网页中插入三行文字 1）第一行为“欢迎光临我的个人”（格式要求：居中，字体大小为7） 2）第二行为“这是我 做的第一个网页“（格式要求：居左，字体大小为5） 3）第三行为“请多多指教”（格式要求: 居右，字体大小为1） （3）在网页适当的位程插入一条水平线，结合网页背景设置水平线的颜色 实验要求： 1. 掌握站点的创建 2. 掌握网页文件的基本操作：页而属性的设置：文本的插入和格式设豊 3、实验名称：文档的基本操作 实验容： 1使用Dre

9、amweaver制作如下一个页面，命名为“index.htm”，并在浏览器中 运行，结果如下图所示。在主页“index.html”中，要求添加背景颜色，每句诗 之间要空行，且整个诗要求居中，在“QQ的生活”创建一个空。 实验要求：掌握文档的基本操作，掌握文本的屈性设宜* 4、实验名称：表格的创建和使用 实验容： 1.创建如下图所示的表格 2 使用表格完成如下图所示的页面布局。 。苗丽 0取吊找弋 陞的网站HI O扰的相朋O 2009年3月9曰星初 制作甲位周口.帅范孚院计ft机科学.義 制作人.XXX 实验要求： 1. 掌握表格的创建：表格的基本操作 2. 掌握使用表格或布局表格设讣网页的布局

10、 5、实验名称：多媒体元素的插入 1.使用布局表格完成效果如下图所示的页面布局，并插入网页的基本元素。 X亩介细 Flash 动画 伪糊土宫 怅績纟世纟己城 世尺wtgff召05 冷月潭祚林參回 K欄是个且彌敢汕田區皈市规划怖点旳城市 市旦內石跖注立血 3. 街眄歼松 怕常=犯如泉戻碌色米碗，巫座街 4厂境刖花丛冷黑 注.足丿j门休 思和展塔、嫉乐的好场所.中回古與徨筑 也 有曰 或和汰迁丹筑，而不顧咆起旳茗楼大应和辰民住宅卜匡惊帶长吞不 晰增饰心古伶中夕卜丸化 夕I弦师映旳敞讯和现代了匕城市的独力isxmis 示北部旳饯的洲国JSTS堆:中国酒料末代宴冷茨折免穿帶仪務三伙 型基旳的宜殿 伪淋

11、政权 国 耳阮尊 疗八大邮龙IL矢I日址利侔 琐至地磋若寺也是国欢那旅潞礙点 概： Ess 、 * 连E O331 130000 位于松辽平庾中部 四北与白城市田比泮.匹內吕四干市怕 林市彳目;生，换北向JR龙彳工幺珞曲 下镐南捉邑、肉城邑、明阳E、二道E、国OE、饭阳 九白吊、柿I栩市、8刑中的“ g3人EMitr?念呛任k 枷爲.它幻从久知口沦卜円*停衫的ne曲 竝mspwle丄育戸乂曲刃，icsHrab比比swim cut, r它（dwitw 仍昨剔兀紐ss味rn*f处列0W25mrafi了尢金丝不弋仔时2片ets歓比阳ir*吃也卩卸押石劝丘帅 VM9T从址筆彩片中哥副，左、E JflR

12、ORU员“刁JMO2I上下 3馬如 StV1血nd共iiSEbLl泥金刃史JR 如 ten rt- RtlfiWfe干aX CCT4-CO)ttXj 伶其：C0YS8X3XW m 会员注朋 （话坝写个人资料标有*的顶目必须坝写） 水用户名. 确认 理示冋Kb 说仝罔 联芳电话. 厂妊名和联东方式厂以J2M己的耳他锻胳 tE I 说各 ：4性别 TE件穽更: 漩件马科, 好阳理示答耒, 汶出生日刊 个人臣明， 我曲意耳他人可UX股宋到毅的I次T逐肝. 所厦行业, 毀祠水平. 您的快入水平= 13实验名称：制作一个静态网页 实验容： 1. 请按照图中所示进行主页设计，在完成设计后的“个人信息”栏中写上自己的，学号。 2. 页而布局要合理，不能出现表格偏移，错位的情况。页而要分成明显的图片标题区，导 航条区， 主容区以及最下而的说明区。 3. 其中当前日期的代码已经给出（时间代码.txt），请把该代码正确应用到网页的导航条中 4导航条要求用单线表格完成（如图，即表格边框仍为0,但单元格之间有分界线且为单 线）。 5. 使用表单设计主页左上方的“极限论坛区域，区域中“注册“和“登陆“按钮要求用图象域 完成。 6. 结合使用层和时间