网页制作中的色彩搭配和色彩理论

1、网页制作中的色彩搭配和色彩理论 无论是平面设计，还是网页设计，色彩永远是最重要的一环。当我们距离显示屏较远的时 候，我们看到的不是优美的版式或者是美丽的图片，而是网页的色彩。 关于色彩的原理有许多，在此我们不可能一一阐述，大家可以看看相关设计书籍，有 利于系统地理解。在此仅仅想告诉大家一些网页配色时的小技巧。 1用一种色彩。这里是指先选定一种色彩，然后调整透明度或者饱和度，产生新的 色彩，用于网页。这样的页面看起来色彩统一，有层次感。 2用两种色彩。先选定一种色彩，然后选择它的对比色。 3用一个色系。简单的说就是用一个感觉的色彩，例如淡蓝，淡黄，淡绿；或者土 黄，土灰，土蓝。 在网页配色中，还要切记一些误区： 1不要将所有颜色都用到，尽量控制在三种色彩以内。 2背景和前文的对比尽量要大，(绝对不要用花纹繁复的图案作背景)，以便突出主要 文字内容色彩是人的视觉最敏感的东西。主页的色彩处理得好，可以锦上添花，达到事半功倍的效 果。色彩总的应用原则应该是“总体协调，局部对比” ，也就是：主页的整体色彩效果应该 是和谐的，只有局部的、小范围的地方可以有一些强烈色彩的对比。在色彩的运用上，可 以

2、根据主页内容的需要，分别采用不同的主色调。因为色彩具有象征性，例如：嫩绿色、 翠绿色、 金黄色、灰褐色就可以分别象征着春、夏、秋、冬。其次还有职业的标志色，例如：军警 的橄榄绿，医疗卫生的白色等。色彩还具有明显的心理感觉，例如冷、暖的感觉，进、退 的效果等。另外，色彩还有民族性，各个民族由于环境、文化、传统等因素的影响，对于 色彩的喜好也存在着较大的差异。充分运用色彩的这些特性，可以使我们的主页具有深刻 的艺术内涵，从而提升主页的文化品位。下面介绍几种常用的配色方案： 1.暖色调。 即红色、橙色、黄色、赭色等色彩的搭配。这种色调的运用，可使主页呈现温馨、和煦、 热情的氛围 2.冷色调。 即青色、绿色、紫色等色彩的搭配。这种色调的运用，可使主页呈现宁静、清凉、高雅的 氛围。 3.对比色调。即把色性完全相反的色彩搭配在同一个空间里。例如：红与绿、黄与紫、橙 与蓝等。这种色彩的搭配，可以产生强烈的视觉效果，给人亮丽、鲜艳、喜庆的感觉。当 然，对比色调如果用得不好，会适得其反，产生俗气、刺眼的不良效果。这就要把握“大 调和，小对比”这一个重要原则，即总体的色调应该是统一和谐的，局部的地方可以有

3、一 些小的强烈对比 后，还要考虑主页底色（背景色）的深、浅，这里借用摄影中的一个术语，就是“高调” 和“低调” 。底色浅的称为高调；底色深的称为低调。底色深，文字的颜色就要浅，以深色 的背景衬托浅色的内容（文字或图片） ；反之，底色淡的，文字的颜色就要深些，以浅色的 背景衬托深色的内容（文字或图片） 。这种深浅的变化在色彩学中称为“明度变化” 。有些 主页，底色是黑的，但文字也选用了较深的色彩，由于色彩的明度比较接近，读者在阅览 时，眼睛就会感觉很吃力，影响了阅读效果。当然，色彩的明度也不能变化太大，否则屏 幕上的亮度反差太强，同样也会使读者的眼睛受不了网页的色彩是树立网站形象的关键之一，色彩搭配却是网友们感到头疼的问题。网页的背 景，文字，图标，边框，超链接.，应该采用什么样的色彩，应该搭配什么色彩才能最好 的表达出预想的内涵呢？首先我们先来了解一些色彩的基本知识： .颜色是因为光的折射而产生的。 2.红，黄，蓝是三原色，其它的色彩都可以用这三种色彩调和而成。网页 html 语言中 的色彩表达即是用这三种颜色的数值表示例如： 红色是 color (255,0,0)十六进制的表示方 法

