ARIA：应用程序角色

application 角色指示辅助技术，应将元素及其所有子元素视为类似于桌面应用程序，并且不应使用任何传统的 HTML 解释技术。此角色仅应用于定义非常动态且类似桌面的 Web 应用程序。大多数移动和桌面 Web 应用程序不被视为此目的的应用程序。

html

<div role="application" aria-label="…">…</div>

通过指定 application 角色，它表示此 div 元素及其所有后代将被视为桌面应用程序的一部分。

描述

application 文档结构角色指示辅助技术，Web 内容的这一部分包含不符合任何其他已知 HTML 元素或 WAI-ARIA 小部件的元素。应暂停对 HTML 结构和小部件的任何特殊解释，并应完全将控制权交给浏览器和 Web 应用程序来处理鼠标、键盘或触摸交互。

在这种模式下，Web 作者对处理任何和所有键盘输入、焦点管理以及其他交互完全负责，并且不能假设辅助技术会在其端执行任何处理。

如果包含在应用程序角色中的 Web 应用程序包含应被视为正常 Web 内容的部分，则应使用 document 或 article 角色来包含此类内容。

出于历史原因，尤其是在 Windows 上，屏幕阅读器和其他一些辅助技术 (AT) 传统上会在 Web 内容加载完毕后立即从浏览器中获取整个 Web 内容。AT 会构建他们自己的表示形式，这对于视障用户来说是最有意义的消费内容。这通常称为虚拟文档、浏览模式或类似术语。文档简化为单列视图。生成的键盘交互模型与文字处理器非常相似，用户可以逐行、逐句或逐段阅读。AT 将读取任何语义，例如链接、标题、表单控件、表格、列表或图像。

此外，多年来已经建立了一组所谓的快速导航键，这些键允许视障用户通过特定元素类型来浏览页面。此类元素通常包括标题、表单字段、列表、表格、链接、图形或地标区域。

为了使所有这些工作，AT 会拦截几乎所有键盘输入并自行使用它们，不会将任何内容传递给浏览器或其他用户代理。为了能够与网页进行交互，会识别一组标准的小部件，当按下特定键（通常是 Enter 键）时，此模式将关闭。屏幕阅读器模式，通常称为表单模式或焦点模式，允许所有键盘输入重新传递给浏览器。 Escape 是切换回浏览模式的最常用方法，但在特定 application 部分内，一些屏幕阅读器可能需要其他键才能有意退出此模式。例如，JAWS 使用 NUMPAD PLUS。

application 角色旨在为不在标准集中的小部件提供一种方法，使其能够在使用浏览和焦点两种模式与 Web 内容进行交互的 AT 中直接交互。大多数常见的小部件都有预期的键盘交互行为。因此，Web 作者创建的自定义键盘体验会导致令人困惑的体验。

关联的 WAI-ARIA 角色、状态和属性

document、article: 用于指示应被视为正常 Web 内容的应用程序部分
aria-activedescendant: 用于管理应用程序内部的焦点。
aria-label: 用于提供应用程序的名称或正在公开的小部件的用途。
aria-describedby: 用于指示包含有关导航或操作此元素的其他说明的元素的 idref。
aria-roledescription: 用于为应用程序提供更具描述性的角色文本，供屏幕阅读器朗读。这应该进行本地化。
aria-disabled: 表示元素可见但已禁用
aria-errormessage: 对提供设置它的元素的错误消息的元素的引用
aria-expanded: 如果设置为 true，则此元素拥有的或控制的组元素将展开，如果折叠，则为 false。
aria-haspopup: 表示可以通过元素触发弹出窗口，例如菜单或对话框。

键盘交互

键盘交互完全由 Web 作者控制，可以是与正在实现的特定小部件相关的任何内容。例如，在幻灯片应用程序中，可以创建一个使用箭头键定位幻灯片上的元素，并使用 ARIA 实时区域通过音频反馈来传达位置和其他对象重叠状态的小部件。焦点通过aria-activedescendant进行管理。

应用程序必须处理 Tab、Space 和 Enter 键以及 Escape 键。唯一的例外是，如果焦点设置在应用程序内部支持浏览器键盘导航的标准小部件上，例如 input 元素。

所需的 JavaScript 功能

keyPress: 用于处理键盘输入和控制焦点
Click, Touch: 根据您的小部件进行适当处理
更改属性值: aria-activedescendant 用于管理应用程序容器内的焦点。根据更改焦点或交互点的键盘或其他应用程序事件进行设置。

注意：application 角色没有相关联的 HTML 小部件，因此完全是自由格式的。应用程序的作者必须承担全部责任，确保用户不会陷入应用程序内部无法退出的焦点陷阱。必须处理所有交互方面，包括返回页面其他部分的常规 Web 内容。明智而谨慎地使用，并记住进行测试！

示例

一些使用或已正确使用 application 角色的知名 Web 应用程序：

Google Docs、Sheets 和 Slides
CKEditor 和 TinyMCE WYSIWYG 网页编辑器，例如 Mozilla 开发者网络上使用的编辑器
Gmail 的部分内容

无障碍问题

不正确地使用 application 角色可能会无意中剥夺访问网页上信息的权限，因此请务必注意使用它。认真思考您是否真的需要它，是否无法仅仅使用一组其他已知的小部件来完成相同的任务。

如果使用，application 角色应添加到可能的最低公共容器中，而不是 <body> 元素中。此外，务必使用辅助技术测试您编写的代码，以验证它是否按预期工作。

规范

规范
可访问的富互联网应用程序 (WAI-ARIA) # application

优先级顺序

应用 application 角色将导致此元素及其所有后代元素被视为应用程序内容，而不是 Web 内容。辅助技术可能针对 Web 内容提供的任何阅读机制将不适用。

另请参见

如果您使用 WAI-ARIA 角色 application，请明智地使用 - 马可·泽赫的博客文章
使用 ARIA application 角色 - 由莱奥妮·沃森撰写