网页设计说明设计书

《网页设计说明设计书》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、《计算机网页设计》大作《保护我们的水资源》网页设计说明设计书班级：姓名：学号：电话我的作品命名为《保护我们的水资源》。主要是想要表达我们要保护好我们家园的水资源这个主题。我的网站共分为四个栏目，分别为“主页”，主要想表现出水资源危机对我们的警示；“我们与水”，表现我们可以适当的利用水资源而又不破坏水资源；“水的悲剧”表现现在水资源受到严重的破坏；而“我们的祝福”，希望人们能真正行动起来，保护我们的水资源。网页设计的主要步骤为：设想好整个轮廓，用photoshop进行图片处理，勾勒出整体画面。再用dreamweaver设计并完成网页结构。

2、最后用flash制作出比较动态的网页效果。下面是用photoshop设计的最终效果一、网页效果图制作（一）主要图层结构背景中间的矩形框架效果采用添加图层样式的“混合选项-投影-内阴影”，其中六个点的相同小水珠利用椭圆工具+滤镜+混合选项+渐变+图层的复制来完成。标题文字部分用两个层，利用删除文字栅栏，线性渐变，文字样式，自由变换，不透明度等效果做出来，标题上的水龙头利用ps的魔棒工具勾出后添加一个图层和文字部分共同组成标题。菜单主要有四个菜单按钮，主页菜单按钮不同于其他三个菜单按钮，稍后将有具体介绍。菜单文字“主页”、“我们与水”、“水

3、的悲剧”和“我们的祝福”，采用的文字样式为幼圆，蓝色的。主体三个图层：一个图层，导入ps好的图片并修改，并另加一图层，利用文本工具添上文本“世界上最后一滴水将会是谁的泪水”，其文字变形样式为“鱼眼”，另有一图层卷页效果“新建图层——矩形选框工具——渐变填充——自由变换——右击该矩形——透视——旋转”（一）主要步骤讲按钮的制作过程。“主页”按钮的做法：新建一个图层，用选框工具画一个椭圆，点击菜单“滤镜→扭曲→球面化”对新的图层进行处理，数量设置为60%--在新图层上点击右键，选择“混合选项”。使用“投影”样式，设置不透明度为75%、角度为

4、30°、距离1像素、扩展0%，大小为1像素。再使用“内阴影”样式，设置不透明度为95%、角度为30°、距离为1像素、阻塞0%，大小2像素。设置完成后，点击“好”，回到新图层。为了让水珠更加逼真，对水珠做光照产生的反光处理。用椭圆选框工具在水珠上半部分选择一扁小的椭圆区域，并用渐变工具进行从上到下的填充，颜色变化透明为到蓝色。再在水珠下半部分同样选择一扁小的椭圆区域，用相同的渐变色对其进行由下至上的填充。其他三个按钮的制作步骤：在原来的基础上建立一个新图层，添加辅助线确定按钮的位置和大小，选择矩形选框，圆角半径为5，选择矩形的路径选项，绘

5、制按钮选区，单击面板上的路径选项，在弹出的建立选区对话框中羽化半径为0，单击前景色，在拾色面板上吸取浅蓝色，点击背景色，吸取蓝色，点击渐变工具，调节好渐变颜色后用于填充选择的按钮图形。在图层样式的混合选项中调节描边和投影效果。其他两个按钮可以复制前一个的按钮来完成，只需要分别对他们进行颜色和效果设置修改即可（图像—调整——色相∕饱和度可改变或调节颜色）二、网页制作（一）站点文件名称描述1.images文件夹，用地存放网站所需的图片文件2.Wendang也是文件夹，用地存放网站所需的图片文件3.index.html网站首页，框架包含一张有

6、图片“主页_03”4.weandwater.html框架里有一张图片“43500ZPPHZF3144”，表现我们和水和谐共处页5.watertragedy.html水的污染和破坏页6.ourhope.html留言希望页（二）主要步骤留言板的制作：双击“ourhope.html”进入该编辑页面，点击主题框，插入2行1列表格，在表格对话框，表格宽度为100百分比，其它设置为0，在表格第一行写入文本“留言吧”，字体设为“段落2”，该单元格背景色设为青色，在第二行中写入文本“发表留言”，按回车，插入3行2列表格，单元格间距为1，单元格边距为5，

7、边框为0，单击第插入元格，设置其表格宽为30%，选择最新插入的表格，用淡蓝色填充，选择自己喜欢的颜色进行填充，合并最近一次插入的表格的第一行，写入文本“既然来了，就留下脚印吧”，单击第二行表格的第二列，点击“插入——表单——文本框”在弹出的对话框确定，在弹出一个是“否添加表单标签“对话框中选择“否”，单击第三行表格的第二列，点击“插入——表单——文本框域”，在弹出的对话框确定，再弹出一个是“否添加表单标签“对话框中选择“否”，设置该文本框属性即可。Dreamweaver的效果图如下：三、Flash制作（一）库结构名称类型描述1．按钮文件

8、夹“主页”，“水的悲剧”，“我们和水”，“我们的祝福”等4个按钮及其相关的图形放在此文件里。2．背景文件夹含有几张背景图片，背景音乐及“背景阴影”影片剪辑3．基本图形文件夹制作其它元件时用到的公共元件都放在