布局025-3关于网页设计中页面框架构造及颜色搭配的研究

摘要

网页框架构造与颜色搭配是网页设计中两个重要的元素缺少了其中任意一个都可能使页面变成一个失败的作品。国内的网页设计水平虽然近几年发展得非常快但是现在仅有的水平肯定是不够的。对于网站本身来说 网页框架布局与颜色搭配是否合理将对网站流量甚至前途产生深远影响所以如何对页面进行布局设计和颜色搭配成为网页设计中一个重要课题。本文分别对国内五个类别的网站的首页设计进行了分析以求了解目前国内网页设计的真实水平并对其未来的发展方向进行判断。

关键词 网页设计 网页框架构造 网页配色

Abstract

Web frame structure and color assortment are themost two importantpoints to web design. Without including any probably makes web becomea failed production. In recent years, the level of web design isdeveloping very fast, but it is far away from being enough. Regardingweb itself, web frame structure and color assortment are suitable ornot hasa far-reaching influence on thewebsite traffic even its future.So how to design structure and how to match colors become a veryimportant project of web design. This text analyses five kinds ofdomestic home pages separately to realize the true level of Chinesewebdesign and judge its development direction in the future.

Key Words: web design Web frame structure web color assortment

北京理工大学现代远程继续教育学院毕业设计论文

目录

第1章互联网概述及其应用. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1

1. 1网络. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1

1. 1. 1网络的定义. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1

1. 1. 2网络的发展. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1

1. 1. 3网络的应用和意义. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2

1. 2网站. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2

1. 2. 1网站的定义. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2

1. 2. 2网站的构成和种类. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2

1. 2. 3网站建设的意义. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3

1. 3网页. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3

1. 3. 1网页的定义. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3

1. 3. 2为什么要对网页进行设计. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3

第2章网页设计概述. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3

2. 1网页设计. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3

2. 1. 1网页设计的介绍. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .4

2. 1. 2网页设计的发展方向. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .4

2. 2网页布局设计. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .4

2. 2. 1网页布局的定义. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .4

2. 2. 2网页布局设计介绍. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .4

2. 3网页颜色搭配设计. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .8

2. 3. 1了解颜色是什么. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .8

2. 3. 2网页配色方法. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .8

2.4网页布局技术. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .11

2.4. 1网页布局技术介绍. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .11

2.4.2 TABLE布局. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .11

2.4.3 DIV+CSS布局. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .11

2.4.4其他布局技术. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .12

第3章门户网站等五类网站的研究. . . . . . . . . . . . . . . . . . . . . . . . . . .13

3. 1门户网站. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .13

3. 1. 1门户网站介绍. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .13

3. 1. 2门户网站页面布局的特点. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .14

