如何使 Wordpress 网站易于访问

已发表: 2021-02-25

全世界有数百万人患有影响他们使用互联网方式的残疾。 随着冠状病毒大流行仍在增加对轻松在线购物、食品订购甚至远程医疗服务的需求,网络可访问性比以往任何时候都更加重要。

本 Web 可访问性指南讨论了可访问性是什么、为什么它很重要以及如何使 WordPress 网站可访问,包括通过测试识别常见问题。

视觉障碍的人听他的电话

在本文中,我将介绍:

  • 什么是网络可访问性?
  • 为什么可访问性很重要
  • 有哪些常见的可访问性问题?
  • 测试 WordPress 网站的可访问性
  • 保持网站可访问

什么是网络可访问性?

简而言之,可访问的网站是所有人都可以使用的网站,包括可能无法通过典型的键盘和鼠标设置与网络交互的人,以及具有各种智力或身体差异的人。

必须将特定功能内置到网站中,以使其对残障人士可用且易于理解。 听觉、视觉、认知、运动或学习障碍需要调整和网站修改以使其可用。 根据他们的情况,残障人士使用各种辅助设备(例如屏幕阅读器)来访问网站。

Web 设计人员和开发人员需要确保其网站的内容和功能是可感知的、可操作的、可理解的和健壮的 (POUR),这意味着所有人都可以在所有设备上访问和理解内容和功能。

使网站更易于访问的一些功能示例包括:

  • 视频和音频文件的隐藏式字幕和成绩单
  • 图像上的替代文字
  • 跳过链接以协助键盘导航
  • 适当的颜色对比,使文本更具可读性

为什么可访问性很重要

网站可访问性会对使用网络的每个人产生影响。 如果您或您客户的网站可以访问,这可以确保每个人都可以平等地访问在线信息、必需品、娱乐、购物等,无论其能力如何。

但是网站的可访问性不仅仅关乎良好的业力。 它还对搜索引擎排名、新销售和网站访问者、法律复杂性和品牌形象产生实际影响。

搜索引擎排名

进行可访问性修复可以提高网站的搜索引擎排名。 许多可访问性功能,例如图像上的替代文本和带有标题的正确结构化内容,有助于可访问性和搜索引擎优化 (SEO)。 在搜索结果页面上排名较高可以提高新客户或客户的知名度,从而增加网站流量、转化率、博客或新闻通讯订阅者等。

增加销售额

CDC 指出,截至 2018 年,四分之一的美国人患有残疾。 残疾美国人每年花费超过 2000 亿美元的在线可自由支配支出。 辅助功能允许更多人查找和使用网站,从而增加新销售、转化和回头客的机会。 当当今世界无法访问许多网站时,任何可访问的网站都将在竞争中脱颖而出。

这是法律要求的

所有网站都需要满足美国残疾人法案 (ADA) 中设定的网络可访问性标准。 根据 ADA,已经确立了将网站建立为公共场所的法律先例。 这意味着商业网站(本质上是他们的数字店面)需要以与实体企业大楼需要可访问的方式相同的方式访问。

地方、州和联邦政府机构网站以及联邦资助的组织和项目的任何网站也必须符合第 508 条的标准。此外,还有各种州和国际法律要求网站可以访问。

如果网站不符合这些指南中规定的可访问性要求,则该组织可能会面临诉讼或在某些情况下受到政府罚款的风险。 根据 Usablenet 的数据,2020 年,美国提起了 3,550 起网站可访问性诉讼。 保持法律合规性是开展业务的重要组成部分,拥有可访问的网站是企业履行其法律义务的一种方式。

品牌形象

采取措施使他们的 WordPress 网站更易于访问的公司和非营利组织表明他们正在履行社会责任,并确认他们希望让互联网成为每个人的地方。 对可访问性的组织承诺向人们表明,他们以一种非常人性化的方式受到关心,从而建立忠诚度并提升品牌形象。


有哪些常见的可访问性问题?

