ARIA 实时区域

ARIA（无障碍富互联网应用）实时区域用于标记网页中会变化的区域。屏幕阅读器是一种通过语音或盲文呈现内容的软件，实时区域能让它播报“已加入购物车！”之类的更新。这样，你停留在同一个控件上时，也能收到这些提示。 试试这样：把一件商品加入购物车，用屏幕阅读器听听是否有确认提示。

实时区域是网页中通过代码标记的区域，例如使用 aria-live 属性，让辅助软件能检测内容变化并播报更新。以一个假设的购物车为例，你可以先在页面的初始代码中设置一个带有 aria-live='polite' 的空区域，再插入“已加入购物车！”这条消息。更新内容前，要给辅助技术留出识别这个区域的时间；同时创建区域和消息，播报可能不可靠。这种做法的前提是所用的浏览器与屏幕阅读器组合支持这项功能 [1]。

aria-live 属性用于请求播报的优先级。'polite' 通常允许在用户空闲时播报更新；'assertive' 则请求紧急播报，可能会打断正在朗读的内容。请把 assertive 留给关键且需要及时传达的信息。具体何时播报、是否打断朗读，会因浏览器与屏幕阅读器的组合而异。'off' 不代表永远不播报：按其设计，当焦点，也就是当前交互的位置，位于该区域本身或其内部时，应当播报更新 [1]。

aria-atomic 属性控制更新时应呈现整个区域，还是只呈现变化的内容。假设购物车显示“购物车：2 件商品”，随后只有数字变成了 3。如果只播报“3”，用户可能不清楚它指什么；aria-atomic='true' 会请求播报完整的“购物车：3 件商品”。当周围文字有助于理解时，可以使用这个设置，但不要把它当成适合每一种表单错误的最佳选择 [1] [2]。

aria-relevant 属性用于选择需要播报的变化类型：新增、移除或文本变化。默认设置包括新增和文本变化。例如，如果聊天室成员离开的消息很重要，就可以在成员列表中把移除也列入需要播报的变化。保留 aria-atomic='false'，可以让单个成员的变化得到播报，而不必每次都请求播报整个列表 [1]。

《Web 内容无障碍指南》（WCAG）的成功准则 4.1.3 关注状态消息：它们提供结果、等待、进度或错误等信息，同时不改变用户当前所处的上下文。搜索结果数量可以属于这类消息，但搜索结果列表本身不属于。会获取焦点的错误对话框，也不在这项准则所说的状态消息范围内。这项准则并不要求每一次视觉更新都触发播报 [2]。

常规的“余额已更新”确认提示适合使用 polite 优先级。表单提交失败后出现的错误，也可以在焦点仍停留于“提交”按钮时，作为状态消息提供给辅助技术；具体采用多高的紧急程度，要根据情况决定。提示要简短，避免过多重复。请使用你的受众实际使用的浏览器与屏幕阅读器组合，测试真实的交互过程，包括相关的移动设备组合，并通过用户测试判断反馈是否足够、是否过于频繁 [1] [2]。

这两份文档提供的是技术指导，并非实验发现，也没有报告通过测量得出的改进效果。

• 技术指导：MDN 建议先建立实时区域，再修改其中的内容，最好在页面的初始标记中就包含这个区域。文档也指出，不同浏览器与辅助技术组合的表现会有所不同 [1]
• 技术指导：W3C 将成功准则 4.1.3 的范围限定为不改变上下文的状态消息。它区分了搜索结果数量与搜索结果本身，并建议在更广泛地使用实时区域时开展用户测试，避免反馈过多 [2]
• 技术指导：MDN 解释说，当区域中只有一部分内容发生变化时，aria-atomic='true' 会请求呈现整个区域。W3C 的购物车示例说明，只播报发生变化的数字，为什么可能会遗漏有用的上下文；这两份文档都没有确立“播报整个区域最适合每一种错误消息”这一结论 [1] [2]

播报优先级表达的是预期行为，因此不能假定不同浏览器与屏幕阅读器组合的具体播报时机和打断朗读的方式相同。实时区域的播报通常是纯文本；更新区域内的链接和按钮，其交互含义可能无法通过播报本身传达 [1]。请测试实际的更新顺序、消息的上下文、焦点位于区域中时的表现，以及需要支持的浏览器与屏幕阅读器组合。W3C 也建议通过用户测试，评估反馈是否过于频繁 [2]。