WCAG 对比度
WCAG2.0中提及的对比度指文本视觉呈现以及文本和图像的对比度。通俗讲就是两个元素颜色之间的色值对比度，同时可根据工具测算出两者具体比值，例如 #FFFFFF 与 #002766比值为14.2。WCAG2.0中具体规定如下：
1.4.3最小对比度（最小）：文本视觉呈现/文本图像至少要有4.5:1的对比度，以下部分除外：（AA级）
l 大文本：大号文本以及大文本图像至少有3:1的对比度;
1.4.6对比度（加强）：文本视觉呈现/文本图像至少有7:1的对比度，以下部分除外（AAA级）
l 大文本：大号文本以及大文本图像至少有 4.5:1的对比度。
注：此处的大文本指：至少为24px或19px bold。
在线工具 https://webaim.org/resources/contrastchecker/
过高的对比度会给人带来不适，建议对比度在 16-18 左右（最高对比度是21，也就是#000000 加 #FFFFFF 。尽量别用这种对比，这会引起一些诵读困难症患者的不适，他们会感觉文字在旋转、模糊）。
（来源 https://blog.csdn.net/weixin_34187862/article/details/93145117）
推荐2个有效的模拟色盲色觉的工具，方便设计师们设计和检验：
- Adobe自带的校样设置： Photoshop CS4和Illustrator CS4及以上版本提供了模拟红色盲和绿色盲的校样设置，选择“视图—校样设置—红色盲型/绿色盲型”，以此在日常设计工作中校验配色。
- 色盲/色弱模拟器 http://www.color-blindness.com/coblis-color-blindness-simulator
解决方案建议：
- 避免仅以彩色形式传达重要信息的情况，同时使用多种视觉变量表达信息；
- 采用有效的视觉障碍模拟，选择安全的配色方案，慎用无彩色系的搭配；
- 采用明度与饱和度兼具的配色，尤其使用红色时要小心；(对于非色盲的人，红色是明亮和鲜艳的颜色。但对于色盲，它像蓝色或深绿色一样深。特别是对于红色盲，暗红色几乎显示为黑色。因此，避免在黑色背景上使用红色字符。)
- 不完全通过颜色来区分视觉信息，同时使用文字和图标来进行注解。
若有收获，就点个赞吧
0 人点赞
