无障碍建站：重构人与信息的技术关系

　　去年七月，客户那边推过来个新站，说“这次必须过 WCAG 2.1 AA”，PM 咖啡杯搁在显示器右上角，杯底压着张皱巴巴的无障碍自查表，边缘被指甲刮出三道白痕。我扫了一眼，点头——行，没问题。结果上线前四小时，盲人测试员老陈发来一段语音备忘录，三十秒，语速平稳，没提任何代码问题，只说：“你这个‘提交成功’弹窗，按两次 ESC 才关掉，我第三遍才摸到那个×，手指悬空停了十八秒。”

　　我原以为是 focus-trap 写死了，结果发现是 modal 的 aria-hidden="true" 跟 document.body 的 overflow: hidden 碰上了，一锁就锁双层。但更离谱的是，它居然在 Safari 上表现正常，在 Chrome 里卡顿半拍——不是 bug，是渲染管线里两个独立事件队列互相错频。我盯着 DevTools 里那个 timeline 面板，咖啡凉透了，隔壁机房的空调嗡嗡响得像台报废的 UPS，声音不急不缓，持续了整整二十七分钟。

　　优胜劣汰？对。不是淘汰人，是淘汰那些假装自己能“覆盖所有场景”的抽象思维。你看那个筛选器组件：label 用 span 包着 iconfont，for 属性写对了，ID 也唯一，甚至 tabindex=0 都加了。但测试员小周——左手打着石膏，右手里攥着支蓝牙笔——试了六次，每次点完筛选项都得等两秒再点“确定”。不是她慢，是那按钮用了 visibility: hidden 而不是 display: none，SR 读完了“筛选项已选中”，还没来得及把焦点移到按钮上，按钮自己就“退场”了。它退得太干净，干净到 SR 没法再喊它回来。

　　我敢打包票，那个 CSS 动画的 transform-origin 是 left top，不是 center，因为设计师导出 Sketch 文件时，图层对齐锚点根本没调。可你说这是前端的锅？后端传给前端的 error message 字符串里混着四个零宽空格，其中两个在中文引号之间——这玩意儿连 console.log 都不显示，得用 String.prototype.codePointAt 才能抠出来。我说不准是谁写的中间件，但我知道它活过了三轮 code review，因为 PR 描述里写着“兼容旧版校验逻辑”。

　　桌上的外卖盒盖子掀开了，酸辣粉浮着层红油，汤早凉了，表面结了层半透明膜。小张进来倒水，路过我工位时伸手把显示器亮度调高两格，又缩回手，说：“你这 contrast ratio 是不是测反了？” 我没答，他电话响了，接起来：“喂？哦李总啊…对对，那个表单校验我们改了…什么？不用 toast？要语音播报？……啊？您让客服现场念一遍？！” 他一边讲一边用笔帽戳自己左耳垂，一下、两下、三下，然后挂了电话，转身走了，鞋跟在地砖上磕出脆响。

　　最绝的是那个“记住我”复选框。视觉样式用伪元素重绘，勾选状态由 checked 控制，JS 里监听 change，一切合理。直到测试员阿哲（他不用键盘，全靠眼动仪）盯着屏幕看了四十秒，说：“它动了三次——第一次变色，第二次缩放 0.98，第三次才打勾。我的设备只捕获到第一次变化，后面两次被判定为‘无语义更新’，跳过了。” 我当场重启了浏览器，清了 cache，重装了 voiceover 配置……最后发现是那行 animation: checkmark-fade-in 0.3s ease-out 里面写了 fill-mode: forwards，但 keyframes 第一帧 delay 是 120ms。它根本不是 bug，是时间轴上的一个缝。

　　那天下午三点四十二分，我把整个 modal 组件砍掉，换成原生 dialog 元素。没封装，没 hook，没抽象，就一个 open 属性+一个 close() 方法。老陈试了三次，一次比一次快。第三次他没说话，直接发了个 OK 的微信表情，带个眨眼动作。我没回，把 PR 提交消息删了三遍，最后只写：“dialog，不修。”

　　其实还有个事没跟任何人讲：上个月财务系统后台加了个 dark mode 切换开关，图标是个月亮 SVG。测试员小周点开开发者工具，手动把 body 上的 class 换成 dark，然后问：“你们这图标颜色，是不是用 fill: currentColor 写的？” 我说是。她说：“那它现在是黑的，跟背景融为一体。但我看不见，所以我不知道它有没有反应。” ——这句话之后我盯了她三秒钟，她正低头剥橘子，一瓣一瓣撕掉筋络，动作极慢，指腹发白。

　　我不信“包容性设计”这个词。信得过的只有具体的人、具体的失败、以及具体到毫秒级的响应断点。无障碍建站不是在修一座桥，是拆掉所有自以为是的桥墩，让人自己趟过去。趟不过去？那就不是人的错。是我们写的那堆 CSS，那个 debounce 时间设成了二百三十，而眼动仪的采样间隔是二百四十一。差十一毫秒，差整个世界。

文章配图，仅供参考

（编辑：站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!