视障用户不是绕过，而是被你拒之门外：运维必知的无障碍建站避坑清单

　　去年七月，客户那边推过来个投诉工单，标红加急——不是404，不是502，是“读屏软件一进首页就卡死”。我原以为又是某个Vue组件没挂载完就暴露出ARIA属性，结果一抓日志，发现蜘蛛都还没爬完首屏，NVDA已经连着报了十七次“未定义role”。

文章配图，仅供参考

　　工位右边那个老空调又开始嗡——就是去年备案时跟管局扯皮那台，扇叶裂了条缝，声音像生锈的螺丝在拧。我顺手关了下机柜顶灯，屏幕反光弱了点，但右下角钉钉弹窗跳出来：“@你 王工，客户问能不能先上白名单临时绕过读屏？” 我没回。绕过？你当是封禁恶意UA啊？视障用户不是绕过，是压根没进得来。你把accesskey全设成“s”，又把整个导航栏包在div里不加role="navigation"，人家点Tab键十五次才摸到主菜单，中间三次卡在空div里——这不是绕过，是堵门。

　　前两天交接运维手册，翻到第三章“静态资源交付规范”，里面写着“JS必须defer”，下面小字补充：“如遇读屏兼容问题，请优先检测CSS层叠顺序”。我笑了一下，把那段删了。不是说错了，是根本没用。你CDN吐出来的HTML里里塞了个inline script，用来动态inject一个带aria-hidden="true"的遮罩层，偏偏它执行时机比VO加载晚十八秒——等读屏读到body，页面早渲染完了，遮罩却刚盖上去。这个我敢打包票：你用Selenium跑十遍都不一定复现，但真实用户每点一次F5就中招。

　　张工昨天在群里发了个截图，是客户用JAWS读到表单时爆出的错误：“aria-describedby引用的ID不存在”。我点开源码看了眼——他们用了webpack splitChunks，把表单校验JS单独打了个chunk，但label里的aria-describedby指向的span，在另一个chunk加载完成前根本没生成。没报错，只是静默失效。我说这得配preload，他回了个????。不是敷衍，他真不知道那个emoji是微信转义后丢掉的——他手机端复制粘贴过来的，原始图里是个歪嘴笑。

　　其实最烦的不是技术点。是我们上线前跑checklist，第17项：“确认所有交互元素有焦点管理”。我照做，tab过去，没问题。但我忘了自己不用读屏。李姐（就是坐我斜后方、总在吃凉皮那位）那天下午拿盲文笔记本来找我，说她试了三次，每次点到提交按钮，焦点就跳回页面顶部。我抓包看，发现是我们为了防重复提交，在按钮click后执行了location.hash = ''，触发了浏览器重置焦点逻辑——而NVDA根本不管hash变没变，只认DOM树刷新。我当场重写了那行，改成preventDefault + 人工focus下一个可用节点。可第二天晨会，产品提了个需求：登录页要加粒子动效。开发说要用canvas，我一听就知道又要出事——canvas里画的按钮？你当SVG还能挂title和aria-label啊？

　　对了，凌晨两点服务器巡检，突然跳一条报警：“/healthz 返回503”，一看是k8s探针超时。查了二十分钟，发现是pod里那个健康检查脚本调了curl -I https://api.x，但DNS缓存过期，而CoreDNS里有个旧转发规则没删。这事跟我今天说的完全没关系，但它就发生在我说“读屏一碰就崩”的两小时前。还有，昨天行政送来的绿豆糕，甜得发苦，现在还在我抽屉第二格，糖纸折了三道。

　　所以说，别再写什么“无障碍优化指南”了。写一堆role="main"、aria-current="page”，不如直接删掉那行document.querySelector('.skip-link').focus()——因为skip-link本身没href，也没tabindex。真想搞，先把CMS模板里所有都手动补上；把CDN的Vary头从Accept-Encoding改成Accept, Accept-Encoding；再把你家首页轮播图的autoplay关了，改手动触发——哪怕只留一个键盘操作入口。做不到？那就别挂“已通过WCAG 2.1 AA”水印。挂了，等于把门焊死再贴张“欢迎光临”贴纸。

　　我现在在本地启了个nginx，把所有js都加了?nocache=202407，强制走本地调试。等会儿要去机房，听说新上架的Dell R760风扇声比老款小一半，但电源指示灯频闪节奏不太对。我打算顺手测下语音助手识别成功率——不是为了上线，就想看看它听不听得懂我骂人。

（编辑：站长网）

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