第二章 网站的设计风格
网站的风格，指的是在网络上的站点传达给受众体（即浏览者）的综合的整体的感受，是一个网站建设的关键部分，是一个网站的统一体。网站的风格贯穿于各个页面中间的每一个部分，包括文字、图画、LOGO、BAN-NER、布局、排版、链接等各种
因素。
有风格的网站不是一些信息的堆砌而是具有一定艺术感的给人一种视觉冲击的表现，一个网站风格成功的与否，决定了这个网站的整体水平。如世界知名的可口可乐公司的网站---红色是该公司的标准色，其网站的所有页面也同时围绕这一个色调设计给人极强的视觉冲击力，体现了该公司充满活力，充满激情的创业精神。

第一节 门户网站的设计风格
门户网站是一种综合类型的网站，这种类型的网站包括的内容丰富多彩。如新闻、游戏、搜索、BBS、聊天室、娱乐、影视、时尚等等，国内知名的这种类型的网站有新浪、搜狐等。如果要制作这一类型的网站，需要先位，要首先研究出该网站是以什么为特色，浏览者的年龄层次等。用搜狐网站为例，该网站是一个类似于Yahoo的，主要为搜索引擎的网站，因为内容多，所以版面设计不易花哨（通常门户网站的主页是以内容吸引浏览的）。其页面的主要内容就是一个分类的搜索表。

门户网站的特性
门户网站的特性分以下几个方面：
1. 内容丰富
2. 综合性强
3. 浏览者多
4. 更新速度快

门户网站的受众体
制作一个门户网站首先要考虑这个网站是为哪一个层次的浏览者做的，才能根据不同的需求，设计出相应的风格。如网易的女性网。该网主要面对的是女性浏览者，所以改网站首页的颜色为透明度高的颜色。淡蓝色、粉红色和淡紫色的互相配合十分和谐，充分体现了女性的宁静、和谐和高雅的性格。再如网易的辛辣网站，该网站的对象为年轻人。年轻人的特点是充满活力、冲动。网站的建设者就抓住了这一特点，并给网站命名为辛辣，其页面的色彩也是红红火火，使人看上去心血沸腾，并在炎热的夏季全面推出，有一点夏天里吃火锅的感觉。

门户网站的宣传
首先用一句概括性的语句或词语来描述网站，注意要和网站的内容风格统一；第二，制作一些能体现网站风格的一些设计，包括报纸、招贴、Logo链接、文字性介绍等等。

门户网站的策划
策划是一个成功门户网站建设的关键部分，也是最重要的前提。策划包括的内容很多，且需要经过多方面的调查。比如上网人的各个年龄层次，文化水平、收入，还包括网站的内容，内容来源，网站的定位等等。总体来说网站的策划可分为以下几大类：1.建站的目的；2.网站的规模；3.主要手众体；4.基于明确的受众体的网站的设计风格；5.如何推广网站；6.希望网站带来何种利益；7.如何经营这个网站；8.投入的预算。

第二节 商业网站的设计风格
一类是单单推广本公司的产品，用网络这个媒体宣传该公司的称为推广型网站；一类是直接在网络上进行商务交易的商务型网站，大多数的商业网站均属第一种类型，如IBM公司，Apple公司。

商务网站的特性
商业站点应该依据该公司的产品及服务对象来设计公司的网站，商务网站的内容一般是公司或产品的介绍。所以内容量不大，因此网页的设计成了吸引浏览者的关键。

商务网站的受众体
因为商务网站都是一些公司的站点，所以其受众体绝大多数是他们的客户，还有一部分是对公司或产品有兴趣的人，所以建设网站时必须做好自己公司的各种调查。

商务网站的宣传
一般来说，商务网站本身就是宣传的一种媒体，公司式企业可以以自身宣传来达到目的。

第三节 个人网站的设计风格
个人网站在网络世界应该是为数最多的了。网络面前人人平等，谁不愿意在这片土地上和别人一样有一个展示自我的空间呢？所以，网络上的个人网站五花八门，这里我们一一举例说明。

个人网站的特性
个人网站的最大特性就是--自由。免费的空间，免费的域名，免费的主机，你只要制作就可以了。是不是有种空手套白狼的感觉。其实事实就是如此。有不少国内外的知名的个人网站日访问量达到了几万次。因为这样才会吸引无数网络爱好者了不失痞的建设自己梦想中的家园。

