论文部分内容阅读
摘 要：用户在浏览网页时，能够留下第一印象的并不是丰富的网站内容，也不是层次分明的版面布局，往往是网页色彩传递出来的视觉效果。所以网站设计的成败与否，从某种意义上来讲，是网页色彩的综合运用与搭配问题。本文主要从网页色彩搭配的原则和技巧入手，着重介绍和研究网页色彩搭配的几种实用方案。
关键词：色相环；色调；暖色调；冷色调；无色系；有色系
中图分类号：TP3 文献标识码：A
文章编号：1009-0118（2012）07-0235-02
一、网页设计色彩的搭配原则
（一）适用性原则
设计网站要根据不同类型、不同读者群以及不同性别选择最合适的色彩，才能最大限度提高网站的表现效果。例如，食品类网站应选择能激起人们食欲的颜色来展现，所以多选择橙色系；另外，不同地区、不同文化与不同年龄层对颜色的反应是有所不同的。比如在亚洲，红色代表婚姻、繁荣、快乐，而在南非，红色是丧服的色彩。所以你在应用某种色彩之前，要好好调查一下这种色彩在特定地区或是特定文化下带给人们的联想，否则，可就会起到反作用。另外，由于不同年龄层思维的差异、审美习惯的差异，设计网页时也要考虑好该网站的主要读者群的年龄，比如年轻族群一般比较喜欢色彩鲜艳的饱和色，但这样的颜色却引不起高年龄层的兴趣。还有，根据男女性别的差异性，男性网站多使用冷色调，而暖色调多适合女性网站，能够表现出女性可爱、温柔、亲切的特性。
（二）要注意时效性和独特性
要想让设计出来的网站迅速抓住浏览者的眼球，应该在不脱离适用性原则的情况下，突出该网站的个性和特点。另外，同一个色彩很容易就充斥着整个市场，且浏览者很快的就对流行色彩感到麻木；但我们不妨从另外一个角度考虑，你可以使用几十年前的流行色彩，引起人们的怀旧之情。
（三）整体协调平衡性原则
1、注意整个画面的色调问题。你设计的网页是要表现严肃、稳重或是温暖或是充满生机等就是由你网页的基调决定的。一般来说，你采用的颜色的色相、明度、纯度关系不一样或色块面积大小不一样就会表现出不同的感觉。比如：你采用暖色系的颜色则表现出温暖的感觉，而采用冷色系的颜色则表现出冷清、平静的感觉；以明度高的色为主色调则亮丽轻快，以明度低的色为主色调则显得庄重、平稳。
2、颜色的平衡问题。颜色的平衡就是颜色的强弱、轻重、浓淡这种关系的平衡。一般我们可以通过调整图形的形状和面积的大小或是加入无色系来使画面色彩调和。一般同类色配色比较容易平衡。而对比色且明度也相似的纯色配色，比如：蓝和橙的配色，会因过分强烈感到冲突而使画面不协调。我们这时可以调整两者色彩的面积比例使一种色块缩小，另一种色块变大或加黑白灰，改变其明度和纯度并取得平衡，就可以使画面色彩平衡。纯度高而且强烈的色与同样明度的浊色或灰色配合时，如果前者的面积小，后者的面积大也可以达到平衡。
二、实用配色方案
（一）使用邻近色
可见光可以分解为从蓝色到红色的彩虹光谱带。而色相环是在红黄蓝三原色基础是混合生成的，色环通常包括12种不同的颜色。如图1所示。而邻近色是色相环上任一颜色同其毗邻的颜色互称为邻近色。例如红色和橙色，绿色和蓝色互称为邻近色。
在网页设计中经常使用邻近色，它的特点是使画面统一和谐，富有层次，在使页面稳重的同时又不失活力，可以说是一种非常常用的配色类型。
在网页中应用邻近色时，要注意色块的大小和位置。不同亮度的颜色会影响人们的视觉感受，一般来说，颜色重也就是低亮度的颜色会显得面积小，颜色浅也就是高亮度的颜色会显得面积大。
所以在实际应用中，在色彩面积大小和位置上要做好设置。一般位置选在页面的黄金分割线左右，忌选择等面积的颜色色块，在大小上可以选择主色调颜色为大面积色块，次色调颜色为小面积色块。
（二）使用同类色
同类色指同一色相，不同明度的颜色。即两色属于同一颜色，只是深浅、明暗不同。如红色、暗红、紫红等。先选定一种色彩，然后调整其明度，用于网页中不同位置可营造层次感，使网页整体色调统一协调。
但同类色有时会显得单调，缺乏生气。如果添加少许色相环上相邻或是相对色系，画面就会活跃、生动起来。
（三）使用对比色
1、冷暖色调的对比
红、橙、黄等被称为暖色。暖色调给人温暖、舒适和活力的感觉，因此在网页设计中可以突出视化效果。青，蓝，紫都属于冷色系，冷色调可以给人明快、硬朗的感觉。
2、互补色的对比
在色相环上相差180°的两种颜色是互补色。比如红和绿、蓝与橙、黄与紫等。一般前两种对比色实际应用比较多。
使用对比色这就要把握“大调和，小对比”这一个重要原则，即总体的色调应该是统一和谐的，局部的地方可以有一些小的强烈对比。另外，要是大面积使用，可以考虑加入无色系的黑白灰，可使页面协调统一。还要考虑整个页面的基本色调，是以暖色调为主还是以冷色调为主，不要偏离了主题色调。还要注意对比色间的比例变化，选择一种颜色为主色而另一种颜色为副色，放在一起视觉冲击力很强。例如红和绿搭配，会使红色显的更红，而绿色显的更绿，二者是互斥的，但恰当控制二者色块比例的大小，比如让绿色块多红色块少，就降低了色彩的冲击力，起到“红花绿叶”的效果。
（四）使用无色系
一般把色彩分为有色系和无色系。黑白灰属于无色系，其他的色彩都属于有色系。单独使用无色系制作的网页很少，一般无色系和有色系结合使用的较多，无色系（黑白灰）几乎与所有的有色搭配都不会冲突，一般来说，无色系与有色系的搭配主要目的是强调主体或是控制画面色彩平衡。
若网页是以两种高纯度的颜色为主，画面就会显得颜色纯度过高，缺乏对比和层次，有些混乱，色彩失去平衡，这时，就可以在画面中加入黑白灰来对网页中的色彩进行控制，使画面富有层次。
三、色彩搭配的注意问题
（一）忌单一——单一颜色让人感觉单调、乏味。忌多——让人感觉轻浮，花俏。忌粉——颜色浅固然显的干净，但如果对比过弱，整体显得苍白无力了。蓝色忌纯，绿色忌黄，红色忌艳。
（二）图形色和文字色要和底色有一定的对比度。一般要突出文字色和图形色，让其能吸引浏览者的注意力，切忌底色过分突出，喧宾夺主。
（三）恰当的品牌联想，基于企业品牌标识色系或产品色系所营造的配色方案能够有效引起访问者对于品牌和产品的联系、共鸣。
（四）配色要有重点色。有一种主色贯穿其中，主色并不是面积最大的颜色，而是最重要，最能揭示和反映主题的颜色，就是重点色。选择重点色要注意以下几点：重点色应该选择比其他的色调更强烈的色。重点色应该选择整体色调的对比色。重点色只需起到点睛作用，不要大面积使用。选择重点色必须考虑与整体色调的协调和平衡问题。
参考文献：
［1］周艺文.Photoshop网页设计艺术［M］.北京:清华大学出版社,2006.
［2］黎芳.网页设计与配色实例分析［M］.北京:兵器工业出版社,2006.
关键词：色相环；色调；暖色调；冷色调；无色系；有色系
中图分类号：TP3 文献标识码：A
文章编号：1009-0118（2012）07-0235-02
一、网页设计色彩的搭配原则
（一）适用性原则
设计网站要根据不同类型、不同读者群以及不同性别选择最合适的色彩，才能最大限度提高网站的表现效果。例如，食品类网站应选择能激起人们食欲的颜色来展现，所以多选择橙色系；另外，不同地区、不同文化与不同年龄层对颜色的反应是有所不同的。比如在亚洲，红色代表婚姻、繁荣、快乐，而在南非，红色是丧服的色彩。所以你在应用某种色彩之前，要好好调查一下这种色彩在特定地区或是特定文化下带给人们的联想，否则，可就会起到反作用。另外，由于不同年龄层思维的差异、审美习惯的差异，设计网页时也要考虑好该网站的主要读者群的年龄，比如年轻族群一般比较喜欢色彩鲜艳的饱和色，但这样的颜色却引不起高年龄层的兴趣。还有，根据男女性别的差异性，男性网站多使用冷色调，而暖色调多适合女性网站，能够表现出女性可爱、温柔、亲切的特性。
（二）要注意时效性和独特性
要想让设计出来的网站迅速抓住浏览者的眼球，应该在不脱离适用性原则的情况下，突出该网站的个性和特点。另外，同一个色彩很容易就充斥着整个市场，且浏览者很快的就对流行色彩感到麻木；但我们不妨从另外一个角度考虑，你可以使用几十年前的流行色彩，引起人们的怀旧之情。
（三）整体协调平衡性原则
1、注意整个画面的色调问题。你设计的网页是要表现严肃、稳重或是温暖或是充满生机等就是由你网页的基调决定的。一般来说，你采用的颜色的色相、明度、纯度关系不一样或色块面积大小不一样就会表现出不同的感觉。比如：你采用暖色系的颜色则表现出温暖的感觉，而采用冷色系的颜色则表现出冷清、平静的感觉；以明度高的色为主色调则亮丽轻快，以明度低的色为主色调则显得庄重、平稳。
2、颜色的平衡问题。颜色的平衡就是颜色的强弱、轻重、浓淡这种关系的平衡。一般我们可以通过调整图形的形状和面积的大小或是加入无色系来使画面色彩调和。一般同类色配色比较容易平衡。而对比色且明度也相似的纯色配色，比如：蓝和橙的配色，会因过分强烈感到冲突而使画面不协调。我们这时可以调整两者色彩的面积比例使一种色块缩小，另一种色块变大或加黑白灰，改变其明度和纯度并取得平衡，就可以使画面色彩平衡。纯度高而且强烈的色与同样明度的浊色或灰色配合时，如果前者的面积小，后者的面积大也可以达到平衡。
二、实用配色方案
（一）使用邻近色
可见光可以分解为从蓝色到红色的彩虹光谱带。而色相环是在红黄蓝三原色基础是混合生成的，色环通常包括12种不同的颜色。如图1所示。而邻近色是色相环上任一颜色同其毗邻的颜色互称为邻近色。例如红色和橙色，绿色和蓝色互称为邻近色。
在网页设计中经常使用邻近色，它的特点是使画面统一和谐，富有层次，在使页面稳重的同时又不失活力，可以说是一种非常常用的配色类型。
在网页中应用邻近色时，要注意色块的大小和位置。不同亮度的颜色会影响人们的视觉感受，一般来说，颜色重也就是低亮度的颜色会显得面积小，颜色浅也就是高亮度的颜色会显得面积大。
所以在实际应用中，在色彩面积大小和位置上要做好设置。一般位置选在页面的黄金分割线左右，忌选择等面积的颜色色块，在大小上可以选择主色调颜色为大面积色块，次色调颜色为小面积色块。
（二）使用同类色
同类色指同一色相，不同明度的颜色。即两色属于同一颜色，只是深浅、明暗不同。如红色、暗红、紫红等。先选定一种色彩，然后调整其明度，用于网页中不同位置可营造层次感，使网页整体色调统一协调。
但同类色有时会显得单调，缺乏生气。如果添加少许色相环上相邻或是相对色系，画面就会活跃、生动起来。
（三）使用对比色
1、冷暖色调的对比
红、橙、黄等被称为暖色。暖色调给人温暖、舒适和活力的感觉，因此在网页设计中可以突出视化效果。青，蓝，紫都属于冷色系，冷色调可以给人明快、硬朗的感觉。
2、互补色的对比
在色相环上相差180°的两种颜色是互补色。比如红和绿、蓝与橙、黄与紫等。一般前两种对比色实际应用比较多。
使用对比色这就要把握“大调和，小对比”这一个重要原则，即总体的色调应该是统一和谐的，局部的地方可以有一些小的强烈对比。另外，要是大面积使用，可以考虑加入无色系的黑白灰，可使页面协调统一。还要考虑整个页面的基本色调，是以暖色调为主还是以冷色调为主，不要偏离了主题色调。还要注意对比色间的比例变化，选择一种颜色为主色而另一种颜色为副色，放在一起视觉冲击力很强。例如红和绿搭配，会使红色显的更红，而绿色显的更绿，二者是互斥的，但恰当控制二者色块比例的大小，比如让绿色块多红色块少，就降低了色彩的冲击力，起到“红花绿叶”的效果。
（四）使用无色系
一般把色彩分为有色系和无色系。黑白灰属于无色系，其他的色彩都属于有色系。单独使用无色系制作的网页很少，一般无色系和有色系结合使用的较多，无色系（黑白灰）几乎与所有的有色搭配都不会冲突，一般来说，无色系与有色系的搭配主要目的是强调主体或是控制画面色彩平衡。
若网页是以两种高纯度的颜色为主，画面就会显得颜色纯度过高，缺乏对比和层次，有些混乱，色彩失去平衡，这时，就可以在画面中加入黑白灰来对网页中的色彩进行控制，使画面富有层次。
三、色彩搭配的注意问题
（一）忌单一——单一颜色让人感觉单调、乏味。忌多——让人感觉轻浮，花俏。忌粉——颜色浅固然显的干净，但如果对比过弱，整体显得苍白无力了。蓝色忌纯，绿色忌黄，红色忌艳。
（二）图形色和文字色要和底色有一定的对比度。一般要突出文字色和图形色，让其能吸引浏览者的注意力，切忌底色过分突出，喧宾夺主。
（三）恰当的品牌联想，基于企业品牌标识色系或产品色系所营造的配色方案能够有效引起访问者对于品牌和产品的联系、共鸣。
（四）配色要有重点色。有一种主色贯穿其中，主色并不是面积最大的颜色，而是最重要，最能揭示和反映主题的颜色，就是重点色。选择重点色要注意以下几点：重点色应该选择比其他的色调更强烈的色。重点色应该选择整体色调的对比色。重点色只需起到点睛作用，不要大面积使用。选择重点色必须考虑与整体色调的协调和平衡问题。
参考文献：
［1］周艺文.Photoshop网页设计艺术［M］.北京:清华大学出版社,2006.
［2］黎芳.网页设计与配色实例分析［M］.北京:兵器工业出版社,2006.