4、为(FF0000)白色为(FFFFFF), 我们经常看到的“bgColor=#FFFFFF“就是指背景色为白色。 3.颜色分非彩色和彩色两类。非彩色是指黑，白，灰系统色。彩色是指除了非彩色以 外的所有色彩。 4.任何色彩都有饱和度和透明度的属性，属性的变化产生不同的色相，所以至少可以 制作几百万种色彩。 网页制作用彩色还是非彩色好呢？根据专业的研究机构研究表明：彩色的记忆效果是黑白 的 3.5 倍。也就是说，在一般情况下，彩色页面较完全黑白页面更加吸引人。 我们通常的做法是：主要内容文字用非彩色(黑色)，边框，背景，图片用彩色。这样 页面整体不单调，看主要内容也不会眼花。 非彩色的搭配 黑白是最基本和最简单的搭配，白字黑底，黑底白字都非常清晰明了。灰色是万能色， 可以和任何彩色搭配，也可以帮助两种对立的色彩和谐过渡。如果你实在找不出合适的色 彩，那么用灰色试试，效果绝对不会太差。 彩色的搭配 色彩千变万化，彩色的搭配是我们研究的重点。我们依然需要进一步学习一些色彩的 知识。 一.色环。我们将色彩按“红-黄-绿-蓝-红“依次过度渐变，就可以得到一个色彩环。色 环的两端是暖色和寒色，当中是

5、中型色。 二.色彩的心理感觉。不同的颜色会给浏览者不同的心理感受。 红色-是一种激奋的色彩。刺激效果，能使人产生冲动，愤怒，热情，活力的感觉。 绿色-介于冷暖两中色彩的中间，显得和睦，宁静，健康，安全的感觉。 它和金黄， 淡白搭配，可以产生优雅，舒适的气氛。 橙色-也是一种激奋的色彩，具有轻快，欢欣，热烈，温馨，时尚的效果。黄色-具有快乐，希望，智慧和轻快的个性，它的明度最高。 蓝色-是最具凉爽，清新，专业的色彩。它和白色混合，能体现柔顺，淡雅，浪漫的 气氛(象天空的色彩:) 白色-具有洁白，明快，纯真，清洁的感受。 黑色-具有深沉，神秘，寂静，悲哀，压抑的感受。 灰色-具有中庸，平凡，温和，谦让，中立和高雅的感觉。 每种色彩在饱和度，透明度上略微变化就会产生不同的感觉。以绿色为例，黄绿色有青春， 旺盛的视觉意境，而蓝绿色则显得幽宁，阴深。 网页色彩搭配的原理 1.色彩的鲜明性。网页的色彩要鲜艳，容易引人注目。2.色彩的独特性。要有与众不同的色彩，使得大家对你的印象强烈。3.色彩的合适性。就是说色彩和你表达的内容气氛相适合。如用粉色体现女性站点的 柔性。 4.色彩的联想性。不同色彩会产

6、生不同的联想，蓝色想到天空，黑色想到黑夜，红色 想到喜事等，选择色彩要和你网页的内涵相关联。网页色彩掌握的过程 随着网页制作经验的积累，我们用色有这样的一个趋势:单色-五彩缤纷-标准色-单 色。一开始因为技术和知识缺乏，只能制作出简单的网页，色彩单一；在有一定基础和材 料后，希望制作一个漂亮的网页，将自己收集的最好的图片，最满意色彩堆砌在页面上； 但是时间一长，却发现色彩杂乱，没有个性和风格；第三次重新定位自己的网站，选择好 切合自己的色彩，推出的站点往往比较成功；当最后设计理念和技术达到顶峰时，则又返 朴归真，用单一色彩甚至非彩色就可以设计出简洁精美的站点。1) 同时对比与连续对比：同时对比：当两种颜色同时并置在一起时，双方都会把对方推向自己的补色，红和绿 并置，红的更红，绿的更绿；黑白并置，黑显得更黑，白显得更白。这种现象属于色彩的 同时对比。连续对比：指在不同的时间条件下，或者说在时间运动的过程中，不同颜色刺激之间 的对比。 2) 色相对比： 不同颜色并置，在比较中呈现色相差异，称为色相对比。A 原色对比：红、黄、蓝表现了最强烈的色相气质，它们之间的对比属最强的色相对 比。令人感

7、受到一种极强烈的色彩冲突，似乎更具精神的特征。B 间色对比：橙、绿、紫为原色相混所得的间色，其色相对比略显柔和。C 补色对比：在色环直径两端的为互补色。一对补色并置在一起，可以使对方的色彩 更加鲜明 邻近色相对比：在色环上顺序相邻的基础色相，如红与橙、黄与绿、橙与黄这样的色并置关系。属色相弱对比。特征是具明显的统一调性，同时在统一中不失对比的变化。E 类似色相对比：在色环上非常邻近的色，如蓝与绿味蓝这样的色相对比，是最弱的 色相对比效果。F 冷暖色相对比：从色环上看，明显在寒冷印象的色彩是蓝绿至蓝紫的色，其中蓝色 为最冷的色；明显有暖和感的色是红紫至黄的色，其中红橙色为最暖的色。冷暖对比产生 美妙、生动、活泼的色彩感觉。冷色与暖色能产生空间效果，暖色有前进感和扩张感，冷 色有后退感和收缩感。 3) 纯度对比： 一个鲜艳的红色与一个含灰的红色并置，能比较出它们在鲜浊上的差异，称为纯度对比。 4) 明度对比：每一种颜色都有自己的明度特征。当它们对比时，视觉除去分辨出色相的 不同，还会明显感觉到明暗的差异，这就是色彩的明度对比。1) 色彩的物质性心理错觉冷色与暖色是依据心理错觉对色彩的物理性