个人网站的风格
个人网站作为一个展示自我的一个窗口，毫无疑问是应该充分体现自己的性格，品位。换句话说，个人网站是一个在虚拟的网络世界中的一个自我。如果可以塑造这个自我，就要发挥你的想象力了。（例四个）

个人网站的注意事项
个人网站要注意的设计方面的事项。
个人网站数量较多，想在这样繁多的网站中突出自己是非常困难的。因此个人网站不仅需要在内容上要吸引浏览者，而且一定要在界面的设计上打动浏览者给其一个不可磨灭的印象，才能使你人牢记你的网站，经常光顾你的网站。

个人网站的宣传
古人有言：“好酒不怕巷子深”。但在网络上这句话可行不通，个人网站往往因为经济问题不可能在其他的媒体上进行宣传，所以只能以网传网。其实推广你的网站并不难。1.在各大搜索引擎登陆你的网站。2.你也可以在网上的论坛及BBS上发布网站消息。3.在新闻组上发布。4.广告交换登陆。5.友情链接登陆。6.尽量进入网站排行榜。

第四节 项目网站

简介
项目网站指的是在同一个项目领域内描述或是发布各种信息的专业型网站，这里的项目包括了很多的领域，如：产品、商品、资料、音乐、游戏等等。只要是在同一领域内都可称之为项目网站。项目网站类似于商业网站。

项目网站的特性
项目网站最突出的特点就是内容详细，应尽可能全面的介绍该项目的一切东西。项目站点的光顾者是一些专业人士，而且会固定的去一个网站收集各种资料。所以第二个特点就是专业性强。

项目网站的设计风格
基于项目网站的特性，在设计该网站时，就应该依照其特性，由目的的，有理智的去设计。不能像设计个人网站一样的可以去随意发挥自己的想象力，越突出越好，但同时也要作出一定的风格，提高网站的档次。这两者的尺度很难把握，这就要看设计师的水平了。一般来说，这类型的网站会依靠产品的特性去设计、布局。比如一个电脑产品的项目网站设计，在界面上就应该充分体现电子产品的特性，在色调上可以运用深蓝色系。用一些线条的交错体现高科技的高速感。按钮的图形可以简单化，文字要用时代感强的字体。切记，这类网站的浏览者的主要目的是查看信息、资料，而对那些花哨的界面不会太感兴趣，太注重设计有时会事得其反。

第五节 娱乐网站

简介
娱乐类型的网站也在互联网上占据着相当大的地位，娱乐网站的类型很多。如音乐、电影、游戏、动画等都包括在娱乐网站的范畴内。
娱乐网站一定亚体现“娱乐”这两个字。娱乐是在紧张的工作生活中调节自我情绪的方法，是工作生活中相当重要的一部分。即然是娱乐，就应该轻松，所以建立此种网站就应该抓住这两个字，并在上面下功夫。

娱乐网站的特征
娱乐网站是互联网上最多姿多彩的部分，此类的资源网站也是人们最常光顾的地方。网站如果想长期被浏览者所认可，即应该把握住信息的脉搏，把最精彩的娱乐项目奉献给大家，这样就需要不断给网站充血。有的知名娱乐网站甚至几个小时就更新一次信息，信息更新快就成了娱乐网站的一个鲜明的特点。娱乐网站要吸引客源不但要在信息上抓住第一手材料，而且对人们的喜好也要有所侧重，这样才能抓住浏览者的心理来做好网站。所以有个性的设计也是娱乐网站的一大特色。

娱乐网站的设计风格
娱乐网站的设计风格可谓是五花八门，无奇不有。但是这些设计都是为了整个网站的定位而服务的。根据网站的内容定制设计风格是很关键的。例如以电影为内容的一个娱乐网站，其大多数十一黑色作为背景的。黑色容易使人联想到电影院里漆黑的环境，安静的气氛。所以香花特兄弟、派拉蒙、20世纪福克斯等著名的电影公司同属这个黑色系列的设计。

娱乐网站的注意事项
娱乐网站在设计时，其界面的方针是个性也要事务。所谓个性，就是一定要设计出自己的风格；务实，就是不能只考虑到前者，浏览的速度也是非常关键的部分。试想，如果一分钟还打不开一张网页，有几个浏览者还会等下去？就达不到轻松的目的了。所以两点都非常重要。同时，这两点之间的尺度也是不好把握的，往往会顾此失彼，解决这个问题就要看设计师的功底了。

