网页色彩搭配中深色背景的应用

时间：2020-10-03 11:26:54 色彩培训我要投稿

网页色彩搭配中深色背景的应用

　　随着信息化时代的快速到来，网页设计师已经成为了一门新兴职业。简单机械的将信息罗列在一起的页面不再能满足人们的审美需求，那些依靠未加修饰的图片和随意使用的色彩制作出来的页面，在没有欣赏价值的同时，也逐渐失去了用户群。所以，越来越多的网站开始注重页面的视觉效果，他们将计算机技术与艺术设计结合起来，在保证网站具有实用性的同时，也使页面看上去更美观、更舒适。

　　在艺术创作中，无论哪一个门类都离不开色彩，合理的使用颜色能够让平淡无味的画面瞬间变得精彩。因此，色彩也被看做是设计中重要的一个因素。网页的色彩设计是影响网站页面效果的关键因素之一，它可以影响用户对网页性质的判断，对站点信息的理解，为页面效果注入了生机和活力。所以说，一个好的网页设计离不开对色彩的研究和使用。

　　在网页色彩的设计中，从色彩构成中“色相”的概念出发，可大致将网页色彩的搭配方法归纳为以下几种：

　　其一，同色系色彩搭配。即利用同一色相的不同明度、纯度的变化来进行配色组合，例如柠檬黄、中黄和土黄的搭配，这些色彩由于色相的统一，所以在页面中很容易调和。

　　其二，邻近色搭配。即色相环上相邻近的颜色，如绿色和蓝色，红色和黄色等。这种方法与“同色系色彩搭配”相比能产生相对丰富的画面效果。

　　其三，互补色搭配。在色相环中，处于直径位置的两色为互补色，如蓝色与橙色，红色与绿色，紫色与黄色。互补色组合在一起使用时，会呈现强烈的相互辉映的视觉效果，具有很强烈的视觉冲击力。

　　其四，对比色搭配。如紫色与绿色，蓝色与黄色等。这种方法搭配出来的颜色由于色彩反差较大，所以需要第三种调和色来协调画面。

　　在色彩构成中，从“明度”的概念出发，还可以将网页色彩分为高明度，中明度、低明度等类型，在这其中，低明度深色背景风格的网页产生的视觉效果更为独特，也颇受欢迎。在互联网中所能看到的深色背景的知名网站比比皆是，比如：nike.com，香奈儿官网，Louis Vuitton网站等。

　　作为网页设计工作者，有必要了解深色背景设计的风格特点，知道它所适用的范围，并不断探寻它在使用中的技巧和规律。

　　一、深色背景网页的风格特点

　　深色背景并非指黑色，它包含了一切明度较低的色彩，可以是深红色、深蓝色、深灰色或者其他任何一种低明度色彩，它可以有自己的色彩倾向，只是在明度上偏暗而已。

　　这种色调给人的感觉是沉稳的、有力量的、庄重的、神秘的。因为它是一种明度较低的色彩，所以比较容易起到衬托作用，因此能够与许多种色彩构成良好的对比调和的关系，是最有力的搭配色。所以，在很多应用深色背景的网站中，我们经常能够看到深底色与一些辅助颜色的搭配。辅助色可以在瞬时间打破页面的沉闷感，引起浏览者的注意。

　　深色背景的合理运用能散发出一种高品位高格调的气息，具有极强的视觉冲击力。无论页面上使用的辅助色彩是何种色调，也不管它们的纯度或对比度，只要有深底色这一有力的色彩作为主色调去调和，那么页面配色上都能够达到和谐统一的效果。

　　二、适合使用深色背景的网站类型

　　深色背景的设计可以应用在许多网站上，但并不是所有的主题都适用，这种风格应该与网站的性质相搭配。由于深色背景明度较低，给人的心理感觉也较理性、沉稳，所以他多被用在一些男性网站上，如：YOKA男士网，Allcoolmen.com，Trendscar.com.等专为男性服务的网站。

　　其次，深底色与高明度色彩的搭配通常可以表现出比较时尚的视觉效果，结合一些光感技巧，可令展示的产品更有质感。因此，这种搭配也常被用于一些时尚的、优雅的、比较现代的页面设计之中，如：香奈儿官网，nike.com，blackberry中国官网、淑女屋服饰官网等。

　　此外，深底色也适用于一些比较有创意性的网站，比如设计公司或者一些张扬个性的团体（如摇滚乐队）或个人的网站。

