语义元素自带无障碍行为
别名: 原生语义行为 · 自带辅助技术行为 · built-in AT behavior
概念解释
用平台提供的语义元素——网页上的按钮、链接、输入框、标题,原生应用里的 Button、TextField、Switch——等于把一套已经接好的辅助技术行为一并带上:它会出现在对应的控件列表里,能被键盘或等效操作激活,读屏会按这种控件来宣布。选语义元素,是在借这条现成的映射,不是在选一种外观。
一块画出来的矩形可以长得像按钮,却不在这条映射上。外观可以另做;行为是元素类型附带的。这里只管「选对类型就带上行为」,不负责去补一套从零声明的控件。
机制
浏览器和系统会把语义元素映射进无障碍树,再送到平台的辅助功能接口。<button> 默认进入 Tab 序,空格和回车激活,读屏把它读成按钮;<a href> 进链接列表;<h2> 进标题跳转。设计选这些元素时,等于预订了这组行为,不必在稿上再写一遍「可聚焦、可激活、可被列入按钮清单」。
<div>、无角色的 View、一张切图按钮,不进入这套映射。点击事件可以自己绑,但读屏仍当静态区域,键盘可能到不了,开关、链接、标题各自的清单里也没有它。行为不是样式的副产品,是元素类型在无障碍树上的登记。换类型等于换登记;只换皮肤,登记不变。
边界
语义元素如果内容是空的(没字的按钮、没有 href 的链接、空标题),类型带上的行为会指向一个无法辨认的对象,比用错类型更难查。画布、游戏引擎、自定义绘图表面没有原生控件树,选「语义元素」这条路根本不存在,必须走另一套暴露接口。原生元素被包在无法穿透的自定义层里,映射会被挡住,表面上选了按钮,辅助技术仍看不到。禁止交互的装饰(纯展示的卡片底)不该被做成按钮去「顺便」带行为,带上的是错误的行为。
怎么落地
- 稿和组件清单上先写元素类型(按钮、链接、标题、输入、开关),再写外观;能用平台控件完成的动作,不指定成通用容器。
- 走查时打开读屏的按钮列表、链接列表、标题列表,核对视觉上像这些东西的对象是否在对应名单里。
- 只用键盘走一遍主路径:每个主要动作应能被激活,而不必先用鼠标点亮。
- 验证:同一界面分别用鼠标、Tab、读屏的控件列表到达同一动作。三路里缺一路的,就是选了外观、没借到语义元素自带的行为。