为 Web 设计时绝对必须避免的 5 种颜色选择

Web 一直在变得更加可视化。 好的内容仍然是王道，但最好将内容包装在吸引人的视觉包装中以脱颖而出。

对于设计专业人士来说，这不是什么大问题。 他们完全沉浸在色彩理论和色彩心理学中。

但是，越来越多的网络用户试图让他们的网络内容跟上网络不断增长的视觉特性，他们又会怎样呢？ 即使是那些总结色彩理论和色彩心理学的网络文章，虽然在分享设计中色彩的基础知识方面表现出色，但可能会被那些没有图形专业背景的人误解，从而导致潜在的灾难性决定。

那么，您必须绝对避免在您的网页中选择哪些颜色？

纯黑

让我们从黑色开始 - 纯黑色 - 在 HTML 中编码为 #000000。

惊讶吗？ 黑色无处不在，不是吗，就像大多数网页上的文字、无处不在的小黑裙和夜空一样？

好吧，纯黑色并不像你想象的那么常见。 真正的#000000 纯黑色实际上是一种不自然的颜色。 它在自然界中不存在。 纯黑色需要吸收所有光谱的光，而这在自然界中根本不会发生。 自然色更加混合和柔和。

因此，纯黑色不是我们的眼睛习惯看到的东西。 这很苛刻。 它很突出（这是让那件黑色小礼服如此受欢迎的部分原因）。 那么为什么不在网页设计中使用它呢？ 毕竟，涉及色彩心理学的网络文章强调它与魅力、精致、权力和权威的联系。 那些鼓励使用黑色的文章有错吗？

他们一点都没有错。 黑色可​​以用来在人们的脑海中激起一些强大的积极联想。 关键是使用不是纯黑色的黑色。

因为纯黑色不是自然色，大脑更难处理。 将您的黑色从 #000000 提升到 #111111 或类似的非常深的灰色，您仍然可以获得黑色的引人注目的好处，而不会给访问者的大脑带来太多压力。

界面元素中的霓虹色

霓虹色虽然引人注目，但也有同样的压倒大脑的倾向。 作为自然界中不出现的颜色，它们对大脑来说是陌生的，并且比更柔和、混合的颜色更难处理。

将令人瞠目结舌的霓虹色保存为图形亮点，使您的视觉内容更流行，而不是在您的界面元素中。 并确保您不仅使用它们来吸引对图形的注意，而且将访问者的注意力吸引到关键信息所在的页面部分。

换句话说，将霓虹色远离文本将叠加在其上的背景，例如主文本、侧边栏、导航功能区或按钮的背景。

使用更自然、轻微混合的颜色作为文本内容的背景，更容易在眼睛上看到。 作为文本或文本背景的霓虹色往往会使眼睛疲劳。 这可能会给网站及其提供的内容留下潜意识的负面印象，这是您最不想要的。 您想让访问者对您的业务产生积极的感觉。

涵盖要避免的前两种颜色选择的一般规则是避免在 HTML 编码中具有色谱极端特征的颜色 - 零和 F，尤其是在文本和文本背景中。 将它们稍微远离不自然的绝对纯色，它们将更容易被大脑处理，并给访问者留下更良好的印象。

对比度过高的组合

除了避免过于纯正的颜色外，还要注意某些颜色的组合。

尽管红色和绿色是圣诞节的主食，但它在网站设计中带来了许多问题——以至于设计师之间的一首小诗写道：“永远不应该看到红色和绿色，中间没有颜色”

这是因为大脑处理这两种颜色的方式。 红色是最温暖的颜色，可以刺激大脑的活动。 这是最容易引起我们注意的颜色。 红色搅动大脑。

另一方面，绿色注册为冷色。 它使大脑平静。 将两者放在一起会使大脑处于处理视觉的不舒服位置，同时试图激发和平静它。 它使大脑陷入冲突。 这不利于给人留下好印象。

与上述在文本或文本背景中使用霓虹色一样，同时使用红色和绿色会给访问者留下与产品本身无关的负面潜意识印象。 相反，这种负面印象来自处理冲突颜色的内部不适。

