文章 Web 可访问性初学者指南

已发表: 2022-08-12

Web 可访问性最近经常出现在新闻中。 最近，涉及 Domino's Pizza 的案件有可能一直诉诸最高法院，这可能是一个里程碑式的决定，将塑造网络可访问性的未来。

无障碍网站就是那些残障人士可以感知、操作和理解的网站。 它们可以很好地与屏幕阅读器等辅助技术配合使用，为其他障碍提供替代媒介，并允许使用鼠标以外的设备进行导航。

无法访问的网站排除了潜在客户群，并增加了根据 ADA 标题 III 提起诉讼的机会。 它可能会损害搜索排名——更多内容见下文。

在美国，大约八分之一的人患有残疾。 如果将定义扩大到包括那些中度受损的人，这个数字将跃升至近五分之一。

未能容纳如此庞大的受众会限制网站对您的业务产生的积极影响——更不用说您的品牌与人们产生共鸣和激发信念的能力了。 构建一个可在尽可能多的浏览器中使用且可供尽可能多的人使用的可访问网站可以帮助您的业务——但这也是正确的做法。

本指南的目的是帮助您了解 Web 可访问性，以便您可以发展您的品牌并更好地为您的网站访客提供服务——因为他们就是这样。 不是访客； 不是客户； 但指望您帮助他们找到他们所寻求的信息的客人。 在本指南中，我们将介绍以下内容：

  1. 什么是无障碍网页？
  2. 可访问性的好处
  3. 无障碍规定
  4. 无障碍标准
  5. 可访问性测试：自动与人工
  6. 不合规风险
  7. 可访问性自我评估
  8. 有用的专家和资源

当我们完成时，您将清楚地了解与 Web 可访问性相关的所有内容，并访问一些相关资源，以帮助您进行自己的网站评估。 让我们潜入水中！

什么是无障碍网页？

让我们从定义可访问性开始。 根据 W3C（万维网联盟）的说法，“Web 可访问性意味着残障人士可以使用 Web。 更具体地说，Web 可访问性意味着残障人士可以感知、理解、导航和与 Web 交互，并且他们可以为 Web 做出贡献。 网络可访问性也使其他人受益，包括因年龄增长而能力变化的老年人。”

当我们在 BrandExtract 构建网站时，我们会对超过 1% 的客户受众使用的每个浏览器版本进行测试。 网站可以在尽可能多的浏览器中使用是有意义的，这样我们就不会排除潜在客户、合作伙伴或员工。 尽管这会影响他们网站的总成本，但我们从来不需要说服任何人这是值得的努力。

作为网络浏览器，人类应该得到同样的——如果不是更多的话——考虑。

在讨论 Web 可访问性时，我们倾向于考虑的第一件事是视觉障碍访问者的网站可用性，但视觉障碍只是一个残疾类别。 听觉、身体和认知障碍同样重要，必须以不同的方式加以解决。

有这些障碍的人可以使用各种辅助设备来帮助更轻松地浏览网络。 无障碍网站就是那些与这些辅助设备配合得很好，并努力提供一种用户体验，从一开始就最大限度地减少对辅助设备的需求的网站。

可访问性的好处

良好的规划是构建高质量、可用网站的关键。 它需要深思熟虑和良好的流程。 围绕可访问性规划您的 UX 和设计工作会提高工作细节的标准。 增加勤奋可确保您的网站对人类和机器人都表现良好。

可以通知屏幕阅读器或其他辅助技术的相同细节也有助于搜索引擎机器人抓取和索引您的网站。 根据谷歌网站管理员中心博客，可访问的网站更容易被谷歌搜索引擎索引，这可以带来更好的匹配和更高的排名。 十多年来，谷歌一直强调这一事实。

我们为使有障碍的用户更容易访问网站所做的许多事情也有助于其他用户。 更大的字体，更好的对比度 和许多其他基本的可访问性原则使网站对每个人都更有用。

无障碍规定

快速免责声明：我不是律师。 您为实施任何不完全遵守下述所有规定（以及那些省略的规定）而做出的决定会带来风险，并且应该让您的法律团队参与进来。 他们有适当的资格来评估不遵守这些规定的风险和后果。 “你可能会被起诉”不仅仅是一种可怕的销售策略。

无障碍规定因国家/地区而异。 这里有一些你需要知道的。