第三章 网页的版面布局
所谓网页版面，指的是网页在浏览器中打开时显示的页面依据不同显示器，有800*600, 1026*768, 1152*864象素几种不等。但是为了绝大多数浏览者可以全面看到完整的画面，在现在的用户中，有相当一部分用的是800*600象素的分辨率。所以在制作中一般也采用这个分辨率。但是这个尺寸是加上浏览器外观的尺寸，实际上页面可见的尺寸是787*560象素，我们就应该在这个尺寸上进行设计制作。

网页排版布局的初步
在网页排版中需要考虑到很多的因素，如点线面、黑白灰之间的关系，视觉平衡等。这对于网页的版式、布局也是很重要的。本节先讲解一些实例，希望读者能融会贯通，合理的运用到网页设计中去。

网页的布局结构
网页的布局主要可以分几大类：“同”字形布局，“国”字形布局，这两类属于分栏式布局。另外还有环绕式布局，环绕式布局分为侧绕式和环绕式两种布局。下面我们具体的介绍一下这几种布局。
1 “同”字形布局
“同”字形布局指的是网页顶端为主菜单，左侧为二级项目菜单，右侧为链接菜单，中间部分为主要内容。“同”字形布局因为结构清晰，层次分明，内容详细，而博得大多数山、门户网站的青睐，也是大家上网时经常看到的布局格式。但是这种布局栏式比较死板，而且画面不够精彩，不具有一些正统，所以不是很吸引人。
2 “国”字形布局
“国”字形布局和“同”字形布局大同小异，只是在网页底部加上一部分网站的信息。
3 侧绕式布局
侧绕式布局指的是网页的中间部分放置主体画面，其菜单链接围绕主体的一侧布局。这类布局的伸缩性很强，要画面简单明了，可以加入一些创意的成分。而且除了门户网站以外所有的网站都适合用的一种布局格式。这类布局受到了很多网页设计者的喜爱。
4 环绕是布局
环绕是布局预测绕是布局大同小异。是把菜单链接和主体化面容合成一个整体，时网页变得更加统一和谐。环绕是布局的不足之处是不能使网站的内容让浏览者一目了然，这对于一个内容信息量大的网站是很不利的。
5 自由式布局
从字面上就可以看出自由式布局就是两个字自由，没有条条框框，没有任何束缚，可以自由发挥你的想象空间。这种布局往往活泼、感性，但是设计这种布局的网页设计人员一般是经过专业美术培训的。因为这种布局需极高的艺术设计修养和知识才会变得出众，而非专业人员设计往往会出现这样那样的纰漏，反而弄巧成拙。不过读者要使自己建设个人网站的话，我鼓励大家去努力去尝试，这种布局最能表现自己的风格了。

网页布局总结
以上讲了这么多种的布局方式，现在我归纳一下这些布局适用的网站类型：
“同”字形布局适合门户网站、商业网站、项目网站
“国”字形布局适合门户网站、商务网站
侧绕式布局适合商务网站、个人网站、项目网站、娱乐网站
环绕是布局适合商务网站、个人网站、娱乐网站
自由式布局适合门户网站、商务网站、个人网站、项目网站、娱乐网站
不同的布局适用于不同的网站，大家切记不要乱用。

