用心打造
VPS知识分享网站

提高网站可访问性10个最佳技巧

包容性是现代生活的方方面面中不可或缺的一部分,在线资源也不例外。无障碍网站是成功的网站,可以为所有用户提供信息,无论他们的目的是什么。

尽管网络可访问性不是法律要求,但您的网站仍会因不可访问而面临后果。最常见的后果是失去客户。您的网站可能比竞争对手的网站有吸引力一百倍,但可访问性问题可能会让潜在客户望而却步。

提高网站可访问性10个最佳技巧

还有一些后果更为严重的例子,例如这起诉讼:

2016 年,患有特殊视力障碍的吉列尔莫·罗伯斯 (Guillermo Robles) 声称,使用屏幕阅读器的人无法访问达美乐的网站和智能手机应用程序,并且该披萨连锁店的数字产品违反了《美国残疾人法案》(ADA) 第三章。

诉讼指出,该网站缺乏图片替代文本、空白超链接没有文字引导用户,而且有冗余链接指向同一 URL。

经过六年的诉讼以及美国地方法院和最高法院的判决,Domino’s Pizza, LLC 与原告 Guillermo Robles 达成和解。然而,此案对包括 Domino’s Pizza 在内的多家公司遵守 ADA 的行为产生了深远影响。

网站可访问性可以通过多种方式定义和实现。如果您希望您的网站可供更广泛的受众访问,请继续阅读以了解网站可访问性的秘密。

什么是网站可访问性?

什么是网站可访问性?

网络可访问性确保网站、工具和技术的设计和开发能够让每个人(包括残疾人)都能使用。

您的网络资源应可供所有用户访问,无论他们的需求如何。这意味着,如果有人有听觉、认知、神经、身体、言语或视觉障碍,您的网站应该像对其他人一样为他们服务。可访问性不仅仅适用于有特定残疾的人。它还适用于使用不同设备、互联网连接较差或面临暂时限制的人。

网络在生活的许多领域(如教育、就业、商业、健康和娱乐)变得越来越重要。网络为许多人提供了前所未有的信息和互动渠道。这就是为什么网络可访问性应该是任何技术或网站的基础。

网络可访问性原则

Web 可访问性基于四项基本原则,即 POUR。以下是可访问性良好的资源的主要特征:

  • 可感知。所有用户,无论其感官能力如何,都应该能够感知网站界面的所有组件。这意味着他们应该能够看到、听到或与内容互动。
  • 可操作。网络资源的访问者(包括残障人士和各种设备的用户)应该能够使用网站的特性和功能。例如,用户应该能够在不使用鼠标的情况下浏览您的网站。
  • 可以理解。您应该使用网页设计最佳实践,包括优先考虑清晰的语言和逻辑导航,以使您的网站更易于访问。
  • 健壮。您的网站应该与各种系统兼容,包括浏览器、用户代理和辅助技术。

通过遵循这四个原则,您可以让您的在线项目对所有用户来说都更加方便。不同的专家或部门可以创建网站或应用程序来实现这一点。

网页无障碍标准

W3C 网络无障碍计划 (WAI) 制定了描述无障碍解决方案的技术规范、指南、方法和支持资源。

本指南包含多份指南。我们还提供了另外两份文档来帮助您了解网页可访问性:

  • Web 内容可访问性指南 (WCAG)。WCAG 2 是 Web 内容可访问性的通用标准,可满足国际上个人、组织和政府的需求。WCAG 主要面向 Web 内容开发人员、网页创作工具、Web 可访问性评估工具等。本指南提供了有关如何让残障人士更方便地访问内容的建议等。
  • 无障碍工具无障碍指南 (ATAG)。ATAG 指南解释了如何使创作工具(网页内容创建软件)无障碍,以便残障人士可以创建网页内容。该文件还旨在帮助作者创建更易于访问的网页内容。
  • 用户代理可访问性指南 (UAAG)。UAAG 指南解释了如何让残障人士能够访问用户代理。用户代理包括浏览器、浏览器扩展、媒体播放器、屏幕阅读器和其他显示 Web 内容的应用程序。遵循 UAAG 2.0 的服务通过其用户界面和与不同技术(包括辅助技术)交互的能力提高了可访问性。
  • 欧盟网络无障碍指令。《欧洲无障碍法案》和欧盟网络无障碍指令对于确保公共网站对所有人开放具有重要意义。这些文件概述了政府机构必须采取哪些措施来确保其网站和移动应用程序的无障碍性。
  • 美国残疾人法案 (ADA )。ADA 禁止在公共生活的许多领域歧视残疾人。它由五个部分组成,涉及公共生活的不同领域,并为残疾人提供与基于种族、性别、国籍、年龄和宗教的人享有的民权保护类似的保护。
  • 第 508 条。《康复法》第 508 条是一部联邦法律,要求公司和政府机构为残疾人提供平等的电子信息和数据访问权限。这意味着他们应该享有与非残疾人相当的访问权限。

WAI 指南(WCAG、ATAG、UAAG)和其他建议是任何想要使其项目更易于访问的人的首选来源。