美国

在美国，您应该熟悉 1990 年美国残疾人法案（修订版 (ADA)）、1996 年电信法案第 255 条、1986 年航空承运人接入法案和 2010 年 21 世纪通信和视频无障碍法案（CVAA）。

美国政府

如果您为美国政府机构或接受政府资助的实体创建网站，您还需要了解 1973 年美国康复法案第 504 条和同一美国的第 508 条 康复法案1973年 .

欧洲联盟

如果您位于欧盟 (EU) 或在欧盟 (EU) 开展重要业务，您 需要请注意拟议的欧洲无障碍法案以及可能的网络和移动无障碍指令。 一些欧盟成员国将有额外的规定。 例如，英国有 2010 年的《平等法》。

加拿大

如果您在加拿大开展业务，请确保您了解《加拿大人权法》以及《通信和联邦身份政策》。 许多其他国家也有自己的个人法规。

感到不知所措是完全自然的。 没有个人或小公司 可以除非这是他们的核心关注点，否则可能会跟上所有法规。 幸运的是，有标准机构、指南和专家来帮助我们做对。

无障碍标准

大多数法规都借鉴了 WCAG 1.0 和 WCAG 2.0 标准作为构建可访问网站的指南。 这两个标准都是由 Web 内容可访问性指南工作组构建和维护的，该工作组是一个由 Web 开发人员和来自各种公司和组织的专家组成的联盟。

WCAG 工作组是 W3C（万维网联盟）下的众多工作组之一。 W3C 是负责 HTML、CSS 和 Web 所依赖的许多其他技术的国际标准社区。

WCAG 1.0 和 2.0 将在很大程度上将您引导到同一个地方，但 WCAG 2.0 具有更容易测量的启发式方法。 符合 WCAG 1.0 的网站很可能符合 WCAG 2.0。 所有符合 WCAG 2.0 的网站都将符合 WCAG 1.0。 两者之间的区别在于它们如何组织指南。 引用 W3C 网站：

WCAG 1.0 是围绕具有检查点的指南组织的，这些检查点是优先级 1、2 或 3。确定是否符合 WCAG 1.0 的基础是检查点。

WCAG 2.0 围绕 Web 可访问性的四个设计原则进行组织。 每个原则都有指导方针，每个指导方针都有 A、AA 或 AAA 级别的可测试成功标准。 确定是否符合 WCAG 2.0 的基础是成功标准。

WCAG 是一个不断发展的标准。 WCAG 2.1 已达到候选推荐状态，最早可在 2018 年夏天在任何新立法中采用。WCAG 2.1 是 WCAG 2.0 的补充。 换句话说，符合 2.1 的站点将符合 2.0 和 1.0，因此在任何新计划中以 WCAG 2.1 为目标是有意义的。

让我们分解 WCAG 2.1 层次结构。 提出的四个基本设计原则是：

  • 信息和用户界面组件必须以它们可以感知的方式呈现。
  • 用户界面组件和导航必须是可操作的。
  • 信息和用户界面的操作必须是可以理解的。
  • 内容必须足够健壮，可以被包括辅助技术在内的各种用户代理可靠地解释。

这些原则中的每一个都包含一系列指导方针。 例如，从属于第一条原则，我们会发现以下准则：

  • 创建可以以不同方式（例如简单布局）呈现的内容，而不会丢失信息或结构。

根据该指南，我们发现了以下成功标准：

  • 通过演示传达的信息、结构和关系可以通过程序确定或以文本形式提供。
  • 当呈现内容的顺序影响其含义时，可以以编程方式确定正确的阅读顺序。
  • 为理解和操作内容而提供的说明并不仅仅依赖于组件的感官特征，例如形状、大小、视觉位置、方向或声音。
  • 在以下情况下，可以通过编程方式确定收集用户信息的每个输入字段的含义：
    1. 输入字段具有映射到 HTML 5.2 自动填充字段名称的含义； 和
    2. 内容是使用支持识别表单输入数据的预期含义的技术实现的。
  • 在使用标记语言实现的内容中，用户界面组件、图标和区域的用途可以通过编程方式确定。

每个原则都有一个或多个指导方针，每个指导方针都有一个或多个成功标准。 当前的 WCAG 2.1 草案有四项原则、十四项指导方针和七十八条成功标准。 必须根据所有这些标准对网站进行审核，以确保符合标准，并且这些标准中的大多数都涉及多项测试。

