许嵩网站设计报告.docVIP

班级 化学教育 学号 姓名 作品完成时间：2012年5月22日 许嵩网站规划与设计 背景 网站标题：许嵩 设计目的：让更多的喜欢许嵩的人能从该网站中了解许嵩，知道许嵩的相关信息，比如他的基本资料、主要专辑、好听歌曲、或好看图片等。 使用者：喜欢许嵩的人 网站结构、功能及链接 1、该网站包含三张网页，分别是千百度.htm，相册.html。 2、该网站主要展示的信息：许嵩的基本资料、主要专辑、好听歌曲、或好看图片，导航栏包括简介，歌曲，相册，等。 三、网页设计及其创意性介绍： （一）、利用photoshop软件设计一张图片作为网页的主要模版 1、打开photoshop软件界面如下： 新建文件，弹出对话框如下： 设置文件宽度939、高度1374，按确定按钮。 利用左边的工具栏的矩形、文字等工具绘制出设计图如下： 以Jpg格式保存文件。 （二）、在Fireworks中切片 将制作好的设计图在Fireworks中进行切片，以便导入Dreamweaver中制作为网页。具体操作如下： 启动Fireworks，打开已经设计好的图片。 从视图中选择标尺，从标尺中拉出参考线（由于本设计图较简单，可以不做这步）。 利用工具栏中的切片工具，对设计图进行切片，如下： 4、选择文件菜单中的导出，设置导出为HTML和图像。并将它们放入一个新建的文件夹中。 （三）、在Dreamweaver中生成网页 启动Dreamweaver，打开之前切片所生成的网页文件。将文件中的矩形图片依次删除。 设置页面属性，背景颜色为淡绿色。 在相应的区域插入图像，编辑文字。如图： 在该网页的最下边的区域插入flash动画： 选择菜单栏中的插入/媒体（M)/flash(F),选择文件中的已做好的动画。插入即可。在Dreamweaver中显示如下： （四）、插入flash元素 打开flash软件，新建flash文档， 利用左边工具栏的矩形工具，选择填充颜色为黑色，画出一个矩形如图： 再双击矩形工具，弹出矩形设置对话框： 设置矩形边角半径为5点，点击确定。在黑色矩形中画出小矩形如图： 在用变形工具，选择扭曲变形，对上图进行变形处理，处理后如下： 选择文件/导入/导入到库，将准备好的图片导入到库以备用。新建图层，将库中的图片拖入相应的图层，每层一张图片。并对每一图层的时间轴做处理： 选择文件/导出/导出影片，保存为影片_场景 1.swf。 课程学习不足： 网页制作的很粗糙，功能也不多，结构相对较简单。 对导航的制作不理解，只能做简单的链接。 还有很多都不知道怎么做，需要更多的练习和学习。