跳转至正文

无障碍 (a11y)

背景

#

确保你的应用能够被广泛的用户使用是构建高质量应用程序至关重要的一点。如果你的应用设计不佳，可能会无法覆盖到所有年龄段的人。 联合国关于残疾人权利 规定了道德和法律必须确保信息系统能够普遍使用。世界各地也都要求提供无障碍的环境；同样，公司也认识到了最大限度覆盖服务的优势所在。

我们强烈建议你将辅助功能清单添加到发布应用前的关键指标。 Flutter 始终致力于支持开发者能够使它的应用更易于访问，其中就包括了由底层操作系统提供的一流的无障碍支持，

UI Design and styling

Assistive Technologies (Screen Reader) supports

Accessibility regulations

#

Accessibility standards and regulations help ensure that products are accessible to people with disabilities. Many of these have been enacted into laws and policies, making them requirements for products and services.

  • WCAG 2: Web Content Accessibility Guidelines (WCAG) 2 is an internationally recognized standard for making web content more accessible to people with disabilities. It is a stable, technical standard developed by the World Wide Web Consortium (W3C).

  • EN 301 549: EN 301 549 is the European harmonized standard for accessibility requirements for Information and Communication Technology (ICT) products and services.

  • VPAT: The Voluntary Product Accessibility Template (VPAT) is a free template that translates accessibility requirements and standards into actionable testing criteria for products and services.

Laws around the world require digital content and services to be accessible to people with disabilities. In the U.S., the Americans with Disabilities Act (ADA) prohibits discrimination in public accommodations. Section 508 of the Rehabilitation Act requires federal agencies and their contractors to meet WCAG standards for all ICT.

In the EU, the European Accessibility Act (EAA) requires a wide range of public and private sector services to be accessible, primarily using the EN 301 549 as its technical basis.

思考如何构建无障碍应用

#

确保你的应用能够被所有人使用，这意味着你需要从一开始就考虑到无障碍。对于一些应用，说起来容易做起来难。在下面的视频中，我们的两名工程师从一个无障碍状态中获取了一个 Flutter 内置的 widget，以提供更加便捷的体验。


Building Flutter apps with accessibility in mind

无障碍发布清单

#

这里是一些应用发布前的你需要考虑的部分清单。

  • 主动交互。确保所有可以交互的地方都会给予反馈。任何按钮在按下之后都会做点什么。例如，如果你有一个“onPressed”事件的无操作回调，请改为显示一个“SnackBar”，并告诉用户刚才按下了哪个控件。

  • 屏幕阅读测试。屏幕阅读器应该能够让你在点击控件时描述页面上所有的控件，并且描述应易于理解。请使用 TalkBack（Android）以及 VoiceOver (iOS) 测试你的应用。

  • 对比度。我们建议你至少将控件或文本与背景之间的比例设为 4.5 : 1，禁用的组件除外。图片也应该经过审核足够的对比度。

  • 上下文切换。当用户输入信息时你不应改变其信息。通常来说，widget 应该避免在没有任何确认动作的情况下更改用户的上下文。

  • 可点击的目标。所有可点击的目标至少应为 48x48 像素。

  • 错误。所有重要动作应该能够被撤销。在有限范围内显示错误原因，如果可能的话，提供订正建议。

  • 色觉辨认障碍测试。控件应该可用并且在色盲和灰度模式下清晰可见。

  • 比例系数。文本大小和显示比例的用户界面应保持清晰易用。

更多信息

#

如果你希望了解更多，尤其是如何配置 semantics tree，请查看以下社区成员贡献的文章：

除非另有说明，本文档之所提及适用于 Flutter 3.38.1 版本。本页面最后更新时间：2025-11-13。查看文档源码 或者 为本页面内容提出建议。