CTCA CTCA
登录

9.2 颜色与对比度

颜色和对比度直接影响文档内容的可感知性,合理使用颜色是无障碍设计的基础要求。

R-154 必须

不能仅依赖颜色传达信息

技术文档中不得仅使用颜色来传达信息、指示操作或区分元素。所有通过颜色表达的信息必须同时使用文字、图标、形状等非颜色方式进行标识。例如,错误提示不能仅用红色字体标识,还需要添加错误图标和描述性文字。

R-155 推荐

文本对比度不低于 4.5:1

正文文本与背景之间的对比度应不低于 4.5:1,大号文本(18px 粗体或 24px 常规字体以上)的对比度应不低于 3:1。这是 WCAG 2.1 AA 级标准的要求。对比度不足会导致低视力用户和在强光环境下阅读的用户难以辨认文字。

正确

状态标识同时使用颜色和图标: - 成功:绿色 + 对勾图标 + 文字「操作成功」 - 警告:橙色 + 感叹号图标 + 文字「请注意」 - 错误:红色 + 叉号图标 + 文字「操作失败」

错误

状态标识仅使用颜色: - 绿色文字表示成功 - 橙色文字表示警告 - 红色文字表示错误

正确示例通过颜色、图标和文字三重标识传达状态信息,即使用户无法辨别颜色,也能通过图标和文字理解含义。错误示例仅依赖颜色,色觉障碍用户可能无法区分不同状态。

警告

色觉障碍(色盲或色弱)影响约 8% 的男性和 0.5% 的女性。最常见的类型是红绿色觉障碍,患者难以区分红色和绿色。因此,在文档中使用红色和绿色作为对比标识时要特别注意,务必辅以其他视觉线索。