但是等等，还有更多。 每一次的成功 标准具有三个一致性级别：A、AA 和AAA。 正如 Section508.gov 网站所解释的，这些级别如下：

A级（最低）

解决最基本的 Web 可访问性功能，但通常无法实现广泛的可访问性

AA级（中档）

解决残疾用户最常见的障碍，并符合修订后的 508 标准

AAA级（最高）

解决最高级别的 Web 可访问性，但不建议将其作为一般策略，因为不可能满足某些内容的所有标准。

仔细选择您希望网站达到的一致性级别，因为这将对进度和预算产生重大影响。

可访问性测试：自动与人工

有免费的工具和在线服务可以对单个网页甚至整个网站进行自动化测试。 这些工具可以是浏览器插件、独立桌面应用程序、自托管服务、免费在线服务 和商业（付费）自动化测试。

我们最喜欢的自动化工具是：

  • tenon.io - Tenon 是 SaaS，可以通过浏览器或 API 执行按需搜索。 定价取决于您需要执行的 API 请求（扫描）的数量。 它有很好的文档记录，可以很容易地整合到 BrandExtract 的 CMS SAM 中。
  • Paypal 的 AATT（自动可访问性测试工具） - AATT 是一个作为服务运行的 node.js 应用程序。 它可以扫描单个页面或整个站点，并且可以配置为可以访问非公开（受密码保护）网页。 扫描请求可以通过 API 提交，响应以易于解析的 JSON 格式返回。 AATT 也很容易与 SAM 集成。
  • 斧头Dequeue Systems 的开发者工具 - ax 在 Chrome 和 Firefox 的浏览器插件中可用。 它扩展了浏览器的内置开发人员工具，并创建了一个漂亮、易于解析的报告，并带有明确的建议。

这些工具快速且易于使用，但不是灵丹妙药。 WCAG 文件中提出的许多指导方针的措辞都需要仔细分析和评估。 这些指南如何适用于独特的设计可能是主观的。 为什么他们措辞模糊？ 这些指导方针必须是面向未来的。

由于 Web 和相关技术是一种不断发展的媒介，因此这些指南需要适用于尚未发明的技术、设备和界面。

此外，自动化测试工具根本无法以与人类相同的方式感知用户体验。 您可以使用一些可衡量的指标来做得非常好，例如字体是否满足最小尺寸和对比度标准。 但还有许多其他变量更难以衡量。 例如，文本中是否充分传达了图表的含义？）

这就是人类介入的地方。对网站的人工测试是一个经过深思熟虑且严格的过程，可能需要数百小时。 但这对于在受众和品牌之间建立同理心至关重要。

在一个完美的场景中，测试应该与具有您正在解决的相同障碍的用户进行测试，并且具有知道网站什么是对什么是错的专业知识。

找到由这些专家组成的团队的唯一实用方法是外包给专门从事可访问性测试的知名第三方。 雇用人员来测试网站的可访问性可能非常昂贵。 您可能会发现让人工测试更复杂的交互式页面是一种具有成本效益的折衷方案。

不合规风险

我们都想相信我们将建立包容性网站仅仅是因为这是正确的做法。 但事实是，有时我们的好意会超过我们的钱包。 为什么一家公司要花费数千美元来使其网站易于访问？

原因之一是将风险降至最低。 即使您不向消费者提供直接服务，您仍可能面临被发现违反一项或多项法规的风险。

考虑在您的组织内寻找工作但由于无法访问您的在线职位数据库而被排除在外的用户。 那些无法访问贵公司财务状况的投资者怎么办？ 当这些事情发生时，你可以被发现违反规定。

没有政府实体会花时间上网、审核网站和寻找不符合网络可访问性准则的网站。 当您的网站准备好上线时，没有检查员会“签字”。

确保工作顺利完成完全取决于您的组织。 您有责任选择一个认真对待网络可访问性并拥有内部或外部资源的合作伙伴，以确保工作正确完成。

很难量化被起诉的可能性和随后的成本，但即使是毫无根据的诉讼也很容易被驳回，也可能使公司损失数千美元的法律费用。 如果很明显您没有为使您的网站易于访问而付出足够的努力，那么您可能会失败（或被迫定居）。

