网页制作课程设计报告旅游与交通Word格式.docx

网页制作课程设计报告旅游与交通Word格式.docx

《网页制作课程设计报告旅游与交通Word格式.docx》由会员分享，可在线阅读，更多相关《网页制作课程设计报告旅游与交通Word格式.docx（11页珍藏版）》请在冰豆网上搜索。

第十七周2013.6.24~2013.6.28

第一章需求分析

人类社会已经跨入了新世纪，正在进入信息时代。

如今的电子信息产业正在经受着一个巨大的挑战，同时也面临着一个重大的机遇。

就目前的科技发展水平而言，电子信息产业的发展已经不能够满足社会化大生产的要求，因此，各个国家集中人力、财力加大对信息技术产业的投入，加速发展信息产业，大力推进信息化。

以适应目前需要。

现在信息技术的应用越来越普及，不但促进了社会的高速发展，也改变着人们的工作、学习、生活和娱乐的方式以及思想观念。

尤其重要的是在这几十年的发展中我们有了互联网。

互联网加大了我们了解世界的眼界，缩紧了人与人之间的距离，这就更容易的使我们走上信息化的道路。

然后通过对网页设计中的审美需求和其各种视觉构成要素（文字、图片、颜色等）进行分析,结合人们在流览信息时的视觉习惯,探讨了网页视觉信息如何更有效、更为合理的表现与传达。

以往，人们不经常出去旅游，现在生活水平提高了，生活也更加轻松和更加充实了，人们一有时间就去旅游。

我个人认为在河南最佳的旅游景点莫过于洛阳，洛阳六朝古都，有深厚的历史，优秀的文化，诱人的美食，通过对洛阳特色做这个网页目的就是让大家了解洛阳，让洛阳的美充分展示给大家，有机会去旅游的时候也可以作为借鉴。

第二章网站制作

2.1网页制作步骤

做网页之前我制定了以下五个步骤：

一、确定网站主题：

网站主题就是要建立的网站所要包含的主要内容，一个网站必须要有一个明确的主题。

我们的主题就是洛阳旅游与交通。

二、搜集材料：

明确了网站的主题以后，围绕主题开始搜集材料了。

材料大部分是从互联网上搜集，部分是去图书馆搜集的，然后把搜集的材料去粗取精，找到最符合我们心意的，有些在网上搜到的图片的尺寸或大小不合心意，我们还需要借助一些其他的工具进行改进，比如使用截图工具，photoshop软件等。

三、规划网站：

一个网站设计得成功与否，很大程度上决定于设计者的规划水平，网站规划包含的内容很多，如网站的结构、网站的风格、颜色搭配、版面布局、文字图片的运用等，你只有在制作网页之前把这些方面都考虑到了，才能在制作时驾轻就熟，胸有成竹。

也只有如此制作出来的网页才能有个性、有特色，具有吸引力。

四、选择合适的制作工具：

尽管选择什么样的工具并不会影响你设计网页的好坏，但是一款功能强大、使用简单的软件往往可以起到事半功倍的效果。

五、制作网页：

材料工具选好之后，下面就需要按照规划一步步地把自己的想法变成现实了，这是一个复杂而细致的过程，一定要按照先大后小、先整体后局部的步骤来进行制作。

下面是我制作整体的规划图：

网站总体设计图2-1-1

2.2网页设计要求

2.2.1风格定位

主页的美化首先要考虑风格的定位。

任何主页都要根据主题的内容决定其风格与形式，因为只有形式与内容的完美统一，才能达到理想的效果。

主页风格的形成主要依赖于主页的版式设计，依赖于页面的色调处理，还有图片与文字的组合形式等。

这些问题看似简单，但往往需要主页的设计和制作者具有一定的美术素质和修养。

使网页看起来具有特色。

2.2.2版面编排与设计

一个好的网页，首先要有一个漂亮的主页，给人良好的第一印象，所以要精心设计自己网页的这一“门面”。

主页的设计首先涉及到的是页面的版面编排问题（一般有表格、框架、样式表等）。

主页作为一种版面，既有文字，又有图片。

