网页设计与网站管理课程设计实验报告240894128 林嘉强.docx
《网页设计与网站管理课程设计实验报告240894128 林嘉强.docx》由会员分享，可在线阅读，更多相关《网页设计与网站管理课程设计实验报告240894128 林嘉强.docx（19页珍藏版）》请在冰点文库上搜索。
网页设计与网站管理课程设计实验报告240894128林嘉强
网页设计与网站管理
课程设计实验报告
班级:
08级市场营销
（1）班
姓名:
林嘉强
学号:
240894128
目录
一、建站主体介绍1
二、网站设计需求分析1
1、网站的内容简介1
2、网站建站的目的2
3、网站的主要浏览者2
三、网站风格和基调确定2
1、页面的风格2
2、页面的布局2
3、页面的色彩2
4、页面其他设计3
四：
网站目录结构3
五、网站栏目逻辑结构说明4
六、网站功能制作过程具体说明4
七：
网站功能具体说明9
1、首页（html）9
2、副页：
绿瀑落川（html1）10
3、副页：
悠然天鹅湖（html2）11
4、副页：
森林古区（html3）12
5、副页：
其他旅游点（html4）13
6、子页：
古东的旅游线路（html5）14
7、子页：
古东天然美食（html6）15
8、子页：
我的旅游日志（html7）16
9、子页：
相关获奖讯息（html8）17
八、心得体会18
一、建站主体介绍
网站名称：
古东风景区
通过DreamweaverCS4这款软件，设计一个简单、美观、符合实际的网页页面，页面内容具备网页经常可以看到的功能，因此在页面及其功能上应按一个正规网站来设计。
本次设计主要以采用表格为主，Ap-div为辅对页面进行排版。
通过PhotoshopCS4这款软件，简单处理一些图片，使得所需图片更加美观，更加适合网站设计。
PhotoshopCS4提升了编辑图像的速度，改善了图像的画质效果，使得在处理图像时更为轻松便捷。
本次设计所用的工具：
DreamweaverCS4、PhotoshopCS4。
二、网站设计需求分析
1、网站的内容简介：
古东风景区，位于灵川县大圩古镇南，桂林至冠岩旅游公路8公里处，距桂林市26公里。
景区融合了桂林山水原始自然风光之精华及独特的互动体验式旅游新概念。
为国土资源部常年定点的奇特地质地貌观测点，自治区生态环保基地。
群山环绕当中的漓江·古东景区是一处真正的世外桃源，也是桂林这颗国际旅游明珠之中的最新亮点和热点，古东景区是将生态旅游和体验旅游融进自然山水的特色景区。
整个游程中通过各种互动参与让您全身心感受，触摸自然，让人不知不觉中心旷神怡，尘心尽释。
古东风景区，有众多景点，主要的景点有三个，分别是绿瀑落川，悠然天鹅湖，和森林古区，其他的旅游景点还包括大大小小的溪流泉水，和高山以及其他的自然景观。
2、古东风景区网站建站的目的：
①以精美的画面向旅游者展示景区每个景点的大概信息。
②通过建设网站宣传景区，提高知名度，吸引更多的旅游观光者来。
③对旅游观光者提供旅游帮助住宿交通等信息。
④为旅游景点的饮食相关住宿企业提供平台，让他们发布信息，寻求到更多消费者。
3、网站的主要浏览者：
主要准备来到景区的旅游观光者，普通百姓，景区的饮食、住宿等企业者，合作伙伴，以及同行。
三、网站风格和基调确定
1、页面的风格
古东风景区的网站页面主要是是简洁、严谨，色彩层次分明，主要是以浅蓝，绿色以及古铜色为主色调。
展示景区的页面以图片为主，图片和文字间隔分明，文字和图片展示都比较集中，但关联紧密，使浏览者可以明确精准的找到自己想要搜索和寻找的信息。
信息类内容则以基本的文字描述为主，风格简单，旅游方面的交通住宿资讯，个人博客等，基本的文字描述精致简单，通过段落排版，把文章恰当的分成若干部分，让浏览者感觉不到阅读的疲劳，而容易找到自己所需要的信息。
2、页面的布局
网站主要是以图片为主附加文字表述，图片处理很精致细腻，与区域的划分区块大小搭配很合理恰当，一般以表格排列的方式整齐排列，没有页面中与区块错落混排的情况。
使用文字的位置摆放也很有讲究，标题栏空间较大，信息类为主的网页即使插入图片，也要图片和文字说明的内容分开，使文字说明的作用更突出。
3、页面的色彩
页面的色彩主要以自然颜色为主，分别是以浅蓝，淡绿，以及淡黄和古铜色为主。
通过颜色的对比反衬，来衬托出整体的协调性与美观性。
4、页面其他设计
古东风景区网站在设计上，每个页面的最外层边框留有空隙，突出了页面的层次感。
添加了并列图片和滚动图片，增加了吸引力，让浏览者对此网站更有兴趣。
同时网站的广告宣传几乎没有，使得用户能更快找到所要信息。
同时布局紧凑，文字简洁，使得页面执行速度快。
四：
网站目录结构
五、网站栏目逻辑结构说明
文件夹：
共有四个文件夹。
其他相关图主要是森林古区，其他旅游点两个副页的图片存放文件夹（image）。
天鹅湖，绿瀑落川两个文件文件夹分别是两个重要景点的图片介绍栏目的存放以及相关页面（imnageintrouduce）
瀑布是首页的图片介绍栏目以及相关页面存放（imnageintrouduce）。
六、网站功能制作过程具体说明
1、成品展示：
如图
2、网页的制作过程
（1）建立站点：
打开Dreamweaver，选择“站点>新建站点”命令，将站点定义在保存网页的位置，准备开始页面的制作。
（2）在页面插入表格，进行大概布局。
（3）进行导航栏编辑，插入文字图片进行编辑，插入背景图片等。
（4）插入一行一列的表格，并在表格中插入图片进行动态处理，分别插入图片，进行图片修改对齐，再导入代码。
<中间是图片的来自路径，以及图片大小修改>
（5）再分别插入表格，对第二层栏目进行编辑，进行文字处理。
（6）页面内容进行编辑。
图文并茂，插入表格以规则排列，防止混排。
7、进行边框厚度位置修改，并建立副页超链接。
存档。
其他的子页基本按照以上操作方式。
七：
网站功能具体说明
1、首页（html）:
主要是提供导航功能，页面内容是对景区的大概介绍，提供地图对景区结构有一定了解。
一层栏目以重要景点，二层栏目为旅游指南，住宿交通信息等的链接。
让浏览者对网站布局大概了解，浏览速度快，能准确获得信息。
2、副页：
绿瀑落川（html1）。
景区的三个重要景点之一，提供景点的主要信息，对景点内可以观光和休闲的内容进行大概介绍，并且以图片作为展示说明。
让旅游者能获取他们对景点所需要的信息。
3、副页：
悠然天鹅湖（html2）景区的三个重要景点之一。
提供景点的主要信息，对景点内可以观光和休闲的内容进行大概介绍，并且以图片作为展示说明。
让旅游者能获取他们对景点所需要的信息。
4、副页：
森林古区（html3）景区的三个重要景点之一。
提供景点的主要信息，对景点内可以观光和休闲的内容进行大概介绍，并且以图片作为展示说明。
让旅游者能获取他们对景点所需要的信息。
5、副页：
其他旅游点（html4）主要是对景区内其他略微有名气的景点包括泉流溪水高山等进行简介，以图片的形式进行直观展示，让旅游者有个直接的了解。
6、子页：
古东的旅游线路（html5）.主要是提供在景区内的日程，以及服务，交通自费等信息，并附加景区区域内的线路图，让旅游者有直观了解，并能获得他们所要的旅游方式，一日游或者两日游等。
7、子页：
古东天然美食（html6）展示景区内的诱人美食，饮食文化，以图片的形式直观地展示给旅游者，并且引导旅游者去消费。
8、子页：
我的旅游日志（html7）。
主要是提供旅游者，或者优秀作者的旅游日志，为他们提供一个展示个人旅游感受想法的平台供其他人分享，并为景区宣传。
9、子页：
相关获奖讯息（html8）。
主要是刊登景区获奖的图片，以及罗列景区的一些获得的奖项，让旅游者对景区的景点的知名度有个了解。
八、心得体会
网页设计，几乎是自己边做边把兴趣培养起来的，虽然刚开始并没觉得这是好玩的东西，但是越做越能获得学习中的乐趣。
制作的过程是艰辛的，但是结合教材及老师的指导，通过自身的实践，终于制作了自己的第一份网页设计，即使还有很多不足，但是我仍然觉得有种成功感。
总的来说，我学会了很多知识，收获了很多
一、对网页的构架要有个宏观的构思。
刚开始，就是因为，没有构建好框架，表格几行几列都没想好就开始做了，以致于在制作中产生了不少的麻烦，甚至有的看起来没有一个整体美，这主要是没有经过周密的构思。
二、对其中的一些概念的理解，文字什么的都要统一，图片也要规范大小一致，网页设计师一个讲究整齐简介的页面。
所以在制作后，我知道制作要统一规范化。
三、对PS的简单应用，认识到PS对网页的重要性。
在本次的网页设计中，我不仅学到了网页设计方面的知识，也从对图像的编辑，美化等过程中，学到了一些关于ps的知识。
也尝试用Flash进行设计导航条，但由于运行环境限制，最终改用Spry菜单实现导航条设计，但也从中对Flash有了基本知识，这也使得我认识到要想有个美观引人注意的页面，就必须要充分掌握PS，让PS完善网页设计。
我以后将继续学习PS，提高PS的应用。
四、对代码的理解应用远远不够。
在对网页设计的过程中，对代码的知识了解过少，所以在设计时遇到了很多麻烦。
虽然在其中我也尝试应用了一些代码，但是仅仅是表面的简单操作。
要想做一个与别人不一样的网页，就必须要在代码上下功夫，同时代码也可以帮你找网页的不足错误。
所以今后要多学习代码知识，学会代码的运用。
在制作了之后，收获了很多，激发了我对网页设计的兴趣，我会用更多的时间去学习，去提高我的水平，让自己以后设计的网页更精美实用。
升级会员 