网页课程设计网站报告剖析.docVIP

《网站设计与网页制造》设计说明书 ???????????????????课程名称???????????????????设计题目：我的家乡 ???????????????????院系??????????????????专业班级：xxxxxxxx ??????????????????学生姓名：xxx ??????????????????学号：200913190 ??????????????????指导教师:xxx 起止日期：xxxxxxxxxx 第 1 页 共 13 页 我的家乡网页制作过程 网站开发目的和功能简介? ???????随着网络技术的发展与互联网的普及，网站建设与网页制作越来越成为各行各业以及个人宣传自己的有利工具，、网站在当今时代被越来越多的人用来宣传，通过网站的制作可以让老师、同学以及朋友更好的了解自己以及别人想要知道的事情，我现在做的是关于我的家乡，为别人提供了一个更深入了解自己的一个平台，本网站主要功能是让更多的人去了解我了解我的家乡 网站的设计 2.1 网站的名称：我的家乡 2.2 网站栏目划分 ????????根据本网站的内容和功能划分为：我的心语、导航链接、各地方的简介、体现家乡的图片、版权声明等。 （1）我的心语——对我们宿舍的六个简介，提示对照网站的主题体现我们的家乡；（2）导航链接——链接到各自设置的网页各自的家乡；（3）各地方的简介——简单介绍了我们各自的家乡，了解了家乡的知识文化；（4）图片——列举了每个地方的代表图片，用另一种方式展现出不同的风采；（5）版权声明——声明了网站的建设者 具体如图所示: 2.3网站导航应用于所有页面提高网站的操作友好性。 2.4网站的风格与色彩选择：页面以浅绿和浅黄色为主。浅绿色体现了活力，字体实用浅棕色和淡淡的灰色给人一种清析、稳重的感觉。所有页面色调统一，布局相似。 2.5网站目录结构设计合理：不同素材采用不同学文件夹分开存放。如图片放在image 文件夹、flash放在flash文件夹内、完成作业放在以自己名字命名的文件夹内等 聊城首页的制作过程 3.1首页版图： 首页、导航链接、内容、个网页链接 3-1 整个页面分为四部分，第一部分是以一个flash文件显示动态的图片，主要是网站的突出显示；第二部分是导航栏；第三部分是详细内容，其中网页的文字排得整齐紧凑，这样能给人一种舒服的感觉。在网页适当的地方加一些图片，每张画面再加一些不同的文字说明网页显得更加的精美 3-2 3.2制作过程：：本网页制作分为三个部分：顶部是用flash制作的页头。中部又分为左右两个部分，左边为家乡简单的介绍和链接，制作的动态图片使用时间轴让图片自动播放，还有从顶部滑下的图片自动循环播放；右边为家乡的各景点的见解。我还为网页设置了背景图片，在最后利用spry选项卡添加的图片。 四、聊城首页制作过程 4.1新建一个页面，命名为聊城首页（index） 4.2在页面属性的外观中设置四边边距为0，文本颜色设为：#9900CC，大小设为18像素；在链接中设置下划线样式为：有下划线；链接颜色为：#0000FF。 4.3（1）首页（index）制作 利用样式定义各个部分的高宽，将./image/195911NM-10.gif设为背景图片。页头图片为水城明珠.jpg设置flash动画为左右橘色.swf代码如下： 页头图片的设计代码：（图如上3-2） div id=Layer3 style=left: 30px; top: 34px; width: 186px; height: 175px;span class=STYLE3a href=liaocheng.htmlimg src=../image/201042717165.jpg name=Image1 width=186 height=174 //a/span/div a name=dingbu id=dingbu/a table width=967 height=817 border=1 align=center bordercolor=#000000 tr td height=190 colspan=2 valign=top bgcolor=#FFFFFFimg src=../image/水城明珠.jpg width=956 height=202 //td /tr Flash动画设置代码如下： div id=Layer2 script type=text/javascript AC_FL_RunContent( codebase,/pub/shockwave/cabs/flash/swflash.cab#version=7,