兰州财经大学陇桥学院
信息工程系课程设计报告
课程名称动态网页设计与实现
设计题目家乡情
系别信息工程系
专业方向电子商务
年级、班2014级1班
学生学号
2016年12月30
f青春Happyi
g
一、网站设计的背景
青春很短暂却很美好。我们的青春里包含了太多美好的东西。有亲情那是我们青春开始的地方。有友情那是我们青春里最宝贵的东西。有爱情有我们青春有我们最珍贵的东西。网页从我们的青春开始设计让浏览者可以清晰的认识我们的青春。
二、网站分析与设计
一网站功能及要求
1借助网站的媒体支持能力为我们青春的各个人物、事情做了最直观的表达达到宣传效果。
2本网站定位于展示型静态网站重点是让人们可以更主观的了解我们的青春都包含什么除却主页其他五个页面都分别展示了亲情友情爱情珍贵回忆以及我们的青春不散场等方面。方便浏览者浏览期间有大量的图片还有触动人心的故事让浏览者浏览过后可以对网站留下深刻的影响。
二网站模块结构设计
通过对青春各个方面的分析为了让浏览者更简洁的看到效果我对每一个网页的导航做了简化处理每一个网页的导航都相当简洁。在设计方
f面主页的设计相当简单由浅入深可以很好的吸引浏览者浏览。采用图片文字相结合的方法使其网页更具吸引性。主调偏暖使人们在了解青春的时候可以敢到快乐这正是我们的网页所要达到的目的。其中整个网站的页面包括如图1所示的模块
图1模块划分
三、网站的设计与实现
一素材的准备
1、做网站准备素材是最重要的一环不仅要收集许多内容各异的文字图片还要设计各种网站的排版格式与美工。
2、网站的布局是我从网上下载的一些框架都是现成的但是其中涉及的图片文字是自己找并且在PS上自己修改的关于文字部分很多的内容是自己写的关于英文部分有的是从网上翻译过来的保证了其正
f确性。
二网页设计
更简洁的看到青春里对我们重要的人和事
浏览者通常对不同的网站的风格要求是不同的。我们的网站主题是青春Happyi
g所以我采用暖色调的底色图片也都是积极向上的。使我们的网站做到“快乐”。
三制作中所需要的技术
1Photoshop
2Dreamweaver
3文本
4图片展示
5超链接链接方法
四、网站测试
通过web浏览器测试网站网页是否显示。本网站适合在火狐、360浏览器浏览不适合在IE浏览器进行浏览
将做好的六个页面中的代码分别放入Dreamweaver中点击F12按钮选择火狐或360浏览器。如图4所示
图2测试按钮
f一首页
代码
DOCTYPEhtml
htmlla
g