当我开始学习ARIA时，希望有人告诉我的事
可访问富互联网应用程序（ARIA）是处理Web可访问性时不可避免的技术。如果你从未接触过ARIA，这是个学习新知识的好机会；如果你已有所了解，本文可能会帮助你更深入理解甚至学到新内容！
这些是我在开始Web可访问性之旅时希望有人告知的内容。本文将：
- 提供理解ARIA概念的心态框架
- 澄清常见误解
- 提供指导思路帮助你更好地理解和使用ARIA
本文不包含的内容
这不是如何使用ARIA构建可访问网站和Web应用的配方手册，也不是修复不可访问体验的指南。可访问性工作高度依赖具体情境，因此本文更像是"行前须知"指南，旨在为你提供处理ARIA的良好思维空间，并指出需要注意的事项。
那么，什么是ARIA？
ARIA是在没有更合适的原生HTML元素或属性时，用于传达交互性、目的和状态的解决方案。可以将其视为增强标记的调味料。
向HTML标记添加ARIA是为屏幕阅读器和语音控制软件提供额外信息的方式：
- 交互性：内容可被激活或操作（如导航到链接目标）
- 目的：元素的用途（如收集姓名的文本输入框）
- 状态：内容当前的状态（如可展开或折叠的手风琴面板）
示例说明：
- HTML的button元素会指示辅助技术将其报告为按钮
- 文本字符串"Mute"会被辅助技术报告以提示按钮用途
aria-pressed="true"表示按钮已被激活，处于"按下"状态
ARIA的历史
ARIA最早版本发布于2006年9月26日，旨在弥补HTML的局限性，使交互体验能被辅助技术理解。最新版本是2023年6月发布的1.2版，1.3版即将发布。
ARIA也被称为WAI-ARIA，其中WAI代表"Web可访问性倡议"，是制定Web标准的W3C组织的一部分。
ARIA反映了其创建时代的精神
2006年最流行的操作系统是Windows XP，iPhone尚未发布。从高层次看，ARIA是该时期操作系统交互范式的快照，因为它重新创建了这些范式。
当时的智能手机具有可点击、滑动和拖动表面的功能还不太普及，单页应用程序体验也很罕见。这意味着我们必须使用2006年的技术构建今天的体验。
无法分解为更小、更专注且映射到ARIA模式的交互很可能不可访问，因为它们无法被辅助技术操作或在较旧或不流行的设备上运行。
交互期望
当代基于键盘的Web内容交互期望（复选框、单选按钮、模态框、手风琴等）源自Windows XP及其前身操作系统。这些交互模型作为肌肉记忆延续给使用辅助技术的老年人，依赖辅助技术的年轻人也学习这些事实标准，从而延续这个循环。
这意味着使用键盘与你的网站或Web应用交互的人很可能会首先尝试这些基于Windows操作系统的键盘快捷键，如按Enter导航到链接目标、按Space激活按钮、按Home和End跳转到项目列表的开头或结尾等。
ARIA也是活文档
ARIA并非停滞不前，而是不断添加新内容、删除和澄清。HTML作为语言也反映了这种演变，元素最初是为支持面向文档的Web而创建，逐渐演变为支持更动态的、类似应用的体验。
ARIA的使用规则
ARIA文档中包含五条规则：
- 尽可能使用原生元素
- 尽可能不调整原生元素的语义
- 任何交互元素都必须可键盘操作
- 不要在可聚焦元素上使用
role="presentation"或aria-hidden="true" - 交互元素必须被命名
遵守这五条规则将大有帮助。
ARIA的分类法
ARIA具有结构化语法，以角色以及状态和属性为中心。
角色
角色是辅助技术读取并宣布的内容。HTML元素具有隐含角色，这就是为什么锚元素会被屏幕阅读器宣布为链接而无需额外工作。
如果用例需要，使用隐含角色几乎总是更好。角色有类别，每个都有其目的。抽象角色类别值得注意的是它是组织超类别，不供作者使用。
此外，你只能在某些事物上声明ARIA，并且只能将某些ARIA声明为其他ARIA声明的子元素。
状态和属性
状态和属性是ARIA整体分类法的另外两个主要部分。隐含角色由语义HTML提供，显式角色由ARIA提供。状态通过属性声明及其伴随值以辅助技术可以理解的方式描述元素的特征。
ARIA状态可以快速或缓慢变化，既是人为交互的结果，也是应用程序状态的结果。
如何声明ARIA
将ARIA视为HTML属性的扩展，是一组名称/值对。有些值是预定义的，有些是作者提供的。
在HTML元素上声明ARIA的方式与声明其他属性相同：
|
|
使用说明：
- 可以在HTML元素上放置多个ARIA声明
- ARIA的放置顺序无关紧要
- 元素上可以放置的ARIA声明数量没有限制
- 可以同时声明ARIA和其他非ARIA声明（如class或id）
不是很多ARIA是"硬编码"的
在这种情况下，“硬编码"意味着直接将静态属性或值声明写入组件、视图或页面。很多ARIA设计为基于应用程序状态或响应用户操作动态应用或条件修改。
常见的硬编码ARIA声明示例是使按钮内的SVG图标具有装饰性：
|
|
在已隐含使用该角色的元素上声明ARIA角色不会使其"额外"可访问
如果使用语义HTML，隐含角色就是你所需要的。通过ARIA显式声明其角色不会带来任何额外优势。
注意：此指导有一个例外。在某些情况下，某些复杂标记模式无法按预期与辅助技术配合工作。在这些情况下，我们需要将隐含角色硬编码为显式ARIA以确保其工作。
不需要说明控件是什么；那是角色的作用
隐式和显式角色都会被屏幕阅读器宣布。不需要为交互元素的文本字符串或aria-label包含该部分。
ARIA角色有非常具体的含义
我们有时 colloquially 将网站和Web应用导航称为菜单，尤其是电子商务风格的巨型菜单。在ARIA中，菜单有非常具体的含义。不恰当使用角色会因为其名称乍看起来合适而造成混淆。
某些角色禁止具有可访问名称
这些角色是caption、code、deletion、emphasis、generic、insertion、paragraph、presentation、strong、subscript和superscript。
不能编造ARIA并期望其工作
ARIA的添加者是可访问富互联网应用程序工作组，这意味着每个新版本的ARIA都有一组预定义的属性和值。声明不属于该预定义集的ARIA意味着辅助技术将不知道它是什么，因此不会宣布它。
ARIA静默失败
ARIA不会理解其有限词汇表之外的词语。对于格式错误的ARIA，没有控制台错误，也没有操作系统、浏览器或辅助技术的警报对话框、蜂鸣声或闪烁灯。
ARIA仅向辅助技术暴露某些内容的存在
向某些内容应用ARIA不会自动"解锁"功能。它只向辅助技术发送关于交互内容应如何行为的提示。
在某个元素上声明ARIA角色将覆盖其语义，但不覆盖其行为
不要忘记某些HTML元素具有内置的主要和次要交互功能。当元素没有功能时，调整其角色不会授予任何新能力。
你需要声明ARIA以使某些交互可访问
之前的很多内容可能使ARIA看起来是你应该完全避免使用的东西。这不是真的。这些指导是为了帮助你在HTML不提供开箱即用描述交互能力的情况下使用ARIA。
某些ARIA状态需要某些ARIA角色存在
这类似于HTML同时具有全局属性和只能按元素 basis 使用的属性。学习哪些状态需要哪些角色可以通过阅读官方参考来实现。
ARIA不仅仅是Web浏览器
你声明的ARIA指示浏览器与其安装的操作系统通信。辅助技术然后监听操作系统报告的内容，并将其传达给使用计算机、平板电脑、智能手机等的人。
仅仅因为它存在于ARIA规范中并不意味着辅助技术会支持它
当代开发人员享受Web标准运动艰苦赢得的 benefits。这意味着你可以声明HTML并知道它将与所有主要浏览器配合工作。ARIA没有这个。每个辅助技术供应商对ARIA规范都有自己的解释。
如何确定ARIA支持
确定是否支持某事物有三个主要层：
- 操作系统和版本
- 辅助技术和版本
- 浏览器和浏览器版本
你声明的ARIA越不常用，越需要测试它
你会遇到的常见ARIA声明包括但不限于：aria-label、aria-labelledby、aria-describedby、aria-hidden、aria-live。
向某物添加的ARIA越多，某物行为异常的可能性越大
这考虑了ARIA使用中带来的偏好、不同支持级别、错误、回归和其他问题的复杂性。
辅助技术可能支持你无效的ARIA声明
有机会不准确编写的ARIA实际上会按预期与辅助技术配合工作。虽然我不建议依靠这个事实来完成工作，但在调试时值得提及。
aria-label很棘手
aria-label是你会遇到的最常见的ARIA声明之一，也是最常被误用的之一。aria-label不能应用于非交互式HTML元素，但经常被应用。它不能总是被翻译，并且经常被本地化工作忽略。
aria-live更棘手
实时区域公告由aria-live提供支持，是向使用屏幕阅读器的人传达体验更新的重要部分。相信我，即使