「小程序」信息无障碍初体验

是的，千呼万唤，微信小程序始出来。

微信小程序正式发布后，中国信息无障碍产品联盟（CAPA）的信息无障碍工程师们在第一时间对其无障碍情况进行了体验。共选取了滴滴出行DiDi、饿了么外卖服务、今日头条lite三款小程序，在Android及iOS平台上分别通过读屏软件进行操作使用，并记录下其对应的表现。

体验所使用的机型及相关环境如下：
华为 P9 + Android 7.0 + EMui 5.0 + TalkBack 5.0.4
Vivo XPlay5S + Android 6.0 + Funtouch 2.6 + TalkBack 5.1.0
三星 S4 + Android 5.0.2 + TalkBack 5.0.4
iPhone 6S + iOS 10.2 + VoiceOver
iPhone 6 Plus + iOS 10.2 + VoiceOver

总的来讲，小程序整体的无障碍表现还是不错的，读屏用户可以浏览操作大部分的功能，但仍然可以找到许多无障碍支持不足的情况。在这里我们对三款小程序的功能和各自的表现就不赘述了，一起来看一下他们在读屏下的共同表现。

• 在iPhone和Android手机中，小程序的周边元素（顶部和底部）表现相对一致，具有相同的位置和风格、均有稳定的焦点，基本可以支持读屏用户顺利操作。但在Android手机上，顶部右上角的更多按钮（…）缺少标签，读屏朗读为“按钮未加标签”。
• 在两个系统平台中，使用读屏浏览小程序的主体内容区域，存在部分元素缺少焦点、聚焦后无朗读的问题，并且所有的元素朗读提示中均缺少元素类型。这可能会导致读屏用户对界面内容产生困惑，进而影响部分功能的操作使用。
• 在小程序的主体内容区域中，通过使用一些特殊的读屏手势（如转子）可以按照元素类型浏览，而这些元素是在Webview中常见的。
• 在Android端，小程序的主体内容区域不支持Talkback读屏的触摸手势浏览，仅能通过单指左右轻扫的手势按顺序逐个浏览界面元素。这意味着面对内容众多的小程序界面，Android部分的读屏用户无法快速聚焦操作目标功能，存在很大的操作困难。

根据上述的体验结果总结，结合过往对于读屏操作和产品无障碍的一些经验，我们做了一些初步的判断如下：

• 小程序的主体内容区域呈现采用的是Webview的实现形式。因为在这个主体区域中，通过读屏手势的操作，可以按照Webview的元素进行浏览；并且朗读中缺少元素类型、Android端不支持触摸浏览都是在Webview中常见的无障碍问题。
• 小程序的周边控件采用类似Native的实现形式。这个是依据在两个平台上，周边部分元素均表现稳定，且在不同的小程序中均表现一致判断的。
• 小程序的前端渲染引擎与Talkback读屏存在一定的无障碍兼容问题。Talkback读屏在小程序的主体内容区域无法触摸浏览的表现与个别存在读屏兼容性问题的H5渲染引擎是一致的。
• 小程序的UI组件未做无障碍支持。在本次的体验中，小程序主体内容区域内的元素在聚焦后均没有给出元素类型的朗读提示，在排除读屏无障碍支持差异后，可以简单推断为UI组件未做相关无障碍支持导致的。
• 各个小程序的开发者没有恰当使用UI组件。小程序内部分元素没有焦点的表现，可能是用于开发者采用了自实现的方式导致对读屏的不支持。

以上是我们根据本次对小程序的无障碍体验后初步得出的一些判断，接下来，我们还会对小程序框架的UI组件、渲染引擎、开发实践等方面进一步研究，在如何实现小程序的无障碍方面给出相关的建议。

作者：中国信息无障碍产品联盟（CAPA）

---

扫描下方二维码，进入信息无障碍知识库，技术人的百科全书：