网页设计中的色彩搭配

赵磊 中华通信系统有限责任公司河北分公司

网页设计中的色彩搭配

赵磊 中华通信系统有限责任公司河北分公司

配色是网页设计中的关键环节，根据用户的喜好确定合理的配色方案才能吸引更多眼球。本文通过分析大量优秀网页的配色总结出一系列常用配色方法，供网页设计师作为参考。

由于互联网的快速发展，网络逐渐成为人们生活中不可或缺的部分，网页作为一种网络信息的载体也逐渐受到重视。一方面网页的发布者希望通过美观、个性的网站来吸引用户，另一方面用户也希望浏览网页的过程成为一种美的享受，介于各种人群的需求，网页设计师必须考虑从整体上来提高网页的审美价值。色彩是一种重要的视觉元素，它必然受到设计师的关注，优秀的配色方案可以提高网页的整体质量和品味，还能给用户带来方便。在进行网页的色彩设计时可以先确定大致的色彩方向，再具体进行颜色的选择和配比。

1 白背景网页的色彩搭配

白背景网页是指以白色背景为基调，没有大面积的主题色，只有小面积的色彩点缀的网页，用以突出内容或丰富视觉效果。这种色彩方案比较适合内容繁多的门户网站、购物网站等，因为繁杂的内容如果再加以复杂的配色，会导致人们找不到视觉重点，而且容易引起疲劳，也不利于信息的获取。对于这样的网站，选择了白色背景基调以后，对文字、边框、导航等的颜色选择一般以同色系为宜，一方面要符合美学原理，一方面也要考虑人机因素。具体颜色选择范围很广，也没有太多限制，主要根据网站的风格来确定。

2 暗调网页的色彩搭配

暗调网页是指以暗色调作为整个网页的背景色。暗调是一种新兴的个性艺术风格，近年来在网页设计中被广泛的应用。暗调网页一般应用于个人网站或展示性网站等。因为暗调网页与一般网页相比更具个性，因此很多追求个性化的年轻人喜欢选择暗调网页来突出自己的与众不同。此外，暗调网页作为展示用途可以说是借鉴了展示设计中的做法，以低明度的颜色作为背景突出所展示图片的色彩，让人们的目光瞬间落到图片上，而不受到网页内其它元素的干扰，暗调的目的不是为了“暗”，而是为了更加华丽的表现，合理的进行颜色搭配，可以使暗调网页达到炫目的效果，从而给人们留下深刻的印象。

如选择黑色或深灰色作为背景，主题色一般为红色、绿色或橙色，在浏览时人们很方便就能找到自己感兴趣的信息，这一类网站个性非常鲜明；以深蓝色为背景时，网页的主题色则为一系列的蓝色，在明度和饱和度上有所变化，蓝色系体现的是专业和科技感。

3 大色块搭配

所谓大色块是指在网页中，有两种或两种以上颜色，占页面的色彩比重相差不多，互为对比或呼应，成为整个页面的主要色彩成分。

大色块风格的设计其实在服装设计领域的应用已经非常成熟，其目的就是为了获得暴发性的视觉效果。介于色彩的色相和明度特性，使得大色块在网页设计中的应用不仅可以带来惊艳的画面，更加重要的是，它可以轻松解决网页的分区问题。

虽然，大色块的配色方案有诸多的好处，但撞色即对比色的应用也对设计师是巨大的考验。成功的大色块撞色搭配当然可以使网站绚丽多彩，吸引目光，但失误的搭配使网站的品质降低，使浏览者对网站的专业水准产生怀疑。在实际操作中大色块配色时一般选用蓝绿撞色，其次是黄绿撞色，红绿撞色相对较少。由于蓝色和绿色同属冷色，撞色后一方面可以达到强烈的视觉效果，另一方面也不至于过度刺激视觉而产生视觉压迫，因此应用较多；相比之下黄绿撞色和红绿撞色一般只在页面面积较小的网页设计中采用，而且对具体色相的选择也有很高要求，只有对色彩把握很熟练的设计师才能成功运用。

大色块配色如选择同色系搭配，难度就相对较小。设计师可以依照网站的风格定位来选择色系，如热情奔放型的可选择红色系。但咨询信息较多的网站，用户停留时间较长就不宜采用此类高饱和度的颜色，个人网站或产品广告类网站则可以采用。同色系大色块配色时比较保险的方法就是选择蓝色、灰色这类中性色系，虽然降低了画面的视觉冲击力，但大色块的处理能给页面带来跳跃感，摆脱呆板和单调。

4 主辅色搭配

主辅色搭配是指在一个网页中采用一种主要色调大面积使用，选择一到两种辅色作为点缀。由于前文已经阐述了白色背景和黑色背景网站的色彩搭配方式，这里的关于主辅色搭配的研究主要针对有彩色。

一般而言，主辅色搭配是选择一种颜色作为背景色，并衍生出与背景色同色系的一些装饰物，再选用一种对比色作为点缀，用作按钮、边框或小面积背景色。这类搭配的灵活性和自由度高，易于把握。常见的有蓝主绿辅、蓝主黄辅、绿主黄辅等几种。主辅色搭配时，辅色可应用于一些重点区域，以吸引用户的眼球，既可以使页面具有艺术性，也能改善网页的易用性。

在进行网页设计时参考常用的一些配色方法可以大大提高设计效率，同时使网站获得良好的视觉效果。但网站配色不仅仅是设计师的个人行为，它同时还涉及到网站性质、网站交互、用户人群定位以及时尚潮流趋势等诸多方面因素，因此需要设计师综合考虑，从而取得最佳方案。

[1]杨景林.论网页色彩设计的原则与方法[J].电脑知识与技术，2008

[2]马艳丽.谈网页设计的风格把握和色彩搭配[J].艺术研究，2008