欢迎来到天天文库
浏览记录
ID:5709868
大小:1.93 MB
页数:21页
时间:2017-12-23
《网页设计综合实验报告格式》由会员上传分享,免费在线阅读,更多相关内容在行业资料-天天文库。
1、华北科技学院计算机学院综合性实验报告华北科技学院计算机学院综合性实验实验报告课程名称网页制作A实验学期2012至2013学年第一学期学生所在系部计算机学院年级2010级专业班级计科B103学生姓名韩海艳学号201007014331任课教师邵铁君实验成绩计算机学院制第20页华北科技学院计算机学院综合性实验报告《网页制作A》课程综合性实验报告开课实验室:信息楼基础六实验室2012年11月20日实验题目综合网站的规划、设计与制作一、实验目的云南旅游网站的规划、设计与制作二、设备与环境1、硬件:计算机2、软件:Dreamweaver、Flash、Fireworks三、实验内容
2、在本次的网页设计与制作中,我们组的主题是云南旅游的景点简介。云南作为一个少数民族聚居的特色省,有许多著名旅游景点,并且都展现出独具民族风情的文化风俗。因此,如果要将云南的各个景点详细的介绍给大家,在很短的时间里很难完成。所以,在这次的网页设计里,我们选取了四个比较吸引人的地方进行了介绍,由于时间与篇幅的原因,一些内容没有写入网页,同时也有许多方面缺乏考虑。1.网站规划1)网站目标我们组设计的云南旅游网站的目标是让想要去云南旅游的人们了解云南的一些著名的特色城市,也仅限于那些无暇查找关于云南旅游的详细资料的人。我们网站针对这些人,提供了四个适合休闲娱乐的景点,包括西双版
3、纳,香格里拉,大理和丽江,从而让他们快速的了解一些关于云南的信息。2)栏目设置①首页的设计由于云南景点很多,而我们只选取了四个景点进行了介绍,显然不能满足很多人的需求。我们在首页中对云南的旅游景点进行了一些概括,尽可能的让人们知道云南都有哪些旅游景点,与此同时,我们简单的介绍了云南这个省,并插入一段视频《印象云南》让人们更好的感受云南的民族风情。除此之外,附加了我们制作人的名字。用一个可折叠面板将这些内容组合起来,使网页看起来清晰明了,不至于杂乱。主页的设计在主页中,我们设计了一个flash动画实现对四个景点的选择,将其放在首页的右侧。点击第20页华北科技学院计算机学
4、院综合性实验报告四个小球,都会链接到相应的网页上。另外,在flash动画的左侧,添加了一首诗,从而使页面看起来更吸引人。对景点的介绍,用四个框架实现。景点的介绍是从三个方面进行的,分别是:该地的旅游景点,本地的风俗文化以及本地的美食。如果人们想要了解另外一个地方,可以通过网页左边的链接查找关于另外一个地方的信息。③站点目录结构:如右图所示网页的流程图:如下第20页华北科技学院计算机学院综合性实验报告2.设计1)链接的结构首先,打开这个网页,看到的是网站的首页,是一个对云南整体概括的一个页面,点击进入键后,进入对四个景点选择的网页,该网页供人们选择自己感兴趣的地方。只需
5、点击四个小泡泡即可进入自己喜欢的地方。图(1)图(2)现以进入丽江页面为例,在进入该地点的网页后,人们可经过选择顶部的按钮了解自己想要了解的信息,包括丽江的风景,文化,美食。如图(3)。第20页华北科技学院计算机学院综合性实验报告图(3)如果游客想了解到大理,西双版纳,香格里拉这三个地方的信息,可通过点击页面左侧的按钮链接到这三个网页;若想返回首页,点击左侧“返回”安按钮即可。如图(4)。图(4)(2)Logo等图标的设计网页中一共用到了四个图标,分别在四个地方的浏览页面中。图标中为该地的代表物或者是对该地的抽象化描述。例如:由于香格里拉被人们描述为“最接近天堂的地方
6、”,故其Logo用月亮和星星加以抽象画描述,如图(5),丽江的美可以洗涤人们的心灵,故将其描述为“让我丢失灵魂的地方”,并旁附丽江的市花菊花。如图(6)。与此类似,大理的图标和西双版纳的图标都是可以代表该地的事物。图标的设计均用fireworks完成。图(5)图(6)3.制作我主要负责了网页中的Fireworks的制作,其体现作用细分如下:第20页华北科技学院计算机学院综合性实验报告(1)主要使用Fireworks每个网页的导航、按钮和图片的修改。1.使用了Fireworks软件的文本变形功能通过克隆等手段制作出了具有倒影发光等多重效果的文字,再运用保存,就形成了具有
7、倒影效果的文字图片。2.给文本添加路径,使文字环绕钢笔所画的路径走,LOGO中的图片都是这样添加效果的3.运用了Fireworks软件的多边形套索工具将需要的素材图片扣出需要的部分,复制粘贴到画布里,再将画布背景色改变,添加文字,保存得到图像和文字效果的图片。4制作导航条,打开编辑中的插入按钮,根据提示自己画一个有圆度的矩形或从库中拖拽一个制作好的按钮,加入渐变,调节到自己想要的效果,插入文字并给通过滤镜给其加入效果发光、阴影等。,(2)Dreamweaver部分1.建立站点并管理站点,在站点中实现了对文件夹的建立,对文本,图片的编辑,删除,复制等。
此文档下载收益归作者所有