《web标准网页设计》课程设计报告
发布时间:2014-09-28 10:57:40
发布时间:2014-09-28 10:57:40
《Web标准网页设计》
课程设计报告
姓 名: 贺士帅
学 号: 119074290
学 院: 计算机学院
日 期: 2012/5/2
一、课程设计题目(网站名称):
无痕WEB工作室
二、课程设计内容:
1、网站总体框架结构图。
分析网页整体内容(制作页面效果图,文字方面),根据要求按照制作网页的一般步骤依次完成页面内容图片文字的设计,排版,运用DIV+CSS对页面进行修饰布局(水平和垂直结构)。
2、所采用技术介绍(包括使用的设计工具、用到的相关技术等)。
DIV+CSS,Dreamweaver,Baidu
3、详细设计过程(可附图)
1. 新建站点,命名,图片素材文件夹为”img”,CSS文件夹 。为”css”(所有CSS以外联文件 的形式保存),写好网页名称。
2. 分析页面结构,运用DIV+CSS对页面进行布局,并对各DIV进行命名。
3. 根据heads.jpeg的大小设置heads层的大小,并将图片heads.jpeg设置为header层的背景。
4. 采用XHTML中无序列表搭建导航条。
5. 网站首页链接为”index.html”,用CSS编写导航条样式:导航条为水平排列布局;设置导航 条层每个超级链接的背景图片为nav.jpeg;鼠标悬停在超级链 接上时背景图片为 nav_hover.jpeg。
6. 在contents层内部再嵌套3个子层,分别为con_left,con_right_top, con_right_bottom,布 局这三个子层于合适位置和添加相关文字和图片的内容。
7. 制作脚注区。
4、设计中还存在的问题及如何处理。
1,一些工具和专业术语未清楚。
2,代码还需百度之后才能明白,一些代码其具体含义不理解。
3,图片大小不能满足排版需求。
5、设计总结及心得体会。
做这个网页虽然花了很多时间和精力,但最终能够做成这样已经很开心了。过程中了解了制作一个规范的静态网页基本方法,学会了简单的分析一个网页的制作思路和排版布局。相对于以前的认识,已近有了一定的改变。
最后想说一句:这门课学的很累但很有意义。