概述

无障碍性

Radix 原语遵循 WAI-ARIA 作者实践指南,并在各种现代浏览器和常用辅助技术中进行测试。

我们处理了许多与无障碍性相关的复杂实施细节,包括 ariarole 属性、焦点管理和键盘导航。这意味着用户应该能够在大多数情况下按原样使用我们的组件,并依赖功能来遵循预期的无障碍性设计模式。

WAI-ARIA

WAI-ARIA,由 W3C 发布和维护,指定了许多常见 UI 模式(出现在 Radix 原语中)的语义。旨在为不使用浏览器提供的元素构建的控件提供意义。例如,如果你使用 div 而不是 button 元素来创建一个按钮,那么你需要向 div 添加一些属性,以便向屏幕阅读器或语音识别工具传达这是一个按钮。

除了语义之外,不同类型的组件还有一些预期的行为。一个 `button` 元素会以 `div` 不会的方式对某些交互做出反应,因此开发者需要用 JavaScript 重新实现这些交互。`WAI-ARIA 作者实践指南 为实现 Radix Primitives 附带的各种控件的行为提供了额外的指导。

可访问标签

在许多内置表单控件中,原生 HTML `label` 元素旨在为相应的 `input` 元素提供语义含义和上下文。对于非表单控件元素,或对于像 Radix Primitives 提供的自定义控件,`WAI-ARIA 提供规范 关于如何为这些控件提供可访问的名称和描述。

在可能的情况下,Radix Primitives 包含抽象,使为我们的控件标记变得简单。`Label` 原语被设计用来与我们的许多控件一起使用。最终,由你来提供这些标签,以便用户在浏览应用程序时拥有适当的上下文。

键盘导航

许多复杂的组件,如 `Tabs` 和 `Dialog`,对用户如何使用键盘或其他非鼠标输入模式与他们的内容进行交互有期望。Radix Primitives 提供基本的键盘支持,符合 `WAI-ARIA 作者实践指南

焦点管理

适当的键盘导航和良好的标签通常与焦点管理密切相关。当用户与某个元素进行交互,并且结果发生了变化时,将焦点与交互一起移动通常很有帮助,以便下一个 Tab 键停止的位置在应用程序的新上下文中是合理的。对于屏幕阅读器用户,移动焦点通常会导致公告,以传达这种新的上下文,这依赖于适当的标签。

在许多 Radix Primitives 中,我们会根据用户在给定组件中通常采取的交互来移动焦点。例如,在 `AlertDialog` 中,当模态打开时,焦点会以编程方式移动到 `Cancel` 按钮元素,以预料对提示的响应。

上一页入门
下一页版本