2016 年提起的网络可访问性诉讼超过 260 起，2017 年的数字显着增加。这不包括那些未经诉讼就和解的案件。 与您的律师交谈以真正了解可能性，但要知道风险是真实存在的。

如果您有兴趣了解有关不合规风险的更多信息，我强烈推荐 Karl Groves 的这篇博文。 这是一个平衡的观点，以实数为后盾。 请记住，它是几年前写的，随着诉讼数量的增加，情况已经发生了变化。

可访问性自我评估

希望在这一点上，您已经很好地掌握了可用性这一主题。 但感到不知所措是完全自然的。 进行小的改进是降低诉讼风险和潜在损害的良好开端。 您可以采取以下几个步骤：

评估您的风险

咨询您的法律团队并计算（尽可能）您的风险。 让他们在公共记录中搜索该领域正在进行的和最近的诉讼。 趋势在上升吗？ 成功率是多少？ 您的行业是否似乎正在看到更多的活动？ 诉讼会给您的组织带来什么损失，无论是美元还是对您的品牌的负面影响？ 收入损失怎么办？

研究成本

如果您正在构建一个新站点，请让您的开发合作伙伴使用自动化可访问性测试工具创建一个项目，以确保他们的工作符合 WCAG 2.1 标准。 此外，考虑与有资源进行人体测试的第三方无障碍顾问会面。 直接从他们那里获得定价，以便他们可以独立于您的开发人员工作。

算一算

这听起来很无情，但事实是您必须确定风险是否大于成本。 在 BrandExtract，我们相信对于大多数企业对企业 (B2B) 网站而言，在启动和任何重大更新时对 WCAG 2.0 A 级一致性进行彻底的自动化测试是一种具有成本效益的解决方案，表明了使网站可访问的明确努力。 对于面向消费者的网站或具有丰富、复杂交互性的网站，可能需要进行更彻底的测试。 再次，您应该咨询法律专业人士，以清楚准确地了解违规风险。

制定启动计划

如果您的网站是面向消费者的，那么在新网站启动时或在发生重大变化时进行人工测试是合理的。 对于没有很多复杂性或丰富交互的 B2B 站点，站点的自动化测试可能就足够了。

制定维护计划

您提出的任何计划都必须包括按需或定期自动进行的持续测试。 只有在网站进行重大修改和/或重新设计时才需要进行人工测试。

有用的专家和资源

在研究如何实现一致性时，您会发现解决方案并不总是很清楚。 幸运的是，我们有 A11Y 项目。 A11Y 项目是一个社区组织，致力于使 Web 可访问性指南更易于理解和实施。 它为常见的设计模式、关于可访问性的文章、精选的事件列表和清单提供了具体建议，以确保您已完成所有重要步骤。

“A11Y”是社交媒体和其他空间受限媒体中常用的数字代名词，指代可访问性。 您可以简单地将其理解为“可访问性”并使用它来帮助发现其他资源。

  • A11Y 项目
  • W3C Web 无障碍倡议
  • W3C
  • WCAG 1.0
  • WCAG 2.0
  • WCAG 2.1（候选人推荐）
  • Section508.gov
  • 选择 Web 可访问性评估工具
  • 斧头开发者工具
  • 自动可访问性测试工具
  • Tenon.io 在线测试工具
  • TinyMCE A11yChecker
  • 可访问性诉讼、巨魔和恐吓策略
  • 还要特别感谢互联网无障碍局的 Kim Testa。 她的小组提供自动化和人工测试，我觉得和她交谈更聪明（尽管本文中的任何错误都是我自己的）。

一些额外的见解

SAM 提供了三种可能的集成来帮助自动进行可访问性检查：

  1. TinyMCE A11yChecker 插件是 SAM 嵌入式 HTML 编辑器的免费插件，可根据 SAM 版本 3.2 及更高版本的请求打开。
  2. 与 BrandExtract 的 AATT 托管实例的集成可用于 SAM 3.2 或更高版本。
  3. 可以在 SAM 3.2 或更高版本上实现与 tenon.io 的集成。

拥有一个可访问的网站不仅仅是为了避免不合规的风险。 更重要的是，它关乎每个用户都做正确的事，并始终如一地兑现您的品牌承诺。 如果您需要有关构建可访问网站的任何其他指导，请查看我们关于网络可访问性的播客节目或随时与我们的团队联系。