第四章 网页的色彩调和
俗话说“远看色近看花”，当一张网页展现在你的面前时，最先吸引你的不是网页的内容，而是网页的色彩，可见网页色彩的选择和搭配时网页设计的重点之一。
第一节 色彩的基本知识
1 色彩的三属性
色彩可分为无彩色和有彩色两大类，前者如黑，白，灰。后者如红，黄，蓝等七彩。
无彩色有明有暗，表现为黑，白。也称色调，有彩色表现很复杂但可以用三组特微值来确定，其一是色相，其二是明度，其三是纯度，统称色彩的三属性。明度和色相合并为二维的色状态，称为色调，有些人只把明度理解为色调是不全面的
明度指色彩的明暗程度，明度最适合表现物体的立体感和空间感。
色相指色彩的相貌是区别色彩种类的名称。
纯度是指色彩的纯净程度，也可以说指色相感觉明确及鲜灰的程度，因此还有艳度、浓度、彩度、饱和度等说法。
2 色彩混合
生活中我们所看到的丰富多彩的颜色是通过光的吸收与反射而产生的，红黄蓝是三种最基本的颜色，又称三原色，原则上所有的色彩都可以用这三种色彩调和而成。
网页中的色彩也是用车三原色来表现的但是在用html语言编写是的数值是以十六位进制来表现的如#ffffff表现出来的就是白色。下面是一些网页中基本色彩的数值表可供大家参考：
3 色彩的心理
色彩不仅表现为它自身，跟重要的是它能够表达感情，并直接的、自发的影响人的心理活动，能够传递信息、激发情感，产生联想。由于色彩余人的情绪有着微妙的关系，再网站设计过程中，设计师若把握住了色彩这个尺度，那么整个网站的设计也就事半功倍了
（1）色彩的冷暖感觉
由于色相与明度的不同，不同的色彩给人不同的冷暖感，既色彩的冷暖感。在色相环中最暖的是桔红色,最冷的是青色，其它色相的冷暖程度依据各自同最暖色或最冷色的位置而定。
暖色：红紫、红、桔、桔黄、黄；
冷色：蓝绿、蓝青、蓝、蓝紫；
中性色：紫、绿、黑、白、灰；
无论是冷色或暖色，混以白色，明度增高，色彩偏冷。混以黑色，明度降低，色彩偏暖。例如：冷色蓝混以黑色，成为暗蓝，有暖感；暖色红混以白色为粉红色又冷感，这里所说的冷暖感是相对而言的。
中性色在与冷色或暖色对比时，色感发生变化，同冷色对比有暖感；同暖色对比有冷感。
色彩冷暖的不同情感特征是：
冷色：阴影、透明、镇定、稀疏的、淡的、远的、轻的、女性的、微弱的、湿的、理智的、圆滑、曲线型、缩小、流动、冷静。
暖色：阳光、不透明、刺激的、稠密的、深的、近的、重的、男性的、强烈的、干的、情感的、方角、直线型、扩大、稳定、热烈。
（2）色彩的联想与特征
色彩的联想有具体的联想和抽象的联想之分。具体的联想是具体的事物表现的色彩。如由红色想到血，绿色想到树叶，它是人们已约定俗成的。抽象的联想是人们因一种颜色而联想到的一种感觉，如由紫色联想到优雅，高贵。黄色联想到光明、希望。在网页设计中这点很重要，如奥迪公司网站的主页以蓝灰色为主，使人一看便联想到这个公司是一个高科技工业企业。
下面总结了几种常用色彩的情感与象征，供读者参考：
<1>红：纯度高、引人注目、刺激作用大、对人的心理产生巨大的鼓舞作用
感觉：血、火、温暖、热情、喜悦、活泼、酷热、刺激、兴奋、愤怒、不
透明。
象征：喜庆、进步、勇敢、积极、博爱、庄严、吉祥、危险、警觉、太
阳、势力、革命、禁止、同时也给人恐怖的心理。
深红色意味着嫉妒、残暴；粉红色表示健康、甜蜜、爱情；红紫色有高
贵感、艳丽感； 桔红色充满敦厚与温暖感。
<2>橙色： 橙色的穿透力仅次于红色，但最鲜明的橙色应该是色彩中感觉最暖
的色，注目性也很高。既有红色的热情又有黄色的光明、活泼的特
性。是人们普遍喜爱的色彩。
感觉：温暖、华美、兴奋、明亮、烦恼、任性、疑惑、虚伪、热烈、暴
露
象征：快乐、健康、自由、勇敢、渴望、威严、富贵、野心、决心、胜
利
自然界中成熟的瓜果多为桔色，因此桔色易引起人食欲，给人香甜中略
带酸味的联想。并使人感到充实，饱满，成熟。桔色一旦混入白色或黑
色，立刻失去其特性，变为没有生气的，象花叶凋谢的褐色。把褐色冲
淡为米黄色，有柔和的气氛。橙黄色对人的视觉器官刺激较强，给人视
觉的负担。
<3>黄色：

作者：袁晓鹏

呜呜呜
我好不容易些的呀
没关系
我知道了
是有很多废话
请斑竹给删了吧！！

没关系的。哪不一样？只要是好东西，这可是人家的心血！