　　但对于一些包含众多内容与服务项目的大型门户网站（如搜狐、雅虎、腾讯门户网）来说，清新简洁是页面的要点，所以这种深色的设计显然不是明智的选择，要尽可能的避免。

　　三、深色背景在网页设计中的应用技巧

　　与浅色背景的网站相比，深色背景的网站更具吸引力，因此也拥有着相当一部分的拥护者，他们喜欢深底色网站带来的时尚感。对设计工作者而言，这意味着在设计过程中，有更多的色彩可供选择，但同时，也要有能力解决使用这种深底色配色方法时所产生的.问题，要为客户或用户群创建出更有效的深底色设计，那么，在使用这种色彩搭配时，应该注意哪些方面？

　　（一）注意文字的辨识度与可读性

　　文字的辨识度是指文字在界面上出现时，用户能否顺利的进行正常阅读，在阅读的过程中是否会感觉到吃力或者眼部不适。

　　在深底色设计中，容易造成眼睛疲劳，过高的对比度（如黑底白字）会刺激人的双眼，长时间阅读会造成用户眼睛不适，从而影响阅读。过低的对比度（如深灰色底与中灰色文字）由于背景与文本的对比不够强，会导致文字不够清晰，让人无法正常顺畅的浏览信息。所以，在使用深底色设计时，文字与底色的对比度成了重中之重，寻找到背景暗度与文字亮度的平衡点，是解决文字辨识度问题的关键所在。

　　在通常情况下，为了提高文字的辨识度和可读性，设计师会尽量避免使用过高或过低的对比度，往往会用深灰色代替黑色，用浅灰色代替白色等方法来找到底色与文本之间的一个平衡点。

　　（二）合理使用留白

　　国画中的“计白当黑”的方法在设计领域中也得到了广泛的认可和应用，此处的“白”并不是指白色，而是指“留白”或“空白”，有效的利用留白，在任何的艺术创作中都是重要的，尤其在深色背景的设计中，显得更为重要。

　　深色背景给人神秘感的同时，也会让人感觉压抑、沉闷，在这种情况下，除了利用辅助色打破页面的沉闷感之外，留白的使用会更有效的解决这个问题。

　　（三）选择合适的辅助色

　　由于深底色具有强烈的视觉冲击力，所以在为它选择辅助色的时候就要尽量使用简洁的色彩组合，使用一种或两种辅助色即可。如果为了产生更丰富的效果，可以选择同色系的颜色，这样的搭配方法，无论辅助色使用多少种不同明度或纯度的颜色，由于他们处在一个色调之中，所以也不会产生混乱之感。

　　用过多的不同色相的色彩来做深底色的辅助色并不合适，过多的颜色会让页面显得花哨，杂乱无章，同时也不够沉稳大气。如果一定要使用多种色彩作为辅助色，那么务必要减少其在页面中的使用面积，以达到平衡画面的效果。

　　（四）适当的使用光影效果

　　在一些较为时尚或现代的页面中，常会使用深底色的设计，与之同时出现的除了一些合理的辅助色之外，也经常会看到光影效果的使用，比如奢侈品牌Louis Vuitton的网站，背景色选用了高贵沉稳的深褐色，在页面的左下角使用了一点高光效果，这种设计方法使深底色页面产生了通透感。

　　当然，光影的使用不仅仅局限于此，它可以是导航上的一个泛光，也可以是背景中某个局部的光晕，或者是一束淡淡的光线。它可以有无限多的表现形式，但目的只有一个，就是服务于页面。这种看似无关紧要的一个效果的使用，对整个页面视觉美感的提升却有着不可小觑的作用，在打破页面沉闷感的同时，也提高了网站的质感。

　　由此可见，网页的设计离不开色彩，当用户第一次浏览网站的时候，给人们留下第一印象的不是网站的内容和布局，而是网站的色彩。色彩会影响到用户对内容的判断，可以说，一个网站设计的成功与否，很大程度上取决于设计者对色彩的搭配和使用。

　　深底色背景的设计又是网页色彩搭配技巧中较为特殊的方式，它既可以让你的页面呈现出美妙的视觉效果，又会产生一些新的问题需要思考和解决，所以，这是一门学不完的课程。在使用深色背景设计时可以遵循一定的规律，运用色彩知识科学合理的设计网页的色彩。但同时，也要不拘一格，大胆创新，这样才能够使作品具有独特的艺术风格和良好的视觉效果。

【网页色彩搭配中深色背景的应用】相关文章：