网页无障碍阅读指南（WCAG）的理解

什么是WCAG？

网页无障碍阅读指南，英文Web Content Accessibility Guidelines，取头字母就是WCAG。作为一项指导性的技术标准而存在，它不只是作为对残障人士等特殊群体的关怀，更是建议性的规范网页设计，使得网页支持辅助设备、读屏软件等一切有利于访问网页的工具，增强网站的可访问性，使之更人性化。从技术上来说，是用规范的编码对网页可读性进行标准化。

现状

在数年前刚接触前端工作不久便知道有这项标准，当时在国外（尤其是美国），很多大型门户和政务网站都已支持，为的是让网页应用服务到更多的人群，让行动有障碍的人（比如盲人）能够享受到网站提供的功能。然而在国内也许是受制于政府推广力度，这样以人为本的技术标准的普及总是滞后，国内从业者也多是被动去接受这些指导性的规范，比如一些涉外业务的网站（是由于国外对该标准严格的审核）。人们熟悉的真正应用到这一技术标准的国内项目屈指可数，大部分的政务、公益部门对各自网站WCAG的开发需求并不重视。

开发

欣喜的是越来越多的项目开始主动出击，比如一些购物网站（利益驱动）和进步的机构及组织的官网。然而多数仍沿用着过时的、需要特定工具才能被支持的、效果差强人意的技术……这加大了运维和推广的成本，增加用户使用难度。那么，作为有社会责任心的前端从业者们，当支持WCAG成为业务需求并具体落实时，我们的问题就来了——该如何正确理解WCAG？如何展开并部署工作？

这里我推荐大家阅读MSDN上的文章就能解开很多疑团了：使用 HTML5 设计辅助功能。

其实很多流行的UI库早已植入了相关特性，比如Bootstrap。

另外，拿一款像样的、依照WCAG标准开发的辅助工具用来做测试也是必须的，比如苹果的VoiceOver、谷歌的Talkback，我推荐开源免费的NVDA，它完全依照WCAG规范来设计。

存在的问题

NVDA这款工具可不是什么“银弹”，由于它是依照WCAG标准开发并且免费开源，迭代更新相对较快，很多新特性得到很好的支持，这是我推荐它的理由却也是麻烦的根源，新特性在VoiceOver之类的工具上得到的支持并不比NVDA好。这就引出了一个问题——兼容性。比如元素间交互的部分属性在NVDA中工作得很好，却在VoiceOver上毫无反应。兼容性同样存在于不同的浏览器中，Bootstrap用sr-only（一个隐藏标签）来解决大多数问题，可以借鉴。

关于无障碍阅读能说的还有很多，理论上，改善应用的可操作性，优化视觉呈现等一切标准化用户体验的途径都可以是无障碍阅读的范畴。依照该指南来开发应用势必会增加工作量，然而养成良好的习惯或者借助工具和成熟的开源库（Bootstrap之类）是可以让工作轻松愉快的。我们说科技以人为本，机器为人类服务。随着各种智能设备的普及，人性化软件的升级更新，想必WCAG在未来会有更加重要的地位。