一份简单明了的网页设计用色指南

事实上，今天网页设计中的配色和配色方法是一件非常有趣和值得思考的事情。虽然绝大多数网站看起来非常相似，但巧妙的颜色使平庸的网站看起来非凡。

事实上，我不想说一些革命性的颜色技能或一个新的发现，但绝大多数网站的颜色匹配看起来非常相似。那么，颜色匹配的意义是什么呢？如果世界上所有的网站都使用丰富多彩的颜色匹配，那么就不会有任何网站从中脱颖而出。当然，今天的网页设计行业已经非常接近这种情况了。从这个角度来看，柔和的颜色将更容易让用户闪耀。

用颜色引导用户注意力

在布局设计之初，绝大多数网站通常使用简单的黑白灰色、白色背景+黑色文本。在这种情况下，颜色将起到强调和突出的作用，可以引导用户注意按钮、标题和链接。

以Vibrant的网页设计为例。他们的主页背景和图像是黑白的，但标志、按钮和汉堡图标都是闪亮的黄色，可以很快吸引用户的注意力。

Takeit的页面设计也是如此。整个屏幕的蓝色背景使白色网页元素非常明显。白色标题是视觉焦点，然后用户会注意到标题周围的应用程序 Store按钮，LOGO和汉堡菜单。

这些案例都讲述了如何用颜色来吸引用户的注意力。

创造个性

色彩之初，可以为网站或品牌设定基调，营造情感，传达情感。Beagleis为用户提供项目介绍服务，其网站配色采用自然色。当你向下滚动时，背景色会从绿色变成棕色、深灰色甚至粉色。自然色能给人优雅专业的感觉，给人留下深刻的印象。

An interesting Day是一个网站，旨在“在奥斯陆峡湾岛上举行为期一天的奇怪小型会议”。在黄色背景上使用红色文字的网站很少见。有了个性化的图片，整个网站的所有设计元素都在为你阐明“奇怪”的特点。

用色彩发声

用颜色说话，做自己网站的声明，比简单的“吸引用户”更有趣。为了吸引用户的注意力，颜色足够突出，但更重要的是，这种颜色足以为你“做声明”。你不能随意选择一种明亮的颜色，这种颜色也符合你的精神，想要传达一种独特的情感。

以Gaga为例 例如，当你打开网站时，明亮的粉色会让你的眼睛明亮。在“交响乐”的主题下，用户对网站风格的期望是平静的色调，但明亮的粉色不再低调优雅，但它符合交响乐充满活力、乐趣和创造力的特点，所以这里明亮的粉色符合逻辑，也为设计师“说话”。

增强凝聚力，引导用户流程

颜色也可以用来引导用户进行用户过程。就像上面的Takeit案例一样，颜色会引导用户的眼睛，但不会使用太激烈的搭配。微妙而有凝聚力的配色方案会让用户更舒适，引导效果更好。颜色相互衬托，创造出独特的品牌视觉，也构成了用户的视觉路径，吸引他们观看。

比如著名的生产力工具Dropbox和Marvel也是这样配色的，尤其是Dropbox。两种工具都以蓝色为主色调，绿色、橙色、红色搭配。整个近似色和对比色都有，几种颜色在一起会给人一种很好的搭配感。

Innovation Project Canvas 情况略有不同。设计师使用简单的绿色来指导用户浏览。网页上没有使用更多的颜色，但童燕很好地完成了极具凝聚力的色彩设计。

图片中的颜色

使用图片中的颜色来构建颜色匹配是一种非常有趣的颜色技能，UI元素并不是网页中唯一可以设计的颜色。大图片背景和高清产品图片的流行使图片颜色成为整个设计中不可忽视的组成部分。通过合成图片将颜色注入到设计中也是一个很好的选择。

CartoDB是一个有趣的应用程序，可以可视化位置数据，那么有什么比真实地图更直观和美丽呢？所以它出现在网站的主页上，以最视觉的方式呈现自己的产品，让颜色为产品代言。

说到产品，ETQ也让产品的优先级超过了UI。在极简主义网站设计风格下，配色方案显然延续了自己产品的配色。设计师将产品本身作为视觉焦点。虽然并非所有的鞋子都是五颜六色的，但他们仍然试图使配色与尽可能多的产品兼容，这也是以产品为中心的真正意义。

并非所有网站都需要显眼的色彩

并不是所有的网站都需要明亮的颜色。仍有许多独特的网站使用经典的黑白灰色作为配色方案，这些中性颜色也很好地呈现了他们的情感。

Visual Soldiers和Tomasz Wysocki的网站是这样的，优雅而有能力的色调是它们的基因。简洁的布局和独特的品牌定位，使它们不需要明亮的颜色来呈现CTA按钮和角落菜单，安静的白色和黑色就足够了。

结语

色彩强大，会以各种方式融入设计。除了强大的视觉特征外，它们还具有良好的功能，引导用户，增强凝聚力，展示风格，传递信息，勾勒个性，甚至赋予设计意义。

你需要考虑颜色的多少，了解网页设计中颜色的程度，熟悉每种颜色的个性，以及如何在复杂的噪音和广阔的世界中找到自己的位置。