免费无障碍工具

WCAG 2.2 检测工具

了解您的网站在 WCAG 2.2 全部 55 条 A 级和 AA 级成功准则上各处于什么状态。每条准则都会得到四种状态之一,让您分清哪些已被自动化测试覆盖,哪些仍需人工检查。

免费。约一分钟内测试最多五个关键页面。

此工具检查什么

  • 每一条 A 级和 AA 级准则

    全部 55 条准则(A 级 31 条,AA 级 24 条),按 WCAG 顺序列出编号和名称。4.1.1 解析(Parsing)未列入,因为 WCAG 2.2 已将其标为过时。

  • 自动化结果对应到准则

    axe-core 规则会在您输入的页面及最多四个关键页面上运行,每个结果都会对应到该规则所检测的成功准则。只要某条准则的任一规则在任一被测页面上未通过,该准则即为未通过。

  • 键盘测试证据

    在第一个页面上按 40 次 Tab 键的测试结果,用于 2.1.2 无键盘陷阱(No Keyboard Trap),并作为启发式判断(显示为待复核)用于 2.4.7 焦点可见(Focus Visible)。

  • 未定结果单独列出

    当规则无法得出结论时(例如图片上的文字),其对应的准则显示为“需复核”,而不是通过或未通过。

  • 显示缺口,而不是给出分数

    没有任何自动化规则覆盖的准则会标为“人工检查”。结果不会被平均成一个百分比,以免掩盖哪些内容没有测试过。

它无法检查什么

  • 无法判定需要人工判断的准则,例如 1.4.10 重排(Reflow)、1.4.11 非文本对比度(Non-text Contrast)、关于字幕和音频描述的 1.2 系列准则,以及关于表单错误的 3.3.1 至 3.3.4。
  • 无法把“未发现自动化失败项”当作通过。一条规则运行并通过,只覆盖该规则所检测的内容。
  • 无法出具符合性声明、无障碍声明或 VPAT。符合性要由人基于完整页面和完整流程来评判。
  • 无法测试 AAA 级,也无法测试扫描所含五个页面以外的页面。
  • 无法进入登录或结账之后的步骤,而 3.3.7 冗余输入(Redundant Entry)和 3.3.8 无障碍身份验证(Accessible Authentication)等准则通常适用于这些步骤。

为什么重要

WCAG 以成功准则的形式编写,审核人员、采购团队和无障碍声明也都按成功准则来描述网站。未通过规则的清单告诉您要修复什么;按准则查看,则告诉您关于这个网站您目前能说什么、还不能说什么。

自动化工具能涉及的 A 级和 AA 级准则不到一半:axe-core 的规则对应 55 条中的约 25 条。其余准则没有可靠的自动化测试。软件无法判断错误提示是否给出了修改建议(3.3.3),也无法判断页面在 320 CSS 像素宽时是否仍然可用(1.4.10)。把这些列为人工检查,可以清楚显示哪些地方仍需测试。

即使某条准则未发现自动化失败项,它仍可能不达标。1.1.1 非文本内容(Non-text Content)的规则只检查图片是否有 alt 文本,却无法判断 alt="IMG_2041.jpg" 对看不到照片的人毫无用处。

如何解读结果

未通过
与这条准则相关的至少一条自动化规则在某个被测页面上未通过。这是确定存在的问题;网站无障碍检测工具会显示背后的具体元素和页面。
需复核
某项自动化检查标记了它无法判定的内容,例如渐变背景上文字的对比度。需要有人查看该元素。
未发现自动化失败项
与该准则相关的至少一条 axe-core 规则已运行并通过。这并不代表符合:规则只覆盖该准则要求的一部分。
未触发
这条准则有对应的自动化规则,但被测页面上没有可供其检查的内容,例如没有视频可供字幕规则检查,或没有表单可供标签规则检查。如果您的网站在其他地方有此类内容,请手动测试。
人工检查
没有自动化规则覆盖这条准则,因此扫描对它既不判定通过,也不判定未通过。请手动测试。
A 级和 AA 级
A 级是最低要求。引用 WCAG 的政策通常要求 AA 级,而 AA 级包含所有 A 级准则。

如何修复最常见的问题

  • 4.1.2 “名称、角色、值”未通过

    用 div 或 span 元素搭建的自定义控件(菜单、选项卡、折叠面板、开关)不会告诉辅助技术它们是什么,或是否处于展开状态。请尽可能使用原生 <button>,为其设置名称,并设置 aria-expanded 或 aria-pressed,让其状态能被播报。

  • 1.3.1 “信息和关系”未通过

    结构必须体现在标记中,而不只是体现在样式上。请使用真正的 h2 和 h3 元素而不是加粗的段落,列表使用 ul 或 ol,表头使用带 scope 的 th,成组的表单字段使用 label 或带 legend 的 fieldset。

  • 3.1.1 “页面语言”未通过

    为 html 元素添加 lang 属性,例如 <html lang="en">。WordPress 主题通常通过 language_attributes() 输出它;在 Shopify 主题中,请在 layout/theme.liquid 里使用 <html lang="{{ request.locale.iso_code }}">。

  • 2.5.8 “目标尺寸(最低)”未通过

    小图标和排列紧密的链接很难用手指点中。请让每个目标至少为 24 × 24 CSS 像素,或者拉开小目标之间的距离,使以每个目标为中心的 24 px 圆不与其他目标重叠。内边距可以在不改变图标的情况下扩大目标。

  • 逐项完成人工检查

    从简单的开始。1.4.10 重排:把 1280 px 宽的浏览器窗口放大到 400%,检查是否有内容需要横向滚动。2.4.7 和 2.4.11:用 Tab 键遍历页面,检查焦点是否始终可见,且从不被固定页头或 Cookie 横幅遮挡。3.3.1:提交一个填错的表单,看错误是否以文字清楚说明。

关于此工具的问题

WCAG 2.2 在 A 级和 AA 级有哪些变化?

新增了六条准则:2.4.11 焦点不被遮挡(最低)、2.5.7 拖动动作、2.5.8 目标尺寸(最低)、3.2.6 一致的帮助、3.3.7 冗余输入和 3.3.8 无障碍身份验证(最低)。WCAG 2.2 还新增了三条 AAA 级准则,并删除了 4.1.1 解析。

为什么没有列出 4.1.1 解析(Parsing)?

WCAG 2.2 将 4.1.1 解析标为过时并予以删除,因为浏览器和辅助技术已不再依赖它所涉及的标记错误。W3C 指出,对于 WCAG 2.0 和 2.1,这条准则现在对 HTML 内容视为始终满足。

符合 WCAG 2.2 是否也就符合 WCAG 2.1?

是的。WCAG 2.2 向后兼容:符合 2.2 的内容也符合 2.1 和 2.0。因此,按 2.2 测试也覆盖了许多政策仍在引用的旧版本。

可以用它来撰写无障碍声明或 VPAT 吗?

它是一个起点,而不是符合性报告。无障碍声明或 VPAT 需要评估每一条准则,其中大多数需要人工评估;“人工检查”和“需复核”列表会显示哪些准则仍需这样做。

为什么那么多准则显示“人工检查”?

因为它们没有对应的自动化规则。时限能否延长、帮助信息是否在每个页面的相同位置出现、登录是否需要记忆测试,这类问题取决于人们如何使用网站,而不是规则能读取的标记。

无障碍修复报告($174,一次性)以完整的免费扫描为起点,增加更多页面、每项发现需要做的修改、PDF 以及验证修复的复测。

了解无障碍修复报告