媒体网站无障碍设计：9个云架构师最易忽略的技术适配点

　　去年元旦那会儿，运维突然在群里吼了一嗓子：“媒体站的WAF报警炸了，全是403！”我原以为又是哪个爬虫脚本撞了规则，结果一查日志——好家伙，全是读屏软件的User-Agent！前端说他们按WCAG 2.1做了无障碍适配，可云上的CDN规则根本没给这些特殊流量开白名单，直接给挡了。这事儿给我整懵了，合着咱们折腾了半年的无障碍设计，第一步就被云架构卡死了？

文章配图，仅供参考

　　说到这儿，咖啡凉了。我喝了一口，继续吐槽：第二个坑是字体渲染。前端为了兼容高对比度模式，用了系统默认字体，结果在云主机上跑的时候，字体文件没预加载，读屏软件读到“未命名字符”的概率高了三成。运维当时还纳闷：“这字体包才200KB，怎么会超时？”我查了半天才发现，云上的OSS虽然支持CDN加速，可没给字体文件单独设缓存策略，每次都是从源站拉，读屏软件又得等字体加载完才能解析文本，这不卡才怪。

　　第三个坑更离谱——键盘导航。前端说他们按WCAG做了全键盘操作，可云上的负载均衡把Tab键的请求全给拦截了。我原以为负载均衡器不会管这种细节，结果运维翻出日志一看：好家伙，连续三个Tab键请求被当成了DDoS攻击，直接给限流了。后来才知道，云厂商的WAF默认规则里，把“短时间内重复按键”归类为异常行为，可读屏软件用户就是得靠Tab键跳转啊！这事儿最后是让运维手动把读屏软件的IP段加到白名单才解决，可要是用户换了网络环境，IP一变，又得重新加——这哪是无障碍设计，分明是给运维找障碍。

　　第四个坑是图片替代文本。前端把alt文本都写好了，可云上的图片处理服务把EXIF信息给剥了。读屏软件读图片的时候，本来能靠EXIF里的描述信息辅助理解，结果云服务一处理，直接变成“图片”。更绝的是，有些动态生成的图片，前端没传alt文本，云服务也没补默认值，读屏软件就只能读“无描述”——这比没有还坑，用户根本不知道这图是干嘛的。我后来逼着前端在上传图片的API里加了个alt字段，可云服务的SDK又没更新，结果前端传了alt，云服务还是存不进数据库，白折腾半个月。

　　窗外天黑了，工位上的键盘声越来越响——隔壁组在赶需求。我接着说第五个坑：ARIA标签的兼容性。前端用了ARIA的live区域来实时更新新闻标题，可云上的CDN把HTML里的ARIA属性给优化掉了。我原以为CDN只会压缩空格和注释，结果它连自定义属性都敢删！读屏软件读到页面的时候，live区域根本不更新，用户还以为网站卡死了。后来是让运维关了CDN的HTML优化功能才解决，可页面加载速度又慢了200毫秒——这平衡术，玩得真溜。

　　第六个坑是颜色对比度。前端按WCAG 2.1的AA级标准调了颜色，可云上的CSS压缩工具把十六进制颜色值转成了RGB，结果在一些老浏览器上，颜色渲染偏差了5%。读屏软件用户本来就得靠高对比度看内容，这5%的偏差直接让对比度从4.5:1降到了3.8:1，不达标了。更气人的是，云服务的CSS压缩工具是闭源的，前端根本没法调参数，最后只能手动把所有颜色值写死，绕过压缩——这哪是云架构，分明是给前端套了个枷锁。

　　第七个坑是表单验证。前端做了实时验证，用户输入错误时会有提示，可云上的API网关把表单的错误响应给缓存了。读屏软件用户第一次输入错误，提示正常；第二次再输错，网关直接返回了第一次的缓存响应，提示还是旧的。用户以为自己改对了，结果提交的时候又报错——这体验，比没验证还糟。后来是让运维关了API网关的缓存才解决，可QPS一高，网关又扛不住，又得加机器——这成本，算谁的？

　　第八个坑是视频字幕。前端上传了SRT字幕文件，可云上的视频处理服务把字幕时间轴给调错了。读屏软件读字幕的时候，本来该显示“现在播放：新闻标题”，结果显示的是“三秒前播放：广告”——这哪是无障碍，分明是添乱。我查了半天才发现，云服务的视频处理服务有个隐藏参数，默认会调整字幕时间轴以匹配视频剪辑点，可前端根本不知道这个参数的存在，也没传正确的值。最后是让前端改代码，强制禁用时间轴调整，可云服务的文档里又没写清楚这个参数的影响——这坑，挖得真隐蔽。

　　第九个坑，也是最绝的——响应式布局。前端按移动端优先做了设计，可云上的CDN把移动端的CSS文件给缓存到了桌面端的节点上。读屏软件用户用桌面浏览器访问的时候，页面布局全乱了，按钮重叠、文本溢出，读屏软件根本没法正确解析。我原以为CDN会按User-Agent分发不同的CSS，结果运维说：“云厂商的CDN默认不区分设备类型，除非你单独买高级版。”——得，又得加钱。

　　手机亮了一下，是前端在群里@我：“那无障碍设计到底该怎么适配云架构？”我回了句：“先把这九个坑填了再说。”可我自己也不确定——云厂商的规则天天变，今天适配了，明天他们更新个版本，说不定又出新坑。优胜劣汰嘛，谁让咱们选的是云架构？只能边踩边修，边修边骂了。

（编辑：站长网）

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