ASP无障碍调试：视障工程师的代码友好之道

　　去年清明节，我蹲在三号机房改ASP老后台的无障碍调试，杨工坐我左手边——就是被兼容性折磨了六年、上季度末刚给IE11手写过aria-live polyfill那个老杨。他当时正用蓝牙读屏念“/admin/user/list.aspx?tab=profile”，语速快得像抢答，但每到服务器返回的JSON里嵌了个没label的input，声调就卡半秒，再吐出来就带点气音。

　　机房顶灯嗡嗡响，不是坏，是整排镇流器集体老化那种低频震，跟老式CRT显示器待机时一个调子。我原以为这噪音会盖过读屏声，结果没有，反而把读屏断句衬得更清楚——尤其当它读到``这种东西，停顿比呼吸还长。老杨没抬头，右手食指在触摸板上无意识划圈，指甲有点裂，左边小指头还沾着早上没擦净的外卖酱汁，深褐色，干了。

　　优胜劣汰？对。真刀真枪干过的都知道：不支持NVDA快捷键跳转的控件，三个月内必被新组件替掉；label缺for属性的服务器控件，连测试都懒得测两遍——因为第二个测的人直接删了那行，重写了render方法。我说这话不是鼓吹冷血，是看见运维那边张姐昨天删了七版旧版accessibility.js，就因为她发现某次热更新后，屏幕阅读器抓不到``展开后的option列表索引，而监控里连续十八秒报错堆栈全是`getFirstChild is null`——她没修，她把整个DropDownList重写成原生select+js渲染了。这个我敢打包票。

文章配图，仅供参考

　　前天我在npm装了个新包叫a11y-snapshot，跑完report第一行就是：`[Warning] ASP.NET WebForms controls with runat="server" detected - manual audit recommended.` 我笑了一下。这提示有用吗？没用。但凡用WebForms还活着的项目，谁不知道``默认不带role="button"`？可你知道它背后Render出来多少层``嵌套？你数过没？反正我没数清过——上次我让实习生扒源码，他数到第五层wrapper就去茶水间灌了三杯浓茶回来，手抖着问我：“杨哥，这个div是微软加的还是咱们自己补的？” 我说不清楚，真的不清楚。

　　雨下了一整天，从清明凌晨开始就没停，窗玻璃上全是斜纹水痕。监控屏右下角弹出告警，不是服务挂了，是某台测试机CPU飙到九十七——因为有人在那台机器上开了四个NVDA实例，同时读同一份`userlist.aspx`生成的DOM树。运维小王接了个电话，捂着听筒说“知道了……马上切流量”，声音压得很低，但耳机漏音，我听见他讲的是家里孩子发烧三十九度二。挂了电话他盯着屏幕，手指悬在键盘上没动，大概五秒。窗外雷声闷响，光没跟着来，只有黑。

　　最搞笑的是那个叫“智能标签修复”的IDE插件。我装过，它能自动给``补上for属性——前提是`txtEmail`真存在且没被动态创建。去年双十一前夜它给我补了二百一十三个for，其中一百零六个指向runtime里根本不存在的控件ID。我删了，重新手动写，一行行加`Attributes.Add("aria-label", ...)`。可第一页做完，第二页又来新的服务器控件命名规则：`ctl00_ContentPlaceHolder1_txtEmail`。所以现在我们组里新人入职第一件事，不是跑Hello World，是学怎么用F12打断点，在`System.Web.UI.WebControls.Label.Render()`里看它到底把`AssociatedControlID`转成了啥。这不是规范问题，是活命手艺。

　　有次和架构组老周吵架，他说“WebForms无障碍是死局，别救了”。我没争。我打开DevTools，切到Elements面板，右键删掉了整个``，换成了``——它立刻就朗读了header里的文本，不卡顿，不重复，不漏字。老周愣住，摸着下巴说：“这……你改了后台？” 我摇头，指着Network选项卡里那个3.2KB的aspx响应体说：“没改。我就把`runat="server"`删了，把``改成`{{item.name}}`，再塞进Vue里。” 他盯着看了十秒，转身回工位去了。后来听说他提了个方案：存量页面做静态化剥离，只留数据接口。我信一半，因为上周他还在群里发截图，问“``怎么给每个item加`role="listitem"`”，底下六个回复，四个错，两个没答到点上。

　　我现在改ASP页面，先开NVDA，再开Chrome DevTools，然后关掉所有其他窗口——包括Slack和邮件客户端。因为只要消息弹窗跳一下，读屏就重读当前焦点元素，三秒内必定乱序。上周四下午三点四十七分，市场部同事发来紧急需求：“今天必须上线‘无障碍认证徽章’悬浮按钮”，我看了眼代码——那按钮是个``，onclick里写了`window.open(...)`，连`alt`都没设。我删了它，手写了``，用CSS伪元素画了徽章。上线前老杨过来听了一遍，点点头，说：“这个能播。” 我没回他，低头把刚才那行`alt=""`的注释补全了：``。

　　这事没完。下周二我要陪UI一起测新做的表单校验动效——他们坚持要用`aria-live="polite"`配CSS transform动画。我知道会卡，但我没拦。因为老杨昨天说，他宁可多等两秒，也不要“突然冒出错误提示”吓得失焦。我信他。但具体咋实现……我打算先找个没人的会议室，把窗帘拉严实，自己用盲文显示器+NVDA试三次。实在不行，就照抄去年春节时某银行官网的解法：把校验文案藏在``旁边放个同内容的``，哪怕DOM结构丑得像腌入味的酸笋——至少，能播。

（编辑：站长网）

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