无障碍访问
我们负责处理许多与无障碍访问相关的复杂实现细节,包括 aria
和 role
属性、焦点管理和键盘导航。这意味着用户在大多数情况下可以按原样使用我们的组件,并依靠其功能遵循预期的无障碍访问设计模式。
WAI-ARIA
WAI-ARIA 由 W3C 发布和维护,它为 Reka UI 中出现的许多常见 UI 模式定义了语义。这旨在为并非使用浏览器提供的元素构建的控件提供含义。例如,如果您使用 div
而不是 button
元素来创建按钮,您需要向 div
添加属性,以便向屏幕阅读器或语音识别工具传达它是一个按钮。
除了语义,不同类型的组件还有预期的行为。button
元素将以 div
不会的方式响应某些交互,因此开发人员需要使用 JavaScript 重新实现这些交互。 WAI-ARIA 创作实践 为实现 Reka UI 中各种控件的行为提供了额外的指导。
无障碍标签
对于许多内置表单控件,原生 HTML label
元素旨在为相应的 input
元素提供语义含义和上下文。对于非表单控件元素或 Reka UI 提供的自定义控件,WAI-ARIA 提供了一项规范,用于如何为这些控件提供可访问的名称和描述。
在可能的情况下,Reka UI 包含抽象层,以简化我们控件的标签化。 Label
原语旨在与我们的许多控件一起使用。最终,您需要提供这些标签,以便用户在导航您的应用程序时获得正确的上下文。
键盘导航
许多复杂的组件,例如 Tabs
和 Dialog
,用户对其如何使用键盘或其他非鼠标输入方式与其内容进行交互抱有期望。 Reka UI 按照 WAI-ARIA 创作实践 提供基本的键盘支持。
焦点管理
适当的键盘导航和良好的标签通常与焦点管理密切相关。当用户与某个元素交互并因此发生某些变化时,通常将焦点随交互一起移动会很有帮助,以便下一个 Tab 停止点根据应用程序的新上下文而变得合乎逻辑。对于屏幕阅读器用户,移动焦点通常会导致一条通知来传达这个新上下文,这依赖于正确的标签。
在许多 Reka UI 组件中,我们根据用户在给定组件中通常执行的交互来移动焦点。例如,在 AlertDialog
中,当模态框打开时,焦点会以编程方式移动到 Cancel
按钮元素,以预期对提示的响应。