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