红色和绿色还有第二个问题。 在西方世界的文化中，人们习惯于将红色与停止或否联系起来，将绿色与进行或是联系起来。 再次，它迫使大脑处理一组相互矛盾的输入，使大脑感到不舒服。 当大脑不舒服时，它会将那种不安的感觉转移到你的提供上——根本不是你想要的。

虽然没有那么极端的对比，但同样的原则适用于红色和蓝色的组合，并且在较小程度上也适用于所谓的二次色，即紫色、绿色或橙色的任何组合。

红色和蓝色在非常温暖的颜色和非常冷的颜色之间产生冲突。 二次色是原色的混合色（紫色是红色和蓝色的混合色，绿色是蓝色和黄色的混合色，橙色是黄色和红色的混合色）根本不能很好地混合。 这些组合中的任何一种都太强大了，大脑无法舒适地处理。

再次，争取更自然、混合的颜色，避免使用色轮上直接相对的颜色或在温暖和凉爽方面相反的颜色所带来的大脑疲劳组合。

对比度过低的组合

但是，这并不意味着您应该只使用在色调（颜色）和值（相对暗度）方面几乎相同的颜色。 你也可以朝那个方向走得太远，给访客带来不同类型的问题。

在白色背景上放置浅色文本，例如白色背景上的粉红色或黄色或浅蓝色或淡紫色，会使访问者难以辨认文本内容。 深色背景上的深色文本也是如此，例如黑色上的红色或宝蓝色或洋红色。

其他特定的不良组合是绿色配黄色或黄色配绿色，以及带有黑色、蓝色或洋红色的红色背景。 您不仅冒着色盲访问者可能根本看不到任何文字的风险，而且还会激怒非色盲访问者，让他们紧张地阅读您所写的内容。 我们在这里不是在谈论潜意识印象。 我们正在谈论他们有意识地对您使您的网站如此难以阅读而感到恼火。

当您将文本叠加在图像上时，此错误尤其普遍，例如在页面顶部的大标题图像中。 始终确保您的所有文本在您的标题图像上都能清楚地阅读，而不仅仅是大部分。

多色背景

为网页设计师提供免费纹理背景的网站比比皆是，您可能会觉得它们会让您的网站脱颖而出。 但是，如果您选择使用一个，请小心。 带纹理的背景会冒着忙碌的风险，从而分散访问者对您的内容的注意力。 与将文本叠加在图像上一样，您面临着文本在纹理背景中丢失的危险。

在选择带纹理的背景时要小心。 避免使用早期互联网时代流行的刺眼、撞色背景。 这些背景通常由微小的重复设计组成，具有明亮、冲突的颜色，文本很容易丢失。

今天的趋势是一种微妙、自然的外观，让您的背景有一种深度感，而不会分散注意力。 网站调色板的一般经验法则是使用不超过三种颜色，绝对不超过四种。

在使用纹理时要小心谨慎的同样警告也适用于渐变（背景颜色或暗度从背景的一部分逐渐变化到另一部分的图形元素）。 避免将它们用于页面上的多个文本块。 并避免使用包含文本颜色的渐变，以免您的文本在渐变中丢失。 始终将您的文本放置在框或背景的清晰区域中，并与其他视觉元素留出足够的空间，以便您的文本清晰地突出。

结论

为网站选择颜色显然不仅仅是挑选您喜欢的颜色或您在另一个网站上喜欢的一组颜色。 它涉及的不仅仅是从在线文章中获取孤立的推荐，因为无需了解更多信息即可了解颜色选择。

颜色是说服力非常强大的工具。 小心使用，它可以帮助访问者采取您希望他们采取的行动。 如果使用不慎，它可能会让访问者对您的业务产生一种模糊的不安感，甚至让他们有意识地对您网站的使用困难感到恼火。

将您的颜色选择集中在易于大脑使用的颜色上，并继续学习如何选择可以很好地协同工作的颜色，您将很好地设计一个您的颜色与您的所有其他元素协同工作的网站网站来实现您的目标。