九寨沟旅游网站的设计报告

九寨沟旅游网站的设计报告

一、介绍

超链接是网页中最活泼、最有吸引力的一种元素。表单用于特殊的信息，使用户和网站进行交互，使你找到用户的详细信息。表格在许多工作中有着广泛的应用。框架网页是一种特殊的HTML网页，使用框架网页可以同时浏览几个不同的Web页面，使用Web页面显示一致的用户界面和灵活的页面内容。网页制作的高级技术包括：在网页中插入FLASH动画，JavaScript制作网页的动态效果。网页中使用插件，以及创建、发布和管理站点等技术。Web页面往往是具有各种各样的页面元素、丰富的内容和复杂的布局。因此仅仅使用到一种或者两种网页制作技术，不可能创作出一个优秀的Web页面，一个美观而实用的Web页面往往需要综合利用各种技术。

二、概述

1. 网站名称：“九寨沟旅游网站”

2. 步骤：

(1) 确立主题

(2) 收集资料

(3) 创建网站

(4) 编辑网页

(5) 美化网页

三、目的

运用已经掌握的知识完成一个网站。通过此次设计可以达到全面

理解、运用网页制作的知识，并使之得以融会贯通，在掌握运用Dreamweaver制作网页的基础上再加以实践，进一步提高、加强自身的综合能力。

四、要求

有整体框架结构，表格定位等，布局合理，色彩搭配协调统一，内容丰富多彩，页面风格独特。

五、设计工具

Dreamweaver、Flash、fireworks、Photoshop等。

六、站点构思

1.整体构思：

本网站主题为：九寨沟旅游景点。总共有网页22个。主页是一个总目录的网页，里面加有网页动画效果“滚动字幕”及Flash动画，本站几个主要分网页分别为：网站首页、九寨文化、景点聚焦、精品旅游、版权声明、联系方式。还有许多子网页。

2

3、页面构思

下面介绍一下网站中的几个网页的制作。

九寨文化中的九寨简介页面，背景色采用跟主页一样的白色，白色的背景可以给人朴实、淡雅、干净的感觉，无疑是最好的选择，与环保网站的主旨相一致。上方为Flash动画与链接页，左下方是用Photoshop处理过的图片，与主页是一致的。右边的标题是用Photoshop制作的图片，这样制作丰富了页面内容，使整个页面条理清晰。最后的“相关传说”标题，即可以链接到九寨简介页面。

景点聚焦页面，背景色与Flash动画，链接页与主页保持一致。这一页的主要内容是用表格形式来固定的，边框设置为1，颜色为蓝色。表格宽度与Flash宽度一致。整个页面清晰有致，比较大方，浏览者可以清楚的看到九寨沟所有有名景点。

联系方式页面，左下方的图片与右边的标题都是用Photoshop制作的，在联系方式中还添加了一个outlook express电子邮件，方便用户与公司的联系，用户可以直接点击给公司发送邮件。outlook express作为全球范围内的联机通讯软件，已经被越来越多的人所接受，无论是与同事和朋友交换电子邮件，还是加入新闻组进行思想与信息的交流，Outlook Express都已成为不可或缺的助手。所有页面整齐划一，设计风格保持一致，加上白色的背景，给人朴实、淡雅、干净、简洁、明了、大方的感觉。

六、所用各技术的特点

1.Dreamweaver : Dreamweaver是美国MACROMEDIA公司开发的集网

页制作和管理网站于一身的网页编辑器，它是第一套针对专业网页设计师特别发展的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。Dreamweaver是当前主流的站点和网页编辑器，其代码简洁、兼容性和整体功能都很强。Dreamweaver的介入，使得网页一些部分的实现变得更加直观简便。

Dreamweaver的主要特点：最佳的制作效率、网站管理、无可比拟的控制能力、所供即所得、可以制作模版、全方位的呈现

2.FlashMX: Macromedia公司出品的Flash是制作网页动画的利器。F1ash是网络多媒体制作工具而不是网页编辑工具。F1ash是制作动感网页的权威。对于使用者来说，只需很短时间的学习，就可以用它制作出美观的网页动画。可以让制作者随心所欲地实现各种创意，并且可以和JavaScript一起创作出具有强大交互性的网页动画。

Flash是一种绘制矢量图形和创作互动多媒体动画的软件。它可以用少量的矢量数据就可以描述相当复杂的对象，所以生成的文件尺寸小，便于在网上传输。Flash创建的动画集可以插入到html文档中，也可以单独制作网页。使网页的效果更加完美。

七、网页制作的优缺点

比较明确，风格统一。并运用了一些其它的设计软件加以辅助设计。使网页更加具有动感，形式丰富。就内容而言，比较丰富。大量运用了图片，并进行了文字说明，做到了图文并茂。但是由于我们刚接触网页制作，做出的效果还是有些稚嫩的，需要以后不断的实践。

八、部分源代码

首页源代码