无障碍功能

Greenish decorative hero image design

根据 世界卫生组织 (WHO) 和世界银行 2011 年的报告,全球大约 15% 的人口(即六分之一的人)在其一生中会经历重大的或暂时的残疾。因此,在设计中实现无障碍功能对于创建包容性、可用性和高质量的应用程序至关重要 - 它可以为用户带来最佳结果,并可以防止代价高昂的返工。Android 附带各种功能,可以帮助您默认情况下构建支持无障碍选项的应用程序。

为视觉设计

通过检查颜色对比度和文本大小,确保应用程序的内容尽可能清晰易读,并且组件在视觉上易于理解,并且易于彼此区分。

请遵循以下指南,为视觉无障碍功能进行设计。

  • 要允许用户调整字体大小,请在 可缩放像素 (sp) 中指定字体大小。
  • 不要将主体大小设置得小于 12sp。该指南与 Material 类型比例一致,作为默认值。
  • 确保背景和文本之间的对比度至少为 4.5:1。 了解如何检查颜色对比度.
  • 在表面和非文本元素之间使用 3:1 的比率。例如,背景与图标的比率为 3:1。
  • 对链接等操作使用多种视觉效果。

使用 Material 的 无障碍颜色系统 。此颜色系统基于色调调色板,并且默认情况下是实现颜色方案无障碍功能的核心。

There are two blocks of text. The first
       block is colored dark olive while second text block is colored dark grey.
       Both are overlaid on a very dark (almost black) background. Callouts to
       the dark olive text indicate that it is in the 'primary30' tone, and that
       it fails the ratio test at 1.83:1. Callouts to the grey text indicate
       that it's in the 'neutral40' tone and that it still fails the ratio test
       at a ratio of 2.65:1.
图 1:文本颜色对比度不合格的示例

为声音设计

TalkBack 是 Android 设备上包含的 Google 屏幕阅读器,可让用户通过免视操作进行控制。您可以通过 使用 TalkBack 探索您的应用程序 或使用 A11y 扫描仪 手动测试此功能。

请遵循以下指南,确保您的应用程序已准备好使用屏幕阅读器。

  • 在代码中 描述 UI 元素。Compose 使用 语义属性 来通知无障碍功能服务 UI 元素中显示的信息。
  • 为了满足 Android 框架的要求,请提供图标和图像的附加文本说明。
  • 将装饰性项目的说明设置为 null。
  • 要允许在操作块和内容块之间跳过,请考虑 UI 粒度并将 UI 元素分组。

查看 Material 的 从设计到实施的流程,该流程将引导您完成使用 Web 内容无障碍指南 (WCAG) 的无障碍功能考虑因素和表示法。

图 2:为无障碍功能标记的 UI 元素:标题、隐藏装饰性图像和按钮标签

为音频设计

Android 提供了功能,使用户能够通过各种语音命令和查询与他们的设备进行交互。

用于 Android 的 语音访问 应用程序可让您使用语音命令来控制设备。使用您的声音免提打开应用程序、导航和编辑文本。

为运动技能设计

切换访问 允许用户使用一个或多个设备与 Android 设备进行交互,这对于操作灵活性有限且难以直接与触摸屏进行交互的用户很有帮助。

通过 探索切换访问 手动测试。

  • 不要依赖手势来完成所有操作;创建无障碍功能操作 以支持应用程序中的所有用户流程。
  • 确保所有触摸目标至少为 48dp,即使这超出了 UI 元素的视觉效果。
  • 考虑使用 触觉反馈 来帮助使用户获得额外的实时感官输入。

The UI on the left lets the user delete only by swiping,
  while the UI on the right also provides an additional affordance in the form
  of a trash icon button.
图 3:左侧的 UI 允许用户仅通过滑动来删除,而右侧的 UI 还提供了额外的效果,即垃圾桶图标按钮。