在我们日常生活中，一个无障碍的 Web 是我们必须要考虑的事情。为确保人们能够平等地访问我们的网站，我们必须为所有人都提供同样的信息和易用性。因此，ATAG2.0 标准被提出来，以确保作者在编写内容时能够为所有人提供无障碍的使用体验。
什么是 ATAG2.0？
ATAG2.0 全称为 Authoring Tool Accessibility Guidelines 2.0，它是针对 Web 无障碍内容作者和开发者的指南。ATAG2.0 提供了一系列规则和技巧，使其用户可以更好地创建无障碍内容。这个标准主要涵盖以下三个方面：
- 管理和规划：
这一部分包括指导作者如何规划出无障碍内容，了解如何创建易用性高的交互和设计。同时，它还含有关于如何协作，验证和维护有助于创造无障碍内容的一些技巧。
- 创造内容：
这个方向是 ATAG2.0 最核心的部分。它包括如何创建可访问的文本，音频视频等多媒体内容，以及如何使用 Web 标准和交互式组件来减少使用障碍。
- 生成和发布：
这个方向主要指导作者如何向终端用户提供无障碍的文档和网页。它包括如何保持文件格式的可访问性以及如何提供基于角色、语言和用户偏好的翻译等技巧。
总的来说，ATAG2.0 通过各种方法确保 Web 内容作者和开发者在创建无障碍的内容时能够追求最佳实践。
为什么要使用 ATAG2.0？
其最大的核心优势是它有助于您确保作者创建的内容是无障碍性的。这对于那些可能有不同的能力或学习方式的用户至关重要。此外，ATAG2.0 还可以提升用户体验，并且您可以避免面临关于内容的无障碍性问题和/或可以使用的功能。
在应用 ATAG2.0 的情况下，可以帮助您更好地满足以下用户需求：
自闭症、多动和注意力不足等特殊需求用户。
视障、聋难听和色盲等特殊需求用户。
包括老年人在内的针对不同年龄段用户的需要。
综上所述，使用 ATAG2.0 可以让我们更好地满足不同用户的需求，为用户提供更好的体验。
ATAG2.0 的实现
ATAG2.0 的实现可以帮助我们满足二十多个需求。在此只列出其中的一些：
ATAG-A.1.1.1:
该需求是建立基本结构标记，在作者可访问的 Web 内容中为每个组成元素定义代码、文本和元素之间的关系，以便使用者及自动化程序在位于打开或关闭该内容信息的任何设备上访问和控制该内容。
举例
-- -------------------- ---- ------- -------- ------- - -------- --------- ------ ---------- --------------- --------------- --------------- --------------- ----------- ------- -------- ------- ------------------- ---------
ATAG-A.2.2.1:
该需求指导作者要有组合视频文字的能力，使得在播放其中一个内容时，另一个内容需要有文字或行音正在播放，并且也应该对所有播放、钦定、静音或快进或快退等相关控制进行反映。
举例
<video controls> <source src="example.webm" type="video/webm"> <source src="example.mp4" type="video/mp4"> Your browser does not support the video tag. <track kind="captions" label="English captions" src="example.vtt" srclang="en"/> </video>
ATAG-A.3.1.1:
该需求是嵌入式内容无需使用鼠标即可访问。作者需要为所有默认不能由键盘访问的内容定义适当的快捷键，以便所有人都可以访问嵌入式内容。
举例
<button aria-label="Zoom in" accesskey="z">+</button> <button aria-label="Zoom out" accesskey="x">-</button>
实现 ATAG 2.0 的例子
下面是一个案例，演示了 ATAG2.0 是如何实现的。
第一步：开始规划
在编写网站之前，您需要花时间考虑如何使您的内容更具互动性和访问性。您可以使用以下几项技术：
- 确认交互式元素是否具有键盘可访问性（例如，通过Tab键可以访问）。
- 确认文本和多媒体是否易于阅读和识别。
- 确认文本是否易于理解，无论接收者的能力如何。
- 确认网站是否具有足够的语言、颜色等选项，并易于使用。
第二步：编写内容
当您准备好编写内容时，现在是时候考虑如何使其具有访问性。您可以使用以下技术：
- 使用 HTML 标签来建立良好的结构。例如，使用Header，Main和Footer标记来分隔内容。
- 使用 alt 值来描述所有非文本内容，如图像、视频等。
- 提供明确的链路描述。例如，使用aria-label、aria-describedby 及/或 aria-labelledby 属性来为链接、按钮和其他交互式元素提供描述信息。
- 避免“填写空格”表单，在 “验证”和“提交”按钮以前为每个字段提供标签。
- 对于复杂的网格和表格，请使用表头和“描述性”语法。
- 确保所有内容可由键盘访问，依照键盘操作流程。
第三步：发布
发布后请进行自测，以确认代码是否已实现 ATAG2.0 标准并且在各个浏览器上均能正常工作。
结论
实现 ATAG2.0 是设计师和开发人员努力为他们的人群创造活动体验的最佳实践。实现 ATAG2.0 可以确保您的 Web 内容对残障与健全人士都具有访问的可能性，同时使其体验良好。通过本文，我们希望能够使您理解 ATAG2.0 带来的优点。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6776168f6d66e0f9aa09d309