Web实验报告

Web实验报告课题：网页设计与制作

专业：通信工程

班级：

学号：

一.实验任务：

设计制作一个《网页设计与制作》精品课程网站

二．实验要求：

（1）站点目录：要求层次分明，不能将内容都放在站点根目录下；不要使用中文；为每种类型文件都建立一个独立的目录。（例如images文件夹用于存放图象,目录的层次不能没有，但必须尽量少，以便于管理。）

（2）填写网站设计报告：必须认真填写网站设计报告中的每一项，完成网站结构的设计说明，包括以下各项内容：

1) 网站主题：必须围绕一个确定主题创建网站，否则成绩以不及格计。

2) 站点名称：必须为自己的站点命名，名称要紧扣站点主题，并反映在每个网页

上。

3) 站点根文件夹：以个人学号及姓名命名。

4）文件与文件夹：网站内使用的图片放在images文件夹中,主页以index.htm命名,其它文件夹自已命名,要以有意义的英文字母来命名,不要使用中文,网页文件也要使用有意义的英文来命名。

5) 站点结构：分类存放网站中的资源，一律以树型目录结构表示并说明文件夹的

用途。

6) 站点地图：以结构图方式给出网页的名称和各页面间的超级链接。

7) CSS、行为：说明制作、使用了几个CSS样式，说明CSS样式的名称，为什

么内容添加、制作了什么行为。

2. 网站内容要求（3人一组）

（1）网站至少要有8个页面，可以使用表格、框架等来进行统一布局。

（2）网站的站标（Logo）使用自已制作的图像，网站名称自已命名，要跟网站的主题一致。

（3）按提供的课件等资料添加链接或下载功能。

（4）每个网页有自己的适当的标题、导航条。注意：网页标题是指显示在浏览器标题栏上的文字，而不是网页中的段落标题。每个网页都能够返回上一级页面或首页。

（5）网站中要使用CSS，要使用行为制作动态效果，超链接效果正确无误，要有锚点链接，要有背景音乐，要能够提供文件下载，要有flash动画。可添加视频文件等。

三．实验内容：

该网站设计共使用了9个HTML页面。

采用了frame框架结构：由frame1，frame2，frame4，及相关页面构成。

进入shouye.html后，播放背景音乐；

frame2中点击各个选项，分别跳转到相关界面；

资料页面：采用链接，可实现课件资源的调用；

Flash页面：实现了锚点连接，超链接，flash图像的播放

留言板：代码中写入了相关留言，可点击查看。

设计中使用了CSS的设计，菜单界面歌词部分使用了表格结构，共调用了3个CSS方法；名字分别为：.unnamed1，.text和.bt。内容如下：

.unnamed1 {

font-size: 13px;

line-height: 16px;

}

.text {font-family: Arial, sans-serif;

text-align:right;

}

.bt {font-family:"宋体";

color:#F60;

}

分别对字体，大小及颜色进行各自不同的设置；

留言板部分也使用了div进行布局；

超链接正常无误，均能返回上一层；点击“返回菜单”后各页面均可回到主页面。效果如下：

结构图：

Img文件夹 jpg图片flash图片

根目录 yinyue文件夹 mp3音乐文件

Ziliao文件夹课件压缩包

Html页面

实验总结：

通过本次的Web实验，我对网页制作及开发有了更深层的了解。制作过程中，运用了框架，链接，CSS等方法。不仅完成页面的跳转，也实现了本地保存资料，锚点连接，flash等功能。对于网页制作的工具及使用，我有了进一步的熟悉和了解。

制作过程中遇到了一些问题，但在同学的帮助下，都克服了困难。这些经历让我对设计细节有了更详细的关注，是十分宝贵的人生经验。我对网页的设计存在着浓厚的兴趣，希望在今后的时间里，我还能有更多的机会接触到WEB这门知识。