色盲模拟与无障碍预览

为什么要做这件事

这件事影响的人比想象中多。红绿色盲在男性里约占 8%（其中绿色盲约 6%、红色盲约 2%），换算下来每一百个男性用户里就有八个。女性因为有两个 X 染色体可以互补，发生率不到 1%。也就是说，如果产品的用户以男性为主，几乎必然会遇到分不清图表里红绿两色的情况，这不是小众的边缘需求。

红绿配色是最典型的坑。把「上涨用红、下跌用绿」这一组配成唯一的区分手段，对红绿色盲来说两条线几乎同色。业界的做法是颜色之外再叠一层形状或符号：涨用实心三角，跌用空心三角，或者直接标上正负号。K 线图还有用红蓝、红青这类对色盲更友好的替代方案。

模拟图不是他们看到的样子。这些矩阵是基于「三种视锥细胞缺一种」的二色视模型算出来的，能准确反映颜色信息的丢失方式，但真实色盲者的大脑会做长期适应，对亮度差异和纹理线索的利用远好于模拟图。所以模拟图上看起来能分辨的东西，实际可能依然困难；反过来模拟图上很难区分的，实际也一定很难区分。判断时应该以「能不能靠明度分辨」为准，而不是以模拟图好不好看为准。

两条线之间留出明度差才是正解。色盲丢失的是色相分辨能力，明度分辨是完好的。所以最稳的设计是让所有需要区分的信息都带明度差：图表里两条线一深一浅，按钮的选中态用深浅而不是只换色相，链接除了颜色外加下划线。判断标准很简单——把设计稿转成灰度看一眼，如果所有元素依然分得清，那任何色觉类型都能读，也顺带解决了黑白打印和强光下看不清的问题。

为什么必须在线性空间里算。视锥细胞的响应正比于进入眼睛的光强，而不是显示器上的 0 到 255 那个编码值。sRGB 的编码经过了约 2.2 次方的伽马压缩，暗部被拉伸过，直接对编码值做线性变换会让所有颜色整体偏亮、对比变平。这里先把 sRGB 转成线性光强、做完矩阵运算、再转回来，结果才和真实观感对得上。