颜色的存在不仅使您的网站看起来漂亮。颜色有一个更重要的功能-使您的网站可用。这就是为什么设计师在选择网站的颜色时，必须始终把可读性放在第一位，而美放在第二位。我们还将讨论使用的工具，所以请继续关注。

当您考虑到可用颜色的数量时，似乎很容易挑选出一组可以很好地组合在一起并具有可读性的颜色。如果你坚持使用经典的背景颜色，如白色(FFFFFF)，或非常浅灰色(f5f5f5，FAFAFA，FCFCFC等)。和前景颜色，如黑色(000000)，或非常深灰色(080808，050505，030303等)，或最轻/最暗的主要颜色(即红色，绿色，蓝色或任何颜色，你正在使用)，你可能会想，为什么可读性是一个问题。

然而，迟早你会厌倦这些经典的组合，每个人都在使用，你会想要一些更时尚的东西。

这就是你的问题开始的地方。这些更时尚的组合在美学上可能是令人愉悦的，但就可读性而言，它们不一定是赢家。当然，没有人说要在一组常用的组合之外找到好的组合是不可能的。有了正确的工具，我将在本文中提到，找到具有良好可读性的颜色变得更加容易。然而，在我们使用工具之前，让我们回顾一下颜色和可读性的一些基本知识。

颜色亮度由以下公式决定：

((Red value X 299) + (Green value X 587) + (Blue value X 114)) / 1000

注意：这个算法是从一个将RGB值转换为YIQ值的公式中提取的。这个亮度值给出了一种颜色的感知亮度。

色差由下列公式决定：

(maximum (Red value 1, Red value 2) - minimum (Red value 1, Red value 2)) + (maximum (Green value 1, Green value 2) - minimum (Green value 1, Green value 2)) + (maximum (Blue value 1, Blue value 2) - minimum (Blue value 1, Blue value 2))

色亮度差的范围是125。色差的范围是500。

这些公式看起来很神秘，很难理解，但是当您使用一个为您计算值的工具时，例如颜色对比工具，如果您选择的颜色是否通过测试，您很容易得到答案。

但是，除非你想要重新发明轮子，寻找亮度和差异都很好的颜色组合，否则你可以坚持已经为你开发的安全选择，比如光线背景上的深色文本。

金色经典：灯光背景下的黑暗文本

所有相同的，黑暗的文本在一个轻的背景提供了最好的可读性。当然，这取决于您选择的颜色，但在白色上使用黑色时，可读性最高：

正如您从上面的屏幕截图中看到的，可读性取决于字体大小(很明显，字体本身也是如此)，一个好的工具会告诉您，您所选择的组合是否只适合标题，还是对标题和正文文本都有好处。

一般来说，字体大小越大，它的可读性就越强。不要太依赖于这一点，因为正如你所知道的那样，身体文本10-14是使用最多的大小(即相对较小)杭州金年会棋牌官网 费用多少，这意味着对于正文文本来说，你将无法使用标题可读的颜色。

黑色加白色并不是唯一的好组合。如果您想在使用白色作为背景颜色时看到更多优秀到良好对比的示例，请查看本文中的第一个表。

白色背景是相当常见的，但有时你会想要更多的颜色。例如，一些浅色的红色，绿色，黄色，蓝色等。制作伟大的背景时，使用黑色或其他非常深的前景颜色。这些组合不像使用黑色时那样可读性好，但比例仍然很好。

以下是背景颜色与白色不同，前景颜色与黑色不同的组合示例：

用于不同的背景和前景

许多设计师用来使页面更易读(也更令人赏心悦目)的一个小窍门是为背景使用渐变。一个渐变的白色和一个非常苍白的颜色的任何其他颜色工作最好。

嗯，你不能用可读性公式来测量它的亮度和对比度，但是如果构成渐变的两种颜色分别有很好的可读性值，那么结合起来，结果就更好了。

黑暗背景的错综复杂

黑暗的背景是非常令人沮丧的-这不仅是因为黑暗的颜色传统上与生活中不好的东西有关，至少在西方文化中是如此，还因为选择一种可读的前景颜色是非常痛苦的。