图片和文字都需要同时展示给观众，不能简单地罗列在一个页面上，因此必须根据内容的需要，将这些图片和文字按照一定的次序进行合理的编排和布局，使它们组成一个有机的整体。

1、主次分明，中心突出。

在一个页面上，必然考虑视觉的中心，这个中心一般在屏幕的中央，或者在中间偏上的部位。

因此，一些重要的文章和图片一般可以安排在这个部位，在视觉中心以外的地方就可以安排那些稍微次要的内容，这样在页面上就突出了重点，做到了主次有别。

　2、大小搭配，相互呼应。

较长的文章或标题，不要编排在一起，要有一定的距离，同样，较短的文章，也不能编排在一起。

对待图片的安排也是这样，要互相错开，这样可以使页面错落有致。

　3、图文并茂，相得益彰。

可以选择一幅适合表现主题的好图片作为主页背景，以增强吸引力。

文字和图片具有一种相互补充的视觉关系，因此，将文字与图片的密切配合，互为衬托，既能活跃页面，又使主页有丰富的内容。

2.2.3内容添加

对收集到的素材进行分类整理，并由此设置子网页栏目，一般不宜过多。

将各类素材分别放入或链接到相应网页中。

对于网上素材的使用，采取下面两种做法：

1、对于重点素材，一般用复制、下载的方法放入自己的网页中，如自己各子网页的文字、图片等中心内容。

2、对于相关的次要素材，尤其是内容丰富而繁杂的，用超链接的方法将整个网页链接到自己的网页中，但不宜过多；

还可以设置为整个网站的友情链接。

2.2.4色彩的设计

网页设计的成败，在很大程度上取决于色彩运用的优劣。

浏览者在浏览网页时,留下的第一印象就是页面的色彩设计,它的好坏直接影响阅读者的观赏兴趣。

因此,色彩设计在网页设计中居于十分重要的地位。

网页的色彩设计应把握以下几个方面:

首先是整个页面的色彩选择,确定一个主色调,可以有利于体现网站主题。

其他一些次要内容,如背景图片、线条适宜采用不抢眼的颜色,以免喧宾夺主。

只有少量精心选择的元素,为了突出强调的需要,才采用明亮的色彩,这些彩色亮点就会产生强烈的视觉冲击,但如果用得太多了,就会造成混乱的感觉,而达不到强调的效果。

其次,在背景的色调搭配上一定要注意不能有强烈的对比,特别是同时使用色彩对立的颜色。

主页的色彩处理得好，可以达到事半功倍的效果。

色彩总的应用原则是主页的整体色彩效果应该是和谐的，只有局部的、小范围的地方可以有一些强烈色彩的对比。

几种配色方案：

1、暖色调。

即红色、橙色、黄色等色彩的搭配。

这种色调的运用，可使主页呈现温馨、和煦、热情的氛围。

　　2、冷色调。

即青色、绿色、紫色等色彩的搭配。

这种色调的运用，可使主页呈现宁静、清凉、高雅的氛围。

　　3、对比色调。

即把色性完全相反的色彩搭配在同一个空间里。

例如：

红与绿、黄与紫、橙与蓝等。

这种色彩的搭配，可以产生强烈的视觉效果，给人亮丽、鲜艳的感觉。

当然，对比色调如果用得不好，会适得其反，产生俗气、刺眼的不良效果。

因此，总体的色调应该是统一和谐的，局部的地方可以有一些小的强烈对比。

第三章功能模块分析及设计

3.1网页主页面模块

图3-1-1

该功能模块为网页的主要模块，在整个设计中起主线作用，以后的各个子模块都是对这个模块中的内容的详细介绍，这个模块主要用表格布局，色彩以绿色调为主，给你人以明了的感觉，并且该模块中还插入了很多flash动画，给静态的页面以动感，并且插有背景音乐，内容相当丰富。

3.2景区展示模块

图3-2-1

该功能模块详细的介绍了洛阳古墓博物馆景区的基本信息和情况，由于该页面展示的内容比较长，运用了锚点，从而使读者更快的看到自己想要了解的那部分内容，该页面也是用表格布局，页面头部使用了鼠标经过图像，标题文字采用了走马灯效果，图片加入了行为效果，另外还给页面加入了友情链接。

