使用工具
现在显示 12月25日 作为示例。选择日期可查看其他颜色。
Paper Snowfall · #EDF2F6
| 配对 | 对比度 | 等级 |
|---|---|---|
| 深色文字在颜色上 | 16.61:1 | AAA |
| 米白文字在颜色上 | 1.13:1 | 未达 AA |
| 颜色作为文字在其最浅色调上 | 1.09:1 | 未达 AA |
| 最深色调作为文字在最浅色调上 | 6.28:1 | AA |
对比度使用 WCAG 2.1 相对亮度公式计算。AA 要求正文 4.5:1、大字号 3:1；AAA 要求 7:1。最浅色调那一行允许不达标——把浅色当作文字放在它自己的最浅色调上，本来就读不清。
对比度是算术，不是品味
WCAG 2.1 把对比度定义为两种颜色相对亮度的比值，从相同颜色的 1:1 到黑白的 21:1。公式是规定的：把每个通道转成线性光，给通道加权，每个亮度加 0.05，再用较亮的除以较暗的。本站的每个比值都这样从色值计算，而不是用眼睛估计。
阈值也同样具体。普通正文达到 AA 需要 4.5:1。大字号——18pt，或 14pt 粗体，约 24px 或 18.66px 粗体——需要 3:1。界面组件和图形对象与其相邻颜色需要 3:1。AAA 把正文提高到 7:1，大字号提高到 4.5:1。
浅色为什么最难
深色通常能接受浅色文字，浅色通常能接受深色文字，但配色中间地带才是两种选择都可能失败的地方。一个中间调颜色与本站深色墨和米白墨的比值都可能接近 4:1，小字号下没有合规选项。本站自己的日期页就遇到过：366 种颜色里有四种需要降低页面的底色强度，标题才能保持可读。
诚实的修法不是把文字推得离颜色更远，直到技术上合规但不再是颜色自己的墨色；而是改变角色：把颜色用作边框、分隔线、圆点或大标题，把小字放在纸色表面上。颜色仍然在场，文字得到了能生存的背景。
工具测哪四组配对
输入一个日期，工具会渲染那个日期配色的四组实测配对：深色文字在颜色上、米白文字在颜色上、颜色作为文字放在它自己的最浅色调上、最深色调作为文字放在最浅色调上。每一行打印比值和它得到的 WCAG 等级——AAA、AA、仅大字号，或不合格。
最浅色调那一行是故意允许不合格的。把浅色日期当作文字放在它自己的最浅色调上，本来就读不清；一个隐藏这个事实的工具会教错东西。这一行存在，是为了让失败在进入幻灯片、标牌或印刷卡片之前就可见。
不要只靠颜色传达信息
根据英国国家医疗服务体系的数据，大约每十二名男性中有一人、每两百名女性中有一人有某种形式的色觉缺陷。红色和绿色是最常被混淆的一对，而这恰好是派对标牌或状态徽章最常用的一对。分不清两个色块的宾客，仍然应该能读出哪个是哪个。
修法是冗余：标签、图案、位置、图标。绿色写“礼物”、红色写“卡片”是一条线索；礼物配盒子图标、卡片配信封图标是两条。第二种对所有人都有效，包括站在糟糕光线里的读者。
状态、焦点和图标
对比度不只是文字与背景。WCAG 2.1 的非文本对比标准要求界面组件的视觉边界与其相邻颜色达到 3:1，图形对象与其周围环境达到 3:1。焦点环、复选框边框、图表线条和承载含义的图标都属于这一条。一个填充色与页面背景相同的生日颜色按钮，可能通过文字测试，却作为控件完全看不见。
焦点是最常被忘记的状态。一个悬停变色但没有可见焦点指示的链接，对键盘用户不可用。按 Tab 键走一遍页面：每个可交互元素都应该显示焦点在哪里，指示器应该同时与控件和页面达到 3:1。不要移除浏览器轮廓，除非你换上至少同样可见的东西。
怎么测试，以及测试的边界
要测试而又不想只靠眼睛，就为你实际发布的颜色和尺寸计算比值，然后把页面放大到 200% 检查。WCAG 的调整文字标准要求内容在文字放大到 200% 且不使用辅助技术时仍然可用；一个在这个缩放下裁掉标题的布局，有颜色选择修不了的问题。模拟工具适合发现可能的失败，但它们是对特定缺陷的近似，不能代替可读的标签。
数字是必要的，不是充分的。比值的意义是去掉猜测，而不是取代判断。真实读者、真实光线和真实设备仍然是最后的检查。
常见问题
普通文字需要多大的对比度？
WCAG AA 要求 4.5:1，AAA 要求 7:1。大字号——18pt 或 14pt 粗体——AA 要求 3:1，AAA 要求 4.5:1。
浅色生日颜色可以放在文字背后吗？
小字号下通常不行。工具会测量两种墨色与颜色的比值；如果都达不到 4.5:1，就把颜色用作边框或大标题，把文字放在纸色表面上。
给颜色起名字就能让它可访问吗？
不能。名字是给看得见颜色的人用的标签，对分不清颜色的人没有帮助。把颜色与文字、图案或图标配对使用。