问题来自这样一个事实：即使你的对比值很好，这也不会使你更容易阅读课文。白色对黑色可能有最好的比例，但它会导致眼睛疲劳相当快。正如帕比尼·加布里埃尔·佩蒂特(Pabini Gabriel-Petit)所写，“在黑色背景下，高色度的黄色(#FFF00)、绿色(#00FF00)、青色(#00FFFF)和洋红(#FF00FF)提供了最好的对比。”

如果这些颜色组合，不管它们的可读性如何，给你的感觉是你回到了80年代或90年代初，当时显示器是绿色的，文本是橙色的，你并不孤单。

我从来没有使用过这样的古董显示器，所以我无法从经验中分辨出来，但当我登上一个背景暗、文字轻的网站时，我总觉得这是一台时光机，把我带回到二三十年前，而我的眼睛是第一个反对的。

好吧，黑暗的背景可能很可爱，但是当我不得不读一篇2000字的文章(以及下面的评论)时，这让我哭了-真的！一些关心他们的用户(和他们的眼睛)的网站提供了切换颜色的方法，所以如果你不喜欢默认的黑暗背景，你不会被迫观看它。

此杭州金年会棋牌官网 费用多少外，有许多方法可以覆盖网站使用的默认颜色，但我宁愿访问使用可读颜色方案的站点，也不愿花时间对颜色进行微调。

也许我会走极端，但杭州金年会棋牌官网 费用多少我个人永远不会建议对有大量文本可读的网站使用带有浅色字体的暗背景-我觉得这是一个可用性的罪过#1。对于其他类型的网站，比如杭州金年会棋牌官网 费用多少:浅谈网页设计中的配色方案画廊，甚至没有1000字文字的公司网站，黑暗背景也不是禁止的。

那些难以捉摸的颜色

在我讨论了两种最常见的场景-即光线暗和暗光时，剩下的唯一的事情就是讨论你能想到的所有其他颜色组合。

这些颜色组合包括大多数颜色，但出于某种原因，您既不能将它们用于背景，也不能用于文本颜色，因为无论您如何巧妙地组合它们，对比度都很低，或者组合不美观(或者两者兼而有之)。

当然，这并不意味着这些颜色是无杭州金年会棋牌官网 费用多少用的。一点也不-它们非常适合标题，特别是字体更大的标题，也很适合强调，从下面的例子中可以看出：

颜色对可读性有很大的影响。这就是为什么你需要明智地选择它们，这样它们不仅创造了美观的组合，而且使用户更容易阅读文本。文本是任何网站不可分割的一部分，我们不应该通过使用难以阅读的颜色组合来惩罚访问者。这是我们将向您展示一些伟大的网站的例子，使用大胆的颜色组合，以吸引观众的注意力。

受到这些粗犷的彩色网站的启发

设计师是如何做到这一点的？在目前的趋势下，如果你想做一个令人难以忘怀的声明，你需要做几件事：

• 一种色彩饱满的配色方案，它明亮得足以引起人们的兴趣，而又不会使他或她失明。
• 令人敬畏的、可能令人震惊的图像(一张照片或一幅插图)
• 一条独特的、非凡的标语。

然而，这并不容易实现。要获得一个美丽的，大胆的色彩设计，你需要仔细考虑。你还需要一些设计技巧和大量的勇气。

因为没有单一的一般规则为您的设计选择颜色，我只会给您一些灵感！这是为了帮助你锻炼你的创造性肌肉，因为颜色，在许多设计博客中讨论，是重要的网页设计。

因此，为了切入主题，我向你们展示了漂亮大胆的配色方案设计的例子。我希望它能为如何有效地使用这些颜色提供一些启示。

网页设计中的粗体配色方案展示

艾比·普廷斯基

apiculture养蜂（业）

阿特姆和朱莉娅·韦丁

奥马哈军营

焦糖布吉

碰撞实验室

连接躁狂症

水力压裂的危险性

亲爱的妈妈

PKLIMP

Dropify

Verde

每一滴

流动介质

Gloo贴纸相册

Gum

Hy

jorgeATGU

改掉我的习惯

好的！

Nineswiss

pixilated精神有点失常的

彩虹苗圃

赛尔图2012年度报告

卡尔托·卡洛先生

square spade方铲

演播室MPLS

Tapped

The Basement

Think Big

Tornobambino

TriplAgent

WDG

威尔·费尔南德斯

木质部数字

YCN演播室

大胆和大，这些网站是真正的设计的例子，专注于微妙和微小的东西：颜色，字体和位置。这些小事在设计中产生了巨大的影响。是的，这对设计师来说是个危险的举动。

它甚至可能导致观众太震惊，因为大胆的颜色，但设计师冒了风险，看看他们得到了什么！你已经看到了很多颜色组合和大胆的网站。