我的公司 Equalize Digital 是一家可访问性咨询公司,为企业、非营利组织和政府机构对网站进行可访问性审计。 在我们所有的测试中,我们发现所有网站都重复出现了许多可访问性问题。 这些常见问题是相对容易解决的问题,但通常被开发人员、设计人员和内容创建者忽略。

如果您想确保您构建或管理的网站可以访问,请首先检查以下问题:

替代文本缺失或质量低下

替代文本是屏幕阅读器用来向盲人描述图像内容或目的的内容。 如果替代文本为空,屏幕阅读器将完全跳过它,或者可能会读取图像的文件名,当文件名是一串数字或不描述外观时,这是没有帮助的。 如果没有适当的替代文本,盲人和视障用户将无法理解图像的上下文或理解。

低质量的替代文本是有问题的,因为它无法准确地描述图像或过于冗长并可能导致混淆。 不需要将诸如“图片”、“图像”、“图形”、“图像”之类的单词和短语添加到替代文本中,因为屏幕阅读器会宣布存在图像或图形。

如果您有超过 125-150 个字符的替代文本,某些屏幕阅读器会截断并停止阅读。 在替代文本中添加句点可能会导致屏幕阅读器暂停,可能会使听众感到困惑或导致他们相信替代文本已经结束。

色彩对比不足

在网页设计中,颜色对比度是指背景颜色与文本、按钮或图标等彩色元素之间的亮度度量。 背景色和前景色的比例必须为 4.5:1,标准大小的文本才算足够。 您可以通过将两种颜色的十六进制代码输入免费的颜色对比度检查器来测试颜色对比度。

不明确的锚文本

锚文本是网页上可点击的词或词组。 单击锚文本可能会将您带到新网站、下载文档、在新选项卡中打开图像或视频。 如果锚文本脱离上下文或描述链接的目的没有意义,则被认为是模棱两可的。 模棱两可的锚文本的一些示例包括“链接”、“单击此处”、“了解更多”或“继续”。 在向内容添加链接时,如果有人只听到链接(没有任何周围的文本),他们必须知道链接指向的位置或单击链接时会发生什么。

缺少字幕和成绩单

字幕采用语音内容和非语音内容,例如视频中的音效、音乐或笑声,并通过文本进行描述。 它们在视频期间出现在屏幕上,因此失聪和听力障碍的用户可以了解视频中发生的事情。 此外,字幕必须与视频的时间相匹配。 重要的是要注意字幕必须准确; 需要检查自动生成的字幕的准确性。

抄本是对音频剪辑或视频中所说内容的书面记录。 成绩单提供了理解视频内容或音频文件的辅助手段。 它们应该与视频的字幕一起使用,以便人们可以阅读文字记录而不是观看视频。 这很重要,因为并非所有用户都能阅读字幕。 成绩单还提供了易于翻译成其他语言的好处,并且可以帮助 SEO。


测试 WordPress 网站的可访问性

测试网站可访问性的最佳方法是执行自动、手动和用户测试的组合。

自动化的可访问性测试

使用 AI 扫描工具执行自动可访问性测试。 有许多免费和付费工具可以提供各种可访问性扫描功能。 在选择自动化工具时,请记住以下几点:

  • 网站的大小。 如果您的网站较小,则免费工具可能适合您。 如果您有一个更大的网站,例如一个有博客的网站或拥有数千篇文章的电子商务部分,那么付费工具可能更合适。
  • 你需要多少支持。 如果您需要帮助查找网站上的可访问性错误以便修复它们,免费工具可能是一个不错的选择。 如果您需要帮助了解可访问性错误,或者希望其他人修复它们,请尝试查找具有内置或由开发人员提供的支持选项的工具。 如果您不熟悉可访问性补救措施,那么获得支持是关键。
  • 用户体验。 一些自动辅助工具可以直接在您的网站上使用,例如,通过浏览器扩展程序或在 WordPress 仪表板中。 其他工具要求您使用与您的网站完全分离的界面。 如果您想在网站上工作时查看可访问性错误,请选择提供现场报告的工具。 这使您在编辑网站内容时更容易不断检查网站的可访问性。

