宁远网站建设中图片

作品成果家乡网站设计与开发姓名唐芷晴学号201710330248专业司法信息安全区队17信管302指导老师隆文超二〇二〇年四月目录一、任务描述.
1二、需求分析.
1三、整体设计.
2(一)设计原则.
2(二)设计目的.
2(三)页面结构.
2(四)网站内容.
3四、详细设计.
4(一)栏目导航的建立.
4(二)站点的建立.
4(三)设计技巧.
5五、成效评估.
5六、总结与反思.
91家乡网站设计与开发一、任务描述我的家乡宁远县,是湖南省永州市所辖的一个县,位于湖南省南部,东连新田、郴州市嘉禾县,南靠江华瑶族自治县,西接道县、双牌县,北界祁阳县.
宁远县获批湖南省历史文化名城.
宁远县总面积2510平方公里,全县辖4个街道办事处、12个镇、4个民族乡以及4个国有林场.
宁远县境内有九嶷山国家森林公园、宁远文庙、舜帝陵等著名景点.
宁远县是中国粮食主产比照县、生猪调出大县、优质油茶林基地示范县、现代烟草农业整县推进试点县、小农水建设重点县、生态文明示范工程试点县、生态功能区补偿县、法治创建先进县、科普工作示范县、竞技体育后备人才重点县、革命老区县,是湖南省承接产业转移试点县、发展开放型经济先进县、旅游强县、文明县城、卫生县城、城乡环境卫生十佳县.
随着科技和经济的发展,网络已成为人类生活中不可缺少的一部分.
谈到网络自然就离不开网页了,因为人们正是通过它来进行信息的交流,网页设计已是热门,各式各样的网站及千姿百态的个人主页在网上随处可见.
通过使用以下几个软件:Photoshop,Flash,以及包括客户端的脚本语言和服务端的语言,客户端语言包含HTML,ⅤB,Dreamweaver,服务端语言等.
用现代语言文字、图片、网页方式,具体介绍宁远的地理环境、风景美食、人文历史、风俗文化等情况,使更多的人知道宁远的美,来宁远走走看看.
网站主要通过多方面的介绍来实现对宁远的宣传,使人们对宁远有一定的了解.
本作品是以宁远文化为主要背景,通过对地域文化、人文历史、风景美食进行介绍.
以宁远家乡特色为背景分析,详细设计出具有针对性的网站.
二、需求分析建网需求:随着互联网的飞速发展,人类正进入一个前所未有的信息化社会.
互联网已经成为世界上覆盖面最广、规模最大、信息资源最丰富的计算机信息网络,它不仅给人们提供了一个全新的获取信息的手段,也正在逐步改变我们的生活、学习和工作方式.
作为互联网的主要组成部分,网页和网站得到了极为广泛的应用,企业、公司2和机构能通过网站来宣传自己的技术和产品,个人通过主页展示自己的风采,我们可以从不同的网站来获取自己需求的信息.
掌握网页制作和网站建设技术成为了我们的需求和优势.
宁远有好山好水,独特的风俗人情,可以借助这门技术来将宁远各方面内容,更好的分类、概括、总结后完美的呈现在人们眼中,在网站的宣传下也可以使更多的人进一步了解我的家乡宁远.
三、整体设计(一)设计原则1、实用性原则;能够真正的为网民提供一个比较全面的宁远,能让网民更进一步的了解宁远的好景好食好人.
2、多样性原则;制作的网页不仅包涵一些介绍,还应有相应的多媒体元素让网民更直观的全面的了解.
3、简洁性原则;制作的网页要层次分明,不能有太多冗余内容,各网页之间要添加相应的链接.
(二)设计目的用现代语言文字、图片、网页方式,通过具体介绍宁远的地理环境、风景美食、人文历史、风俗文化等情况,使更多的人知道宁远的美,来宁远走走看看.
网站主要是通过多方面的介绍来实现对宁远的宣传,能够使人们对宁远有个大概的了解.
本作品是以宁远文化为主要背景,通过对地域文化、人文历史、风景美食进行介绍.
以宁远家乡特色为背景分析,详细设计出具有针对性的网站.
(三)页面结构1、网站的整体颜色:绿色为导航颜色;主体颜色:白色、浅绿色、橙色、绿色;2、网站的字体颜色:黑色为主、绿色、橙色;3、参照传统家乡网站的设计格式,充分体现家乡形象;4、网站设计工具(1)网站设计工具:Photoshop,Flash,以及包括客户端的脚本语言和服务端的语言,客户端语言包含HTML,ⅤB,Dreamweaver,服务端语言等.
(2)模板为文字排版、图片制作、平面设计、静态无声图文,另一方面是网站3的延伸设计包括网站的主题定位和浏览群的定位,智能交互,设计简单,利于浏览者专注内容.
5、网站框架设计(1)草图的设计,浏览了各大网站后,我已在心中确定了我的网站的大体布局,并成功的建立网站草图.
(2)布局的规划,第一步新建"HTML"在新建的空白网页的"工具栏"选项卡中选中"布局"由于在网页中"层"不好固定位置,所以我选用表格布局,进入布局模式选用"绘制布局单元格"在空白网页中根据先前设计的个人网站草图绘出网页的框架.
根据个人网站显示的需要更改表格布局的属性值,最后成功完成了网站主页的布局设计,并根据需要调整好页面的布局表格属性值.
(四)网站内容该网站可分为七大模板:(1)网站首页:网站首页大致介绍了宁远美丽的风景、地理位置、资源环境、相关美食、个人信息等,页面简洁大气,以青山的颜色为主体,突出环境优美;(2)宁远简介:了解宁远地理位置、资源环境、宁远县教育事业、宁远县医疗卫生、宁远县社会保障等相关信息;(3)宁远风景:该网页利用图片和文字具体介绍了九嶷山国家森林公园、宁远文庙、舜帝陵、宁远古城、县城夜景等著名景点.
包含一个风景内页.
(4)宁远历史:介绍从古代到民国再到建国后的宁远历史变化,感受宁远悠久的历史岁月,带领大家从历史的角度去了解宁远这一古城.
(5)宁远美食:清楚宁远有关吃的食物习俗,俗话说美食是身体的歌曲,而歌曲是心灵的美食.
所以从美食的方面进行更好的介绍宁远.
其中的宁远肉馅豆腐、宁远血鸭、九嶷山兔、宁远腊肉、油炸豆腐片、宁远糍粑、宁远辣椒等每一道菜都让人口水直流.
包含一个美食内页.
(6)优秀人物:宁远的名人馆中介绍了不少宁远的优秀人物,从古至今出过文人、状元、将军、司令、科研人员、举重冠军.
有吏部侍郎授正议大夫李郃、一品荣禄大夫石焕章、国民党陆军中将李韫珩、湖南省人民军政委员会参议欧冠、中国4工程院院士欧进萍、女子举重世界冠军李运利.
(7)在线留言:本模块采取问答填卷形式,通过客户的建议和评价,使我们更加完善自己的作品,具有给自己留发展空间的意义.
四、详细设计(一)栏目导航的建立栏目导航的巧妙运用不仅能带来极大的美感,而且能较好地突出家乡形象,而且能将网页上的各种元素有机的组织起来,它甚至还可以引导观者的视线.
(二)站点的建立首先运用到Dreamweaver软件以及建立站点.
如下图所示:栏目导航5建立站点(三)设计技巧1、主次分明,中心突出.
在一个页面上,必然考虑视觉的中心,这个中心一般在屏幕的中央,或者在中间偏上的部位.
因此,一些重要的文章和图片一般可以安排在这个部位,在视觉中心以外的地方就可以安排那些稍微次要的内容,这样在页面上就突出了重点,做到了主次有别.
2、大小搭配,相互呼应.
较长的文章或标题,不要编排在一起,要有一定的距离,同样,较短的文章,也不能编排在一起.
对待图片的安排也是这样,要互相错开,造成大小之间有一定的间隔,这样可以使页面错落有致,避免重心的偏离.
3、图文并茂,相得益彰.
可以选择一幅适合表现主题的好图片作为主页背景以增强吸引力.
文字和图片具有一种相互补充的视觉关系,页面上文字太多,就显得沉闷,缺乏生气.
页面上图片太多,缺少文字,必然就会减少页面的信息容量.
因此,最理想的效果是文字与图片的密切配合,互为衬托,既能活跃页面,又使主页有丰富的内容.
五、成效评估以下就是我的网站成品图,该网站的首页设计如图1所示,该首页可分为七大板块分别为:网站首页、宁远简介模块、宁远风景模块、宁远历史模块、宁远美食模块、优秀人物模块、在线留言模块.
1、网站首页网站首页大致介绍了宁远美丽的风景、地理位置、资源环境、相关美食、个人6信息等,页面简洁大气,以青山的颜色为主体,突出环境优美.
图1网站首页图1-1网站首页2、宁远简介了解宁远地理位置、资源环境、宁远县教育事业、宁远县医疗卫生、宁远县社会保障等相关信息.
7图2宁远简介3、宁远风景通过本模块利用图片和文字具体介绍了九嶷山国家森林公园、宁远文庙、舜帝陵、宁远古城、县城夜景等著名景点.
包含一个风景内页.
图3宁远风景图3-1宁远风景4、宁远历史介绍从古代到民国再到建国后的宁远历史变化,感受宁远悠久的历史岁月,带8领大家从历史的角度去了解宁远这一古城.
图4宁远历史5、宁远美食清楚宁远有关吃的食物习俗,俗话说美食是身体的歌曲,而歌曲是心灵的美食.
所以从美食的方面进行更好的介绍宁远.
其中的宁远肉馅豆腐、宁远血鸭、九嶷山兔、宁远腊肉、油炸豆腐片、宁远糍粑、宁远辣椒等每一道菜都让人口水直流.
包含一个美食内页.
图5宁远美食图5-1宁远美食6、优秀人物宁远的名人馆中介绍了不少宁远的优秀人物,从古至今出过文人、状元、将军、司令、科研人员、举重冠军.
有吏部侍郎授正议大夫李郃、一品荣禄大夫石焕章、国民党陆军中将李韫珩、湖南省人民军政委员会参议欧冠、中国工程院院士欧进萍、女子举重世界冠军李运利.
9图6优秀人物7、在线留言本模块采取问答填卷形式,通过客户的建议和评价,使我们更加完善自己的作品,具有给自己留发展空间的意义.
图7在线留言六、总结与反思网页设计伴随着网络的快速发展而快速兴起,作为上网的主要依托,由于人们使用网络的频繁而变得非常重要.
生活中我每天上网都要接触到网页,原来没有留意过网页的设计,但是经过大学专业的学习了解,现在我打开一个网页都会习惯性的先看看排版、布局和色彩运用.
通过老师的讲解和对课本的翻阅,我学习到了一些关于建设网站和制作网页的知识,对网页制作的基础知识也有了一定的掌握.
通过Dreamweaver制作网页,我用到了一些基本的功能:图片插入和对齐设置:文字的格式、颜色、背景颜色的设置等.
但是在自己尝试着做的时候,总是出现这里那里的问题.
不是图片不能固定在自己想要的位置,就是滚动文本的显示区域不知道为什么撑过了页面,还有就是不同分辨率、不同浏览器都会对浏览网页产生影响.
而且在CSS方面,我总是不太熟悉各种代码是控制哪些东西的.
除了查找解决问题我还总结了经验.
命名站点或者文件夹的的时候一定要注意,最好用相应的英10语或者汉语拼音,要见名知意,如图片文件夹用image或者tu,这样可以避免页面调用时不正确的现象发生.
我认为页面设计应以美观、大方、简洁为原则,保持一致的风格.
为了达到最佳的视觉表现效果,应讲究整体布局的合理性,使浏览者有一个流畅的视觉体验.
网页最主要的功能就是给每个上网者提供一种形式,让他们能够了解网站提供的信息.
网页设计,需要站在用户的角度来看.
用户是一个网站成败的关键.
如果用户要花很多时间进入网站,很有可能他会立即关掉网站,或者网站操作很不方便用户也会马上离开,这种网站是很失败的设计,只会让用户失望的离去.
所以网页容量即包括图像在内的网页字节数最好不要超过50K.
这次网站设计时间急任务比较重,某方面做的不是很专业,还有好多要学习的地方.
通过所学的专业知识,我认识到网页设计作为一种视觉语言,要讲究编排和布局,虽然主页的设计不等同于平面设计,但它们有许多相近之处,版式设计通过文字图形的空间组合,表达出和谐与美.
在此诚挚的感谢我的指导老师隆主任对我的悉心教导和帮助,在老师的指导下我完成了这个作品.
不积跬步,无以至千里.
我已经在老师的指引下迈入了网页设计的大门,在今后的闲余时间继续认真学习制作网页的更多知识以实现自身技能的提高.
参考文献[1]赵相萌,王云用,胡耀芳.
网页设计与制作教程[M]北京:清华大学出版社,2008.
[2]李光明,曹蕾,余辉.
中文Dreamweaver8网页设计与实训教程[M]北京:冶金工业出版社,2006.
[3]杨选辉.
网页设计与制作教程[M].
北京:清华大学出版社,2009.
[4]高长军.
构建"网站设计与制作"教学环境的策略[J].
实验教学与仪器,2016,33(11):41-42.
[5]王丽丽,陈雯嫣,戴天.
《我的网站我设计》微课程教学设计[J].
中国信息技术教育,2017,(Z1):22-24.
11[6]陈笑.
Dreamweaver8,PhotoshopCS2,Flash8网页制作实用教程[M].
北京:清华大学出版社,2006.
[7]冯同宪,李樟.
宁远县志(康熙)[M].
湖南:宁远县文献编印委员会出版社,2019.
10[8]曾钰.
宁远县志(嘉庆)[M].
湖南:宁远县文献编印委员会出版社.
,2019.
1[9]胡奠域,于缵周.
宁远县志续略(道光)[M].
湖南:宁远县文献编印委员会出版社,2019.
3[10]宁远县文献编印委员会.
《湖南宁远县文献》[M].
湖南:宁远县文献编印委员会出版社,2019.
3