图3-2-2

该功能模块的内容比较多，但本身做的比较简单，该模块包括对洛阳历史文化传说的描述以及旅游路线，民族风情等。

图3-2-3

该功能模块详细的介绍了洛阳龙门石窟景区的基本信息和情况，用不同的页面展示每个信息的内容，每个页面也是用表格布局，色调与主页面的色调相类似，采用图和文字相结合的排版形式和flash动画。

图3-2-4

该功能模块主要介绍了龙门海洋馆的基本情况，该页面使用表格布局，色调与主页面的色调形成了一个鲜明对比，给人以视觉上的冲击，添加了flash动画采用图和文字相结合的排版形式。

3.3其它信息模块

图3-3-1

该功能模块主要介绍了洛阳宣传片的基本情况，该页面使用表格布局，主要加入了视频,从视觉上给人以亲切感。

图3-3-2

该功能模块主要介绍国家牡丹园的信息，本身做的比较简单，主要用表格制作，运用了flash动画和图文混排以及鼠标经过图像等。

第四章系统介绍及软件使用

4.1软件介绍

dreamwraver软件由美国著名的网站应用开发工具生产厂商AdobeMacromedia于2005年6月推出并正式投入市场以来，已经发展得相当成熟。

关于dreamwraver的技术介绍的相关信息相当丰富。

4.2软件运行环境

Dreamweaver是一款简体中文软件，可以在Win2003中安全运行4.3系统介绍（截图）

图3-4-1

第五章网页负责内容及使用工具

5.1制作内容及要点

我主要负责的是“龙门石窟”“白云山”“古墓博物馆”“龙门海洋馆”“国家牡丹园”“栾川老君山”“洛阳年鉴”这七块及首页的制作。

5.2基本工具使用

DreamweaverCS5、，AdobePhotoshopCS4，可以运用DreamweaverCS5进行flash电子相册的制作，用DreamweaverCS4进行页面布局、页面CSS编码编辑、排版、设计等功能，可以利用PhotoshopCS4制作图片和对图片进行修改！

第六章设计总结

做完这个网站,让我真正的认识到一个成功的网站，先期的准备工作是很重要的，好的开始等于成功的一半。

选择这个环保网站的建设的样式后，就要为目标而努力了。

熟练掌握网页设计和图形处理的技巧是必须的，但经验是在实战中获得的，我们虽然刚开始学也不必因此而畏惧退缩，多多练习才会有提高。

网站建设最重要的莫过于两个问题：

设计和内容，素材的准备.

1、设计的要求：

第一、导航清晰，布局合理，层次分明，页面的链接层次不要太深，尽量让人第一眼看清网站的大体.

　　第二、色彩和谐、重点突出：

在网页设计中，根据和谐、均衡和重点突出的原则，将不同的色彩进行组合、搭配来构成美观的页面.

　　第三、界面清爽：

要吸引访问者长时间的停留在的网站，千万不能让用户第一眼就感觉压抑。

大量的文字内容要使用舒服的背景色，这样访问者浏览时眼睛才不致疲劳。

　　第四、动态效果不宜太多：

适当的动态效果可以起到画龙点睛的作用，过多的动态效果会让人眼花缭乱而抓不住主题。

2.加深了网站设计的技术熟悉

这次对网站的设计让我对各种网站设计的技术和网站设计中应注意的问题以及网站设计中所运用的工具更加的了解与熟练.

第七章参考文献

[1]文杰书院编，DreamweaverCS5网页设计与制作基础教程，北京：

清华大学出版社；

2005,23（6）:

216-258

[2]吴涛主编，网站全程设计技术（修订本），北京：

2002,34

（2）:

144-237

[3]任学文、范严编,网页设计与制作，中国科学技术出版社2003,34（3）:

233-237

[4]吴黎兵、罗云芳编，网页设计教程，武汉大学出版社2008,22（5）:

211-243

[5]庄王健编，网页设计三剑客白金教程，电子工业出版社2001,45

（2）:

251-287