如果您正在寻找一个满足所有 Web 可访问性要求的网站,那么w3.org无疑是您的不二之选。W3C 计划的网站上结

构清晰、可访问所有内容、带有完整锚点的便捷链接以及其他 Web 可访问性功能,您都可以在其中找到。您的网站应该有所不同,但浏览 w3.org 是一种很好的做法。

如何检查网站可用性?

Web 无障碍倡议提供了让有特殊需求的人可以访问网站的指南和做法。我们强调全天候无障碍的重要性(短期维护期除外)。请首先考虑以下因素:

  1. 正常运行时间。
  2. 非高峰维护。
  3. 冗余和负载平衡
  4. 逻辑且易于访问的导航。
  5. 错误处理和信息错误消息。
  6. 定期可用性测试。
  7. 监测和报告。

这些要点对于任何想要实现最高效率的网站或项目都很有帮助。接下来,您将了解可用于检查网站可用性并获得宝贵建议的工具和技术。

网页无障碍工具

有许多工具可用于测试 Web 可访问性。W3C 在其网站上编制了一份这些工具的列表,您可以使用这些工具熟悉一些最佳选项。此外,我们还提供了两个专门用于站点映射和视觉评估的工具。

Axe DevTools Linter

Axe DevTools Linter 是一款方便的工具,可用于检查 IDE 和 CI/CD 中的代码是否存在可访问性问题。它易于设置和使用,可以检查 React(.js、.jsx 和 .tsx)、Vue(.vue)、Angular(.component.html)、HTML(.html 和 .htm)和 Markdown(.md 和 .markdown)文件。

IBM 平等访问可访问性检查器

这款面向开发人员和审计员的开源浏览器扩展使用 IBM 的规则引擎来检测 Web 应用程序中的可访问性问题。它有一个集成的检查器,可帮助您快速识别可访问性问题的来源并修复它们。IBM Equal Accessibility Checker 还允许您选择键盘检查模式。

颜色对比

颜色对比度是检查移动设备可访问性的绝佳工具。它可让您确保移动网页或图像的颜色对比度符合 WCAG 2.x AA 指南。

可访问的Web RAMP

RAMP 工具包包含一个网站监控平台、一个用于自动抓取的免费浏览器扩展程序、颜色对比、手动审核以及一个在线培训学院。这些可以帮助您诊断 Web 可访问性问题。

Total Validator

Total Validator 检查网站的可访问性、有效的 HTML、ARIA 和 CSS,以及是否有断开的链接或拼写错误。该工具可以同时验证单个页面或多个网站,包括离线、经过身份验证和 JavaScript 生成的网站。

WebAIM

WebAIM 的 WAVE 是一款出色的工具,可用于检查您网站的可访问性。它会为您提供有关网站需要改进的部分的报告。输入您网站的 URL 即可开始使用,WAVE 将识别不符合 WCAG 标准的区域。您还可以获得专家审核和网站内容概述。

DYNO 映射器

Indigo Design Company LLC 的 DYNO Mapper 是一款站点地图生成器。它通过进行内容审查、审核和关键字跟踪,帮助可视化您网站的可访问性。Dyno Mapper 测试许多不同类型的网站,包括公共、私人和在线应用程序,使其适用于各种项目。

使网站更易于访问的技术

除了用特殊工具直接分析网站的可访问性之外,您还可以使用其他技术。

人工智能和NLP

人工智能工具可以分析网站内容,识别可访问性问题并提出改进建议。这些工具使用机器学习算法来了解网站内容的背景和结构,并识别潜在的网站可访问性问题,例如缺少图像的替代文本、无法访问的表单元素或复杂的语言。

神经语言编程 (NLP) 使网站能够更自然地响应用户输入,让网站更适合特定残障人士使用。例如,可以更好地针对个人用户量身定制推荐。

生物特征认证

指纹或面部识别等生物特征认证方法对于可能觉得传统方法不方便的残障人士来说是一种安全、方便的登录方式。

通过使用生物识别技术,网站用户不再需要记住和输入密码,这使得记忆力减退或行动不便的人可以更轻松地访问其帐户。生物识别身份验证还可以通过降低未经授权访问的风险来提高整体安全性。

眼动追踪技术

眼动追踪技术有助于了解用户如何与网站互动。它可以帮助设计师和开发人员创建更直观、更易用的界面。

通过跟踪用户的眼球运动,可以了解哪些元素会引起注意、用户浏览内容的顺序以及哪些区域可能会引起困惑或困难。这些信息可用于优化网站布局、导航和内容呈现,以确保视觉或认知障碍人士能够获得高水平的网页可访问性。

网站无障碍声明

网站可访问性声明是网站所有者或组织发表的公开声明,描述了其致力于让残障人士可以访问网站的承诺。

该声明通常包括有关网站的可访问性功能、可访问性标准的遵守情况以及用户报告网站可访问性问题的联系信息。