可以在任何网站上使用的两种流行的免费工具是 WAVE 和 Axe。 这些工具都有 Chrome 和 Firefox 扩展,可用于测试单个 URL,一次一个,以及允许批量测试和附加功能的付费计划。

可访问性检查器 WordPress 插件

如果您想运行批量可访问性扫描并在 WordPress 仪表板中查看报告,WordPress 可访问性检查器插件是最好的工具。 您可以在 WordPress.org 上免费下载该插件的基本版本。

WordPress 插件的可访问性检查器

可访问性检查器扫描页面和帖子以查找可访问性错误或潜在问题,并将它们直接显示在该页面或帖子的编辑屏幕上。 这些页内报告不仅可用于首先检查网站是否可访问,而且还可用于监控持续的可访问性。

可访问性检查器插件运行测试的屏幕截图

Accessibility Checker 运行 40 多种不同的检查,包括针对上述常见问题的检查。 免费版扫描帖子和页面,专业版包括自定义帖子类型和存档页面的完整站点扫描。 可以忽略错误标记或审查的项目,以便跟踪随时间推移进行的可访问性修复。 对于代理商、开发人员和 WordPress 用户来说,它是一个很棒的工具。

手动测试

不幸的是,自动扫描无法识别网站上的每个可访问性问题——有些问题只能由体验网站的人来确定。 在使用 Accessibility Checker 等自动化工具测试网站后,接下来执行手动测试以确保所有人都可以使用它,无论他们使用哪种设备。

手动可访问性测试的第一步是确认用户仅使用键盘即可完全导航。 转到网站的前端并使用制表符和箭头键在网站中移动,确保您不会丢失您的位置,并且您可以使用网站的所有部分。

键盘测试后,您可以继续进行屏幕阅读器测试。 屏幕阅读器是一种辅助技术软件​​,盲人和视障人士使用它来理解 Web 内容。 如果您有 Mac,则可以使用电脑内置的 VoiceOver 软件。 如果您没有 Mac,您可以下载免费的开源屏幕阅读器 NVDA 或购买流行的屏幕阅读器 JAWS。 最佳做法是使用两个或更多屏幕阅读器测试您的网站,因为并非所有屏幕阅读器都对单个元素说同样的话。

要使用屏幕阅读器测试您的网站,请转到您要测试的页面,然后像在键盘导航测试期间那样在页面中移动,仅使用选项卡和箭头键。 在您浏览页面时聆听屏幕阅读器所说的内容,并标记任何不正确或令人困惑的内容。 收听自动播放的媒体文件或滑块并中断页面上的其他内容。

执行键盘导航和屏幕阅读器测试后,您需要检查所有嵌入或链接的媒体文件。 媒体文件包括视频、音频文件、PDF、.Doc 或 .XLS 文件、图像或文本滑块以及第三方小部件或 iFrame。 确保残障人士可以访问、交互并理解所有嵌入或链接的媒体文件呈现的内容。

用户测试

在自动化和手动可访问性测试之后,建议执行用户测试。 用户测试涉及雇用现实世界的辅助技术用户来测试您的网站是否存在可访问性错误。 通常,Web 开发人员会向测试用户提供具有特定目标的简要说明。 然后,测试用户将尝试完成这些目标,然后向开发人员提供反馈。

使用盲文键盘的视障女性

您可以通过付费或志愿者计划雇用个人测试用户,或者找到提供用户测试服务的无障碍公司。


结论:保持网站可访问

需要注意的是,与 SEO 一样,可访问性是一个需要持续监控和修改的持续过程。 为确保您的网站保持可访问性,请制定以下计划:

  • 使用 Accessibility Checker 插件等工具定期监控和测试可访问性错误。
  • 在 Web 可访问性最佳实践方面培训 Web 开发人员、设计师和内容创建者。 如果您要为客户启动网站,请确保他们知道如何在启动后以可访问的方式添加内容。
  • 随时了解您必须遵循的任何可访问性指南或法律变更。

采取这些步骤将有助于确保您的网站保持可访问性,并且所有人都可以平等地访问网络上的信息、产品和服务,无论他们的能力如何。