华北科技学院计算机系综合性Word格式文档下载.docx
《华北科技学院计算机系综合性Word格式文档下载.docx》由会员分享，可在线阅读，更多相关《华北科技学院计算机系综合性Word格式文档下载.docx（10页珍藏版）》请在冰豆网上搜索。
《网页制作》课程综合性实验报告
开课实验室：
基础六2008年11月24日
实验题目
华北科技学院校友会网站的开发
一、实验目的
使用Dreamweaver、Fireworks、Flash三种软件完成网页的制作。
二、设备与环境
微机、Dreamwaver8、Fireworks8、Flash8
三、实验内容
1.按照特定的主题制作一个完整的网站。
2.使用Dreamweaver、Fireworks、Flash三种软件完成网页的制作。
3.网站中要包括表格/框架/层布局、图像、文本、超级链接、导航、CSS样式。
网站页面总数不少于6个。
4.至少要包括3个自己制作的Flash动画。
上交文件中要包括该动画文件的源文件*.fla文件和导出文件。
5.至少要包括3个自己用Fireworks制作的图像文件，并且在每个图像文件中应用至少两种学过的技术手段进行处理。
上交文件中要包括该图像文件的源文件*.png文件和导出文件。
6.尽可能多地使用学过的技术手段。
7.不允许抄袭其他同学的内容，如果两人有雷同，两个人都按照不及格处理。
8.不允许从网上下载别人的网站当作考试内容上交。
9.在上交文件中主页一律以index.htm命名。
10.把所有文件和文件夹放在一个总的目录下,目录以：
班级+姓名+学号最后两位的形式命名。
例如：
信管B061张三03.rar。
将index.html放在该文件夹下。
最后将该目录压缩成一个*.rar文件。
四、实验结果及分析
1.网站内容的定位
经过反复思考，最终将网页的主题定为“华北科技学院校友会”。
该网站主要面向已经从学校毕业的校友，给他们一个相互交流的平台。
主要的栏目分为：
母校要闻、各地校友会、活动快讯、校友风采、校友社区BBS、校园风景、校友留言、用户中心等。
由于时间仓促，只做首页、栏目页、部分内容页、校园风景的专题页面。
预留好模板为网站动态化做好准备。
2.网站首页的制作
网站采取了模板制作的方式，由于首页和内容页相差不是很大，总体的架构不会变化。
制作其他页面时只需在模板页基础上稍加修改即可。
首页各个模块的布局如下：
该页采用Table布局，由表格相互嵌套而成。
头部的Logo与banner还有导航条都是由Flash制作而成。
第一个Flash较为简单，随时间推移，各个文字随之出现，第二个采用ActionScript编写，两个效果如下：
首页的其他部分，均采用表格布局形式，具体步骤不再赘述，样式表方面采用内部和外部同时调用，外部样式表位置为【style/styl.css】网页中的超链接采用颜色#333333，无下划线，CSS如下：
a:
link{
color:
#333333;
}
visited{
text-decoration:
none;
hover{
active{
网页背景CSS
body{
background-color:
#eeeeee;
去掉头部空条
margin:
0px;
Dreamweaver中的部分截图：
3.网站栏目页和内容页的制作
网站的首页制作完毕后，只需将中心部分去掉，做成模板，如图：
该页制作完后即可添加栏目页和内容页。
如图：
4.校园风景页面的制作
校园风景页面是一个网站相册的形式，为了美观性使用了LightBox特效，点击缩略图后即可打开完整的图片。
效果如图：
5.页面的发布
网站制作完成后结构如下：
Flash文件夹（存放flash文件）
Images文件夹（存放图片）
Scripts文件夹（存放脚本）
Style文件夹（存放CSS文件）
Index.html（网站首页）
Fengjing.html（校园风景专题页）
Lanmu.html（栏目页）
Jianshezhong.html（网站建设中页面）
wz1.html（文章1页面）
wz2.html（文章2页面）
wz3.html（文章3页面）
将所有文件放到服务器目录中，经测试正常，Linux服务器区分大小写，文件名应全为小写。
Windows的IIS服务器大小写均可。
最终的页面如下：
6.心得与体会
经过本次网页制作的综合实验，我对网页制作有了更深的理解，对Table表格布局更加熟练，对网页美工的设计也更加娴熟，但设在设计方面特别是颜色的搭配，美术处理都不是很精通。
在以后的学习中要加强锻炼。
由于时间仓促，许多细节的处理不是很到位，有些边框错位，有的地方却没有边框，而且对于浏览器的兼容性也没有多考虑，不过Opera浏览器显示正常毕竟是表格嵌套的。
在以后的学习中应该多加强Div+CSS的训练，这次也使用了少量的CSS代码，这是Web标准化，更是将来的网页制作的主流。
最后，感谢老师和很多同学的指导和建议，我相信只要努力一定可以做的更好！
教师评价
评定项目
A
B
C
D
算法正确
界面美观，布局合理
程序结构合理
操作熟练
语法、语义正确
解析完整
实验结果正确
文字流畅
报告规范
题解正确
其他：
评价教师签名：
2008年12月8日
升级会员 