8、分类，对于颜色的物质性印象，大致由冷 暖两个色系产生。红光和橙、黄色光本身有暖和感，照射任何色都会产生暖和感。相反， 紫色光、蓝色光、绿色光有寒冷的感觉。冷色和暖色除去温度不同的感觉外，还会有其它感受，如重量感、湿度感等。暖色偏 重，冷色偏轻；暖色密度强，冷色稀薄；冷色透明感强，暖色透明感较弱；冷色显得湿润， 暖色显得干燥；冷色在退远感，暖色有迫近感。色彩的明度与纯度也会引起对色彩物理印象的错觉。颜色的重量感主要取决于色彩的 明度，暗色重，明色轻。纯度与明度的变化还会给人色彩软硬的印象，淡的亮色使人觉得 柔软，暗的纯色则有强硬的感觉。 2) 颜色的表情：色彩的情感是因为人们长期生活在色彩的世界中，积累了许多视觉经验， 视觉经验与外来色彩剌激产生呼应时，就会在心理上引出某种情绪。红色：是强有力的色彩，是热烈、冲动的色彩，高度的庄严肃穆。在深红的底子上， 红色平静下来，热度在熄灭着；在蓝色的底上，红色就像炽烈燃烧的火焰；在黄绿色的底 上，红色变成一促冒失的、鲁莽的闯入者，激烈而又寻常；在橙色的底上，红色似乎被郁 积着，暗淡而无生命，好象焦干了似的。橙色：是十分欢快活泼的光辉色彩，是暖色系中

9、最温暖的色。橙色稍稍混入黑或白色，会成为一种稳重、含蓄又明快的暖色，但混入较多黑色，就 会成为一种烧焦的色；橙色中加入较多的白色会带有一种甜腻的味道。橙色与蓝色搭配， 构成了最响亮、最欢快的色彩。黄色：是亮度最高的色，在高明度下能保持很强的纯度。黄色的灿烂、辉煌有着太阳 般的光辉，因此象征着照亮黑暗的智慧之光；黄色有金色的光芒，因此又象征财富和权力， 是骄傲的色彩。黑或紫色的衬托可以使黄色达到力量无限扩大的强度。白色是吞没黄色的 色彩，淡淡的粉红色也可以像美丽的少女一样将黄色这骄傲的王子征服。黄色最不能承受黑色或白色的侵蚀，稍微渗入，黄色即刻会失去光辉。绿色：鲜艳的绿色非常美丽，优雅，很宽容、大度，无论蓝色或黄色渗入，仍旧十分 美丽。黄绿色单纯，年青；蓝绿色青秀、豁达。含灰的绿色也仍是一种宁静、平和的色彩。蓝色：是博大的色彩，是永恒的象征。蓝色是最冷的色，在纯净的情况下并不代表感 情上的冷漠，只不过表现出一种平静、理智与纯净而已。真正令人情感冷酷悲哀的色，是被弄混浊的蓝色。紫色：是非知觉的色，神秘，给人印象深刻，有时给人以压迫感，并且因对比不同， 时而富有威胁性，时而又富有鼓舞性。当紫色以色域出现时便可能明显产生恐怖感，在倾 向于紫红色时更是如此。紫色是象征虔诚的色相，当紫色深化暗化时又是蒙昧迷信的象征。一旦紫色被淡化， 当光明与理解照亮蒙昧的虔诚之色时，优美可爱的晕色就会使我们心醉。用紫色表现混乱、死亡和兴奋，用蓝紫色表现孤独与献身，用红紫色表现神圣和爱和 精神的统辖领域简而言之，这就是紫色色带的一些表现价值。黑、白、灰色：无彩色在心理上与有彩色具有同样价值。黑和白是对色彩的最后抽象，代 表色彩的阴极和阳极。黑白所具有的抽象表现力以及神秘感，似乎能超越任何色彩的深度。康丁斯基认为， 黑色意味空无，像太阳的毁灭，像永恒的沉默，没有未来，失去希望。而白色的沉默不是 死亡，而是有无尽的可能性。黑白两色是极端对立的色，然而有时又令人感到它们之间有 难以言状的共性。白色和黑色都可以表达对死亡的恐惧和悲哀，都具有不可超越的虚幻与 无限的精神。在色彩体系中，灰色是最被动的色彩，它是彻底的中性色，依靠邻近的色彩获得生命， 灰色一旦靠近鲜艳的暖色，就会显出

《网页制作中的色彩搭配和色彩理论》由会员kms****20分享，可在线阅读，更多相关《网页制作中的色彩搭配和色彩理论》请在金锄头文库上搜索。