很多工程师把"兼容性"理解为 Chrome、Safari、Firefox 之间的差异。但有一类兼容性更基础，却长期被忽略：人之间的差异。同一个网页，视力正常的人和色盲用户看到的是两个世界；能顺畅滚动的人和只用键盘导航的视障用户，体验也天差地别。这就是无障碍（Accessibility，常缩写为 a11y）要解决的问题。
一、为什么无障碍值得认真对待
全球约有数亿人存在不同程度的视觉、听觉或运动障碍。对他们来说，一个没有语义结构、没有文字替代、对比度不足的网页，几乎等于不可用。
更实际的理由是：无障碍设计往往惠及所有人。字幕最初为听障者设计，如今每个在地铁里静音刷视频的人都在用；键盘导航为行动不便者设计，却也是高级用户的最快操作方式；高对比度模式在强光环境下对每个人都更友好。
从合规角度，许多国家和地区已经把无障碍写入法规，公开服务的网站面临真实的法律风险。即使只为商业考量，覆盖更广的用户群体也从来不是坏事。
二、对比度：最容易被踩的坑
文字和背景的对比度，是无障碍里最直观、也最常被忽略的指标。WCAG（Web 内容无障碍指南）给出了明确阈值：正文文本对比度至少 4.5:1，大号文本至少 3:1。
问题常出在"设计师觉得好看"的浅灰文字、半透明浮层、以及渐变背景上的白字。这些在设计师的高色准显示器上勉强可读，到了普通用户的手机、阳光下、或低亮度模式里，就糊成一团。
判断对比度不该靠肉眼猜。用颜色对比度工具输入前景和背景色，立刻能得到是否达标的结论，以及具体的数值。把它嵌进设计评审环节，比事后返工便宜得多。
三、色盲：别只用颜色传递信息
全球约每十二个男性中就有一个存在某种色盲（多为红绿色盲）。如果你的界面只用"红色表示错误、绿色表示成功"，这群用户可能根本分不清。
正确的做法是用"颜色 + 形状/文字/图标"多重编码：错误不仅标红，还加一个叉号或"错误"二字；成功不仅标绿，还加对勾。这样即使颜色无法区分，信息依然完整。
在交付前，用色盲模拟把你的界面过一遍不同色盲类型下的样子。很多"看起来很清楚"的配色，模拟后才发现两种状态几乎一样——这时改，成本最低。
四、超出颜色的几件事
对比度和色盲只是冰山一角。真正完整的无障碍还包括：给图片加 alt 文本；用语义化标签而非纯 div 堆砌；保证所有功能都能用键盘到达；表单有清晰的标签和错误提示；动画不要自动播放或提供关闭选项。
这些内容单独拆开都不复杂，难的是把它变成默认习惯，而不是项目末尾的"补作业"。
小结
无障碍不是给"少数特殊用户"的额外照顾，而是把产品做得更扎实的基本功。从对比度达标、不靠颜色单独传信息这两件小事做起，你就能覆盖掉大部分最痛的场景。剩下的，是在每个功能设计时多问一句：如果我是只用键盘、或看不清颜色的人，能用吗？