在全面了解页面结构的同时，正确审核可访问性。A11y 工具“A11y Navigation Auditor”发布 | 主题

作为 Liberlogic 推出的第二款网页无障碍工具，我们发布了 Chrome 扩展程序“A11y Navigation Auditor”。该工具能够快速准确地可视化网站的“框架”，从而帮助您轻松解决那些常被忽略的问题。它的开发旨在支持全面的结构验证，并实现更可靠的无障碍评估。

发展背景

有很多工具可用于评估无障碍性。
只能处理标题和地标等特定类别的工具无法把握整体情况。
虽然在页面上叠加标记的类型可以让你看到整体情况，但它会使屏幕杂乱，妨碍获得鸟瞰视角。
我们的目标是创造一个能够弥合这一差距的工具，让您能够掌握全局，并从鸟瞰的角度查看，而不会使屏幕杂乱无章。

我参考了屏幕阅读器（例如 VoiceOver 的转子显示）的元素列表功能。
通过在侧面板上可视化并添加问题检测功能，我们创建了一个易于理解且能够进行高级结构诊断的开发人员工具。

▪️标题
跳级、标题空白、角色缺失等。

▪️链接
空文本、措辞不清、重复链接等。

▪️表格
缺失标签、自动完成属性、错误消息映射等。

▪️地标
缺少主要内容、无法区分重复角色以及章节元素存在缺陷。

▪️图片
缺少 alt 属性、alt 文本不恰当（例如，“图像”）、使用错误的文件名等。

▪️表格
缺少标题或标头，以及复杂结构中范围/标头的缺陷。

▪️符合 WCAG 标准的问题检测
参考 WCAG 成功标准（1.1.1、1.3.1、2.4.4、3.3.1、4.1.2 等），并以三个级别显示它们：错误、警告和信息。

▪️ 显示计算出的可访问名称
根据 ARIA 规范，屏幕阅读器实际朗读的名称及其派生名称将被可视化。

▪️实时监控ARIA状态
它能够自动检测 aria-expanded 和 aria-invalid 等状态变化，以及 aria-label 等可访问名称的动态变化，从而能够立即确认用户操作引起的可访问性变化。

点击高亮显示
只需点击面板中的项目即可滚动并选中相应的元素。您也可以使用键盘上的方向键在不同项目之间切换。

▪️面向专业人士的高级功能
- 切换隐藏元素的检查
- 自动排除第三方小部件
- 支持两种语言：日语和英语

在 Liberogic，我们的目标是使无障碍成为一种标准品质，而是需要特别关注的事情。

继我们的首款产品“区域对比度检查器”之后，这款“A11y导航审核器”是另一款体现了我们在实际应用中迫切需要的功能的产品。正如“导航审核器”这个名字所示，我们希望帮助创建能够让每个人都能轻松找到目的地而不会迷路的网站。这就是我们开发这款产品的初衷。