网络可访问性声明的目的是什么?

  • 展现承诺。该声明表明网站所有者致力于为所有用户(无论其能力如何)提供包容且可访问的在线体验。
  • 提供透明度。此类声明可告知用户网站当前的可访问性状态,包括任何已知的限制或需要改进的领域。
  • 鼓励反馈。无障碍声明鼓励用户报告他们遇到的问题,这有助于识别和解决当前的无障碍障碍。
  • 遵守法规。在某些司法管辖区,法律或法规可能要求网站提供可访问性声明,例如美国的《美国残疾人法案》(ADA)。

Web 可访问性声明不仅仅是一份文件;它是您在网站或在线项目上工作的证明,任何人都可以使用。WAI 网站提供了最低限度和完整的 Web 可访问性声明的示例。

提高网站可访问性10个最佳技巧

我们整理了宝贵的建议,以探索创建符合所有网络可访问性要求的网站的最佳做法。我们还建议在进行更改之前和之后使用工具测试您的网站。

1. 为你的图片添加 alt-text 标签。

替代文本是对图片的书面描述,可帮助视障用户了解图片内容。编写替代文本时,应简明扼要,提供足够的细节来传达图片的含义,但不要过于冗长。除非能够准确描述图片,否则请避免使用“图片”或“照片”等通用描述。

2. 让您的内容易于阅读和理解。

使用清晰、简洁且易于理解的语言。避免使用可能不是所有用户都熟悉的术语和技术术语。使用标题和副标题来划分内容,使其更易于阅读和浏览。保持段落简短,不要使用大段文字,否则内容不会按应有的方式显示。

3. 提供查看音频和视频内容的其他方式。

对于视频内容,请确保字幕在不同语言之间同步。对于音频,请务必提供完整的录音记录。

4. 为网站用户提供控制声音的功能。

音频控件允许用户调整网站上音频内容的音量。这对于有听力障碍的用户尤其重要。确保音频控件易于查找和使用,音频和视频内容不会干扰其他网站元素,并且清楚说明如何关闭它们(例如,始终可用的按钮可关闭弹出横幅)。

5:确保您的网站可以通过键盘完全正常运行。

有些用户可能无法使用鼠标或触摸板,因此确保您的网站完全可导航且可使用键盘使用至关重要。这包括使用 Tab 和 Enter 键访问所有链接、按钮和表单字段。

6:避免闪烁或闪动的内容。

闪烁的内容可能会分散用户的注意力并使其迷失方向,尤其是患有光敏性癫痫症的用户。避免使用会导致闪烁和过度动态的动画和过渡。

根据 W3C 的说法,每秒闪烁或闪动超过三次的内容可能会引发癫痫。

7. 让您的网站易于导航(逻辑地构建页面)。

用户应该能够快速在您的网站上找到所需的信息。确保您的导航清晰一致,并且页面结构合理。使用准确反映链接页面内容的描述性锚文本。

8. 留出充足的时间与您的网站互动。

给用户足够的时间阅读、查看和与网站上的内容互动。如果网站上的某些内容有时间限制,请确保用户可以延长或停止。对于附加(下拉)菜单也是如此,您应该为其设置关闭延迟。

9.提供有用的错误消息。

错误消息令人厌烦,因为它们会阻止用户访问必要的信息。因此,您应该清楚地描述错误,并提供有关访问者如何纠正错误或访问内容的说明。避免使用“发生错误”或“找不到页面”等通用消息。如果可能,请让错误页面建议其他信息来源。

10. 使用与辅助技术兼容的 HTML 代码。

辅助技术使用网页的 HTML 文件将其内容转换为其他格式。确保您网站的 HTML 与屏幕阅读器等辅助技术兼容。在适当的情况下使用开始和结束标记,并避免在单个 HTML 标记中使用重复的元素标识符和重复的属性。

为什么网络可访问性对于在线项目很重要?

如果正确实施,网络可访问性无疑会对任何企业产生积极影响。

  • 扩大受众范围。在许多国家/地区,让网站方便残障人士使用是一项法律要求。因此,从一开始就考虑无障碍性来构建网站将使您更容易进入新市场。
  • 对 SEO 的好处。虽然搜索引擎无法全面评估网站的可访问性,但满足许多要求将有助于您的网站在搜索引擎排名中排名更高。提供替代文本、优化 HTML 代码和减少错误消息将增加网站流量。
  • 品牌声誉和客户忠诚度。关注网站可访问性可以向客户表明您的品牌认可并关心所有人的福祉,从而提高客户忠诚度。
  • 改善用户体验。无障碍设计通常会改善用户体验。这反过来又会带来更高的参与度和更高的转化率。
  • 节省成本。在开发过程的早期阶段使网站可访问比后期修复成本更低。

遵循网络可访问性原则是一个明智的决定,因为它为各种规模的项目开辟了新的可能性。

结论

使网站可访问对个人、企业和整个社会都有重大影响。它确保每个人都可以访问在线信息和服务,无论他们是谁。这是任何涉及多个团队和专家的在线项目中至关重要的一步。轻松访问您的内容对于项目的成功至关重要。

赞(0)
未经允许不得转载;国外VPS测评网 » 提高网站可访问性10个最佳技巧
分享到