无障碍设计：从第一行代码起的尊重
|
无障碍设计：从第一行代码起的尊重——这行字我去年10月贴在工位隔板上，用蓝胶带粘歪了37度角，至今没撕。 去年10月，我在杭州某银行核心柜面系统升级中，负责适配语音导航模块。实测发现：屏幕阅读器NVDA读取按钮时反复跳过“转账”标签，却准确播报旁边广告横幅里的“双十一限时返现”。团队查了三天，最后定位到第42行HTML里一个被CSS visibility:hidden遮盖但DOM仍在的冗余——它空着，却意外携带role="button"。盲人测试员老周（杭州市残联特聘顾问，视力一级）说：“不是看不见，是被系统推着走岔路。”
文章配图，仅供参考 我改了那行代码，也改了我们写代码的习惯。现在所有新需求评审表强制增加一栏：“首个键盘Tab键将聚焦何处？第几次Enter会触发什么？语音合成器如何断句？”上个月深圳客户上线的医保结算小程序，我们让开发在VS Code新建文件时自动生成accessibility-lint配置模板——不是插件，是直接嵌进.gitignore前的pre-commit钩子脚本，连实习生小陈（刚毕业三个月，React零基础）第一次提交PR就被CI拦住：alt文本含中文标点全角冒号，Lighthouse报错level AA不达标。她愣了三秒，反问：“啊？标点也要管？”——当然要管，去年10月老周用JAWS读到“余额：￥58.20”时，那个全角冒号被读成“余额：冒号人民币五十八点二零”，多花了2.4秒。新技术真香。 但去年10月之后我才敢说这句话——不是因为React 18的useInsertionEffect让焦点管理更稳，也不是Chrome 123新增的aria-description自动合并逻辑，而是因为我们在Vue组件库v4.3.1里悄悄给所有el-button加了强制aria-label生成器：当开发者不写label时，它不再沉默默认，而是根据icon类型+text内容实时拼接语义字符串，比如上传会自动生成aria-label="上传文件按钮"；若icon是“lock”，则输出“锁定当前设置按钮”。上线两周后，东莞某视障程序员阿哲反馈：“终于不用手动给每个按钮补五十遍aria-label了。”——这话听着暖心，可我知道他上个月还在用正则全局替换项目里七百多个标签，手抖把两个生产环境API地址也替错了。 失败案例得说清楚：去年10月，上海某政务App的“亮码即扫”功能上线第三天，收到27条投诉。问题不在扫码本身——盲人用户能顺利唤起摄像头、听清“请对准二维码”的语音提示；崩溃点在于扫码成功后弹出的绿色对勾动画持续3秒，且无任何状态文字更新。iOS VoiceOver无法捕获该视觉反馈，用户以为卡死，反复点击触发5次重复提交。修复方案？我们砍掉动画，改成静音文字播报“验证通过，正在跳转”，同时在DOM里注入aria-live="polite"区域——但真正救命的是：我把这个case塞进了新员工培训PPT第3页，配上老周当天的录音原声：“我没看见绿勾，我只听见自己心跳声越来越大。” 我主观判断：用WAI-ARIA标准写“正确”的代码，远不如在VS Code输入法切到中文时，自动弹出“请勿在此处使用全角符号”的红色波浪线来得有力。 上周五，我在GitLab Merge Request里把一条评论删了三次——原本想写“请补全aria-hidden=false”，最后只留了个emoji ????️????️。毕竟，有些尊重，从不该靠审查，而该长在手指落下的地方。 （编辑：站长网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
MySQL事务控制的无障碍设计艺术