文本与背景的颜色对比对视障购物者至关重要。CheckMyColours.com 等工具可测量对比度，确保符合无障碍设计最低标准。
无障碍颜色对比的核心原理简单明了：前景色与背景色的对比度必须在各种环境中、对不同色彩感知能力的人群均可辨别。根据《Web 内容无障碍指南》（WCAG）2.0，该对比度通过算法比较两种颜色的相对亮度并返回比率，且需超过 WCAG 推荐的最低要求。
然而现实更为复杂。在确信视障购物者能正常使用电商网站前，需解决诸多假设问题。
什么是“前景”和“背景”颜色？
在颜色对比语境中，“前景”通常指文本，“背景”指底色。但在其他场景中，更准确的描述是“任何仅依靠颜色特征来区分两个元素的情形”。
这适用于文本与背景的区分：白色文本置于白色背景上几乎不可见。这也适用于相邻文本，如段落中的链接；若链接外观与周围文本相同，则无法视觉识别。若链接带有下划线，则可避免此问题。
我们在比较哪两种颜色？
单一颜色文本与纯色背景的对比易于处理，自动化工具能可靠识别。但以下常见情况较为复杂：
- 带有 text-shadow（文字阴影）的文本；
- 背景渐变；
- 图像背景；
- 一种或多种颜色的透明度。
WCAG 未直接涵盖这些情况，需自行判断。建议参考以下规则：
添加宽度至少一像素的细黑轮廓是 WCAG 建议，旨在保持字母与背景的对比度。合理推断，通过文本阴影加深文字边缘暗度，也可用于测量对比度而不依赖背景色。
当文字非纯色背景时，每个字符至少应有 50% 位于满足对比度要求的背景上。使用文字阴影有助于达到该阈值。
对于背景图像和渐变，除颜色外还存在纹理或形状引起的视觉混乱，可能打断字母形状的视觉路径。
透明度的挑战
透明度指颜色的相对不透明度。这是自动化测试的难点，并非所有工具都能正确解析 RGBA 或 HSLA 定义的颜色，可能导致误报或漏报。
误报较易处理：查看测试识别错误的位置，用取色器获取实际渲染颜色进行手动比较。漏报则更棘手，通常只能依靠肉眼评估可疑区域。发现色彩对比问题需要练习，结果有时令人惊讶。
即使色彩感知良好，也可能因亮度差异微小而误判。以灰度查看页面是消除色彩感知干扰、有效识别问题的方法。
对比度要求是什么？
WCAG 对比度要求因字体大小而异：
- 正常文本（小于 18pt 或 14pt 加粗）：对比度需 ≥4.5:1；
- 大文本（≥18pt 或 ≥14pt 加粗）：对比度需 ≥3.0:1。
点（pt）是印刷单位，72pt=1英寸。网页常用近似换算为：18pt≈24px，14pt≈19px（具体取决于字体）。
简言之，尽管色彩对比测试看似简单，但在实际场景中确定待比较颜色存在挑战。遵循评估指导，即可顺利分析色彩对比问题，确保视障消费者能正常使用电商网站。
色彩对比度测试资源
自动化工具：
- WAVE Chrome 扩展程序；
- Juicy Studio 无障碍工具栏；
- CheckMyColours.com。
手动工具：
- 色对比度测试器；
- WebAIM 对比度检查器；
- 对比度比率。