色彩搭配在网站中的运用new

《色彩搭配在网站中的运用new》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第3章色彩搭配在网站中的应用色彩本身具有非常微妙的表现力，它们可以产生出一种刺激人们大脑中对某种形式存在的物体的共鸣，展现出对待生活的新的看法与态度。合理使用色彩扩大了设计者创作的想像空间，赋予了创作新的不定性。3.1网页配色网页的色彩搭配往往是令初学者感到头疼的问题，尤其是那些完全没有美术基础的人。对于一个商业网站而言，到底用什么样的色彩进行搭配，才能既好看又合理呢？本节将从最基础的知识开始，帮助读者掌握色彩的使用。3.1.1色彩的基本知识1．从色谱开始一条连续彩虹中的“可视光”分解成从蓝到红的

2、色谱，如图3-1所示。图3-1色谱在色谱中，线性罗列了所有的基本颜色，也是所有颜色的根本。2．色环在从红到紫的光谱中，等间的选择两种或两种以上的颜色，相邻的两个色相互混合又得到另一种特殊的颜色。如此周而复始，从而构成一个首尾相交的环，被称为孟赛尔色相环，即色环。从本质上讲，色环就是色谱可以看到的颜色所形成的线性连续环。如图3-2所示就是一个色环。图3-2色环3．三原色的概念如同大家所知道的，三原色是能够按照一些数量规定合成其他任何一种颜色的基色。所有的颜色其实都是由三原色按照不同的比例混合而来。色

3、彩的三原色为红、黄、蓝，而色光的三原色为红、绿、蓝。下面将介绍几个关于色彩的重要概念。ò色相：指颜色的属性，是红色、绿色还是蓝色。如图3-3所示，分别为同一张图片的三种色相。图3-3同一张图片不同色相ò纯度：也称作饱和度，是指在同等明度的条件下，颜色从灰色到纯色的变化。如图3-4所示为同一张图片，饱和度分别为-100、0、+100时的状态。图3-4同一张图片不同纯度ò明度：从黑到白中间增加9个均匀过渡的灰度阶段，被称为明度，也叫明度尺。如图3-5所示为同一张图片明度分别为-50、0、+50时的状态

4、。36第3章色彩搭配在网站中的应用Part1基础图3-5同一张图片不同明度篇3.1.2常见的配色方案1．近似色近似色是已给出的颜色之外的任何一种颜色。如果从橙色开始，它的两种近似色应该Part2选择红和黄。如图3-6所示，为近似色在色环上的位置。用近似色的颜色主题可以实现色彩的融洽与融合。如图3-7所示，列出了几种近似色实的搭配方案。例篇Part3图3-6近似色图3-7使用了近似色的配色方案如图3-8所示，为使用了近似色搭配方式的商业网站。蓝色系的搭配，给人以清凉、技专业的感觉。术篇图3-8使用了

5、近似色的商业网站372．补充色补充色也叫对比色，是指在色环中的直接位置相对的颜色，如图3-9所示。如果想要使网站中的色彩强烈突出、富有冲击力的话，可选择对比色。假如正在组合一幅柳丁的图片，用蓝色背景将使柳丁更加突出。如图3-10所示。图3-9补充色图3-10蓝色背景下的柳丁如图3-11所示，为使用了补充色的网站。大块的橙色和蓝色用到一起，具有强烈的冲击力，达到了视觉上的震撼效果。图3-11使用了补充色的网页3．分离补色分离补色可以由2~3种颜色组成。在色环上选择一种颜色，它的补色就在色环的另一面。

6、可以使用补色旁边的一种或多种颜色。这样的一组颜色叫做分离补色，如图3-12所示。分离补色的搭配可以起到类似补充色的强烈对比作用，但有近似色的缓冲，可以使页面效果更加柔和。如图3-13所示，为使用了分离补色搭配方式的网站。这个网站给人的感觉是色彩鲜明，但是又不会过于突出。38第3章色彩搭配在网站中的应用Part1基础图3-12分离补色图3-13使用了分离补色的网站4．组色篇组色是色环上距离相等的任意3种颜色。如图3-14所示为色环上的一组组色。Part2实图3-14色环上的一组组色例因为3种颜色形成

7、了对比关系，所以组色被用作一个色彩主题时，会对浏览者造成紧张的情绪。一般在商业网站中，不采用组色的搭配。篇3.1.3配色的选择配色是浏览者访问主页时目光无法回避的设计要素。当浏览者看到网站标题的一瞬间，Part3已经决定了配色的效果不可轻视。在不经意间，浏览者对网站的印象就被固定下来，就好比初次拜访别人家，和主人谈话之前，看到客厅的装饰风格，便可以大致推测出主人的性技格。因此，根据网站的整体风格来选定网站的配色十分重要。当网站的内容、标题和配色术一致时，就能发挥最大的效用。欢快的内容与明快的配色相

8、叠加，可以传递出发自内心的喜悦。相反，和网站内容不相配的颜色，会引起混乱、产生破坏性的效果。篇如图3-15所示，为Dior国际网站的香水产品宣传页，左图使用了金色作为网页的主色调，显得高贵、典雅，烘托出了产品的高格调和高品味。右图使用了蓝色的色调，虽然也显示出了页面的和谐，但无法表现出产品的内涵，因此让人感觉有些离题，冲淡了网页的主题。39图3-15根据网站内容确定配色本节将通过介绍几种颜色搭配方案的效果，帮助用户掌握利用颜色定位网站的技巧。1．色调的选择色调包括鲜艳的色调、柔和的