J5.03.1WAI-ARIA设计研究
补充属性用于原生语义不足时
别名: ARIA · 语义补充 · 无障碍属性
概念解释
HTML 和系统控件已经能表达按钮、链接、标题、输入框。语义补充属性(WAI-ARIA)是在这套原生词表不够用时,给无障碍树补上角色、关系和状态的一层。选项卡组、树、组合框这类模式常常没有对等的原生控件,才轮到补充。多数按钮和输入框根本不需要它。
机制
原生元素进树是浏览器的工作:写一个按钮,角色、焦点、按键行为一起到齐。补充属性是作者在原生词表的缺口上手工写入的声明,告诉树「把这组节点当成选项卡」。缺口真实存在时,声明补上的是用户本来听不到的结构;缺口不存在时,声明是在重复或改写已经有的映射。
「不够用」的门槛很高。能用原生控件完成的模式,补充属性不增加能力,只增加一条要维护的映射。真正的不足是:平台没有这种控件,或现有控件表达不了「这一组是同一套选项卡」这类关系。补充是填洞,不是给每个节点贴标签。
怎么研究
盘点一页上所有补充属性,逐条问:拿掉它之后,原生元素是否已经提供同等的角色与操作。把「填了真缺口」和「叠在原生控件上」分开计数。
自变量:有无对等原生控件、补充属性是否改变树上的角色。 因变量:阅读器是否因此获得新的可跳转结构、拿掉属性后任务是否仍能完成。
用 NVDA+Firefox 与 VoiceOver+Safari 对照:有的缺口在一个引擎里被原生覆盖,在另一个里没有。
边界
原生词表随平台版本变。昨天必须补的模式,今天可能已经有原生控件,继续补会变成重复声明。移动端系统控件和网页不是同一套词表,网页上的缺口搬到原生 App 可能并不存在。实时通知这类「内容变了但没导航」的情况,确实常要补充,但不能因此推论所有动态界面都要贴属性。
怎么落地
- 先问「有没有原生元素能表达这件事」;没有,再补角色或关系。
- 把补充属性留给选项卡、树、对话框、无刷新的状态变化这类原生词表盖不住的模式。
- 验证:列出本页每一处补充属性,能换成原生元素的标出来。换得掉还留着的,不是在补缺口。