3. 1. 3门户网站页面颜色搭配的特点. . . . . . . . . . . . . . . . . . . . . . . . . . . . .17jww(mMMmIII

3. 1.4门户网站页面设计的发展趋势. . . . . . . . . . . . . . . . . . . . . . . . . . . .19

3. 2电子商务网站. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .22

3. 2. 1电子商务网站介绍. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .22

3. 2. 2电子商务网站页面布局的特点. . . . . . . . . . . . . . . . . . . . . . . . . . . .22

3. 2. 3电子商务网站页面颜色搭配的特点. . . . . . . . . . . . . . . . . . . . . . . .24

3. 2.4电子商务网站页面设计的发展趋势. . . . . . . . . . . . . . . . . . . . . . . .24

3. 3企业网站. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .25

3. 3. 1企业网站介绍. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .25

3. 3. 2企业网站页面布局的特点. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .25

3. 3. 3企业网站页面颜色搭配的特点. . . . . . . . . . . . . . . . . . . . . . . . . . . .27

3. 3.4企业网站页面设计的发展趋势. . . . . . . . . . . . . . . . . . . . . . . . . . . .29

3.4政府网站. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .29

3.4. 1政府网站介绍. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .29

3.4. 2政府网站页面布局的特点. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .29

3.4. 3政府网站页面颜色搭配的特点. . . . . . . . . . . . . . . . . . . . . . . . . . . .31

3.4.4政府网站页面设计的发展趋势. . . . . . . . . . . . . . . . . . . . . . . . . . . .31

3. 5个人网站. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .32

第4章结论. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .34

北京理工大学现代远程继续教育学院毕业设计论文

前言

当前人们的生活 已经越来越离不开计算机和互联网了人们通过互联网可以很方便的进行各种活动计算机和互联网带给人们的便利是别的工具无法取代的。而对于提供互联网的各种服务的平台 网站来说更多需要考虑的则是如何把网站页面设计得更美观、更方便、更人性化来吸引人们这就要涉及到网页设计了。

网页设计包括栏目设计、页面布局、颜色搭配、布局技术等方面的内容 中国的网页设计虽然在互联网发展之初较为沉寂但是在近几年发展非常迅速可以说是日新月异主要体现在页面布局、颜色搭配和布局技术上。一个好的网页通常都有合理的页面布局和适合主题的颜色搭配。页面布局和颜色搭配可以千变万化但怎么变都不能脱离以访问者为中心。这个世界有着很多行业 同样也有着相对应的人群 网页也需要实现不同的功能颜色搭配要适合网页主题 页面布局要符合各行业人群的使用习惯。

本文主要研究门户网站、 电子商务网站、企业网站、政府网站、个人网站五类网站的首页设计研究的内容为这五类网站首页的页面布局和颜色搭配以及页面布局技术。通过网络、 自有图书以及相关杂志等收集论文所需的文字、 图片资料和数据利用所学网页制作、设计等专业知识通过多个案例的截图来进行分析研究参考其他专家、学者的观点和思想结合获取的资料数据深入分析得出最后的结论并提出自己的见解。

网页设计是一门专业的学科。 时代在不断进步访问者的要求也会越来越高 网页设计的发展方向将使页面布局更加合理、更加人性化 页面颜色搭配更符合页面主题、更吸引访问者眼球 页面布局技术更加成熟、简单、方便。jwwmMmMmV

北京理工大学现代远程继续教育学院毕业设计论文

第1章互联网概述及其应用

1. 1网络

1. 1. 1网络的定义

计算机网络①是用通信线路和通信设备将分布在不同地点的多台自制计算机系统互相连接起来按照共同的网络协议共享硬件、软件和数据资源的系统。

1. 1. 2网络的发展②

随着1946年世界上第一台电子计算机问世而后有人将一台计算机经过通信线路与若干台终端直接连接形成了局域网的雏形。最早的网络由美国国防部建立该网络名为ARPAnet 1983年 TCP/IP协议研究成功从而诞生了真正的网络。随着Internet开始对外开放 到1991年6月在连通网络的的计算机中商业用户首次超过了学术界用户这是网络发展史上的里程碑从此网络发展速度一发而不可收。

计算机网络的发展主要有以下几个阶段

远程终端连接

计算机网络阶段局域网

计算机网络互联阶段广域网、 Internet

信息高速公路。

我国的网络发展以1987年通过中国学术网C ANE T向世界发出第一封E-mail

为标志 发展历程大略可以划分为三个阶段。

1  1987-1993研究实验阶段。 网络应用仅限于小范围内的电子邮件服务

①《百度百科》 http://baike baidu com/view/3487 htm#sub3487

② 《百度百科》 http://baike baidu com/view/3487 htm#sub3487jwwmMmMm1

2 1994-1996 同样是起步阶段。 1994年4月 中关村地区教育与科研示范网络工程进入Internet从此中国被国际上正式承认为有Internet的国家。至1996年底 中国的网络用户数已达20万。

3 1997-至今快速发展阶段。从1997年以后我国网络用户数基本保持每半年翻一番的增长速度截止2010年底我国上网用户总人数为

4. 2亿 与2002年同期相比增加了2220万人。

1. 1. 3网络的应用和意义

进入21世界以后 网络发展日新月异据统计 中国的网站数量已经达到了323万个并且正以每年12. 3%的增长率快速增长。未来几年 中国的网络带宽也将快速发展将由现在的最高20M提高到100M以上。

网络正在影响和改变着我们的生活 小到查阅资料、视频聊天大到科学研究等。 金融、物流、通信、娱乐、教育、科研、视频、会议、传媒、医疗、旅游、 电子商务等居多领域足不出户就可以与人见面、交流可以学习工作买卖商品、游戏娱乐等等。给我们的工作、学习、生活带来了极大的便利 与我们的生活越来越密不可分。

1. 2网站

1. 2. 1网站的定义

网络是一个超级交流平台而这个交流平台的窗口则是一个又一个网站。

网站①是指在互联网上根据一定的规则使用HTML等工具制作的用于展示特定内容的相关网页的集合。简单的说 网站是一种通信工具人们可以通过网站来发布自己想要公开的信息或者利用网站来提供相关的网上服务。

1. 2. 2网站的构成和种类

一个网站主要由三部分构成 网页+域名+主机空间。

域名就是网站的名字通过域名可以正确的访问网站。主机空间是存放网站数据库和页面内容的地方。

北京理工大学现代远程继续教育学院毕业设计论文

网站可以分为静态网站和动态网站。静态网页没有数据库 只是纯粹的一个展示页面不能与访问者进行交互。而动态网站带有数据库可以与人进行交互操作 比如访客留言或者是网站管理员发布信息。

1. 2. 3网站建设的意义

网站建设是涵盖企业或个人定位考虑从营销、展示角度立意进行一个网站建设的全过程。 网站的建设对于企业或个人有不同的意义。对于企业来说 网站建设可以提高企业知名度、展示企业特点、实力以及文化和目标。而对于个人来说可以展示个人风采和风格让更多人了解自己。

1. 3网页

1. 3. 1网页的定义

网页①的学名称作HTML(Hypertext Markup Language)文件 是一种可以在互联网上传输并被浏览器认识和翻译成页面显示出来的文件 中文翻译为 “超文本标记语言”。 “超文本”就是指页面内可以包含图片、链接、音乐、程序等非文字的元素。

1. 3. 2为什么要对网页进行设计

网页是承载互联网信息的载体 网页也是实现信息交流和沟通的最直接的手段是互联网重要的一环。

在上个世纪末互联网初入中国大家争先恐后的做网站 目的只为争取一席之地所以粗制滥造毫不讲究。随着网站数量的激增以及竞争加剧如何吸引访问者 并留下很好的第一印象如何从众多网站里脱颖而出、与众不同如何让访问者对你的网站流连忘返这些问题让网页设计者开始注重内容的编排设计、网页布局架构、网页风格设计和颜色搭配。第2章网页设计概述

《百度

①jwwmMmMm3