可访问性配色的设计实践
这 是Envoy Web仪 表板 的原 有 配色 计 划。像许 多Web配色 计划 一 样，包括 品 牌 色（红色），信 息 色（蓝色），胜 利 色（绿色），正 告 色（橙色）和 各种 灰色 阴 影。
虽 然这 些颜 色能够 作为独 立调 色板运 用，但随 着时 间的 流逝，我们 认识到 它们不够 灵敏，无 法满 足网 站的一 切需 求。
目 前网 站的 文本 颜色 和背景 颜色 类似，没 有足够 比 照，因而 文本 较难阅 读。假如 颜色的 比照度更 大，那么 文本将 更易 于阅读。
针 对Web可 访 问性 停止 设计 意味 着为 一切 用户 提供一 种体 验，无论 他们的 视觉，听 觉，运动 或认知才 能如 何。
一 树立更易用的配色计划的缘由
很 多 人有 视 力障碍：在世界 卫生组织估 量，全球 13亿人患有某种方 式的 视力障 碍。
更好 的可读性 对一切人 都有 协助：一个人 的视力并 不是独一要思索的要素；思索访问网站时，用户可能会用到不同分辨率和亮度级别的计算机和设备，易于阅读意味着每个人都愈加容易。
今天的原则可能是明天的请求： 与可访问性相关的诉讼正在上升，遵照现有原则能够减少公司的义务。
对用户的关怀：作为设计师，有才能用同理心为更多人设计。
二 什么是可访问性颜色？
颜色的可访问性原则是选择人们能够看到的颜色，可以看到文本是可以阅读并了解其含义的一个重要要素。
那么，如何晓得用户能够看到哪些颜色？这完整取决于比照度，也就是前风光与背风光的比拟。
在下面的示例中，能够看到左侧文本与背风光（低比照度）十分类似，但是右侧的文本与背景颜色比照度高，更易于阅读。
WCAG还定义了文本可读性确实切比照度：
AA级：最低规范
小文本的比照度应为4.5：1或更高
大文本应为3：1或更高
AAA级：加强规范
小文本应为7：1或更高
大文本应为4.5：1或更高
三 如何树立可访问性配色计划？
计算现有颜色的比照度
能够运用便利的工具（Tanaguru，Contrast，Stark）在网站背景下测试现有配色计划中的每种颜色。
灰色的选择
清点 在网 站上 运用灰 色文本 的中央，发 现有以下用例:
主要段 落文字，通 常用 最深的 灰色阴 影；
次要 文本或 副标题，通 常是次深 的灰 色阴影；
禁用状 态文本和 占位符，通常 是深度 较浅的 灰色阴 影。
所以如 今我们需 求三种 不同的灰 色，它们看起 来足够 不同，以显 现 主要、次要 或第三 级的状 态，而且还能 够经过无障碍规范。
运用Sketch画几个方形，先把左边的方形填充为最深色，然后把中间方形的不透明度降低了50%变成灰色，最后运用吸管工具吸一下这个灰色作为右边方形的颜色。
以现有 的颜色为起 点，品牌 颜色不会 改动，其他颜色 来自网络状 态常用的颜色 系列：蓝色表 示信息，绿色表示胜利，橙色表示正告。
能够先从每个 颜色的 根底 色开端，调 整饱 和度（横向 滑动）和亮 度（竖向 滑动），创立 出色相相同 但比照度 不同的 颜色。
在为颜色辨别比照度的同时，为每种颜色创立了十分浅的阴影，在必要时能够当作背风光运用。
实践应用
我们最终得到了一套完好的配色计划，该计划能够满足可访问性原则，并为文本和界面之间提供了大量的选择空间。
