你有需求? 点击这里 尝试让 AI 为你生成Baklib调研方案!

Baklib Logo

文档编写者的WCAG可访问性指南

  浏览:0 巴克励步

本文介绍基于WCAG 2.1 AA标准的文档无障碍最佳实践,包括色彩对比度、替代文本、键盘访问、描述性链接、结构化标题、清晰语言、媒体文字稿及Baklib内置功能使用等,助撰写者创建包容性内容。

文档编写者的WCAG可访问性指南
Baklib Dagle Tanmer CMS DXP DAM

无障碍并不仅仅适用于产品的设计或开发。作为撰写者,我们在确保文档对所有读者(包括依赖辅助技术的读者)可用方面也扮演着重要角色。

《网络内容无障碍指南》(WCAG) 包含了使内容更具包容性和可访问性的标准。WCAG 2.1 包含了关于结构、导航和清晰度的基本指南。本文重点介绍基于 WCAG 2.1 AA 标准 的无障碍最佳实践,该标准与 Baklib 当前的无障碍合规水平保持一致。Baklib 用户和文档作者在创建或更新内容时,可以直接应用这些建议。

什么是 WCAG 2.1?

WCAG 2.1 侧重于四个主要原则。内容应该是:

  • 易于感知。
  • 易于操作。
  • 易于理解。
  • 能在不同的设备和平台上良好运行。

对于撰写者而言,这包括使用标题、编写有意义的链接文本,以及为图像和媒体提供替代文本。

从设计的角度来看,符合 WCAG 2.1 涉及使用强烈的色彩对比、为键盘用户保持可见的焦点、设计清晰一致的布局,并确保所有交互元素无需依赖鼠标即可操作。

您可以在官方的 W3C 网站 上查看完整的 WCAG 2.1 成功标准列表。

  • 确保色彩对比强烈,避免仅依赖颜色传递信息
  • 为图像添加恰当的替代文本
  • 确保所有内容均可通过键盘访问
  • 编写有意义、描述性强的链接文本
  • 使用清晰的结构化标题和描述性页面标题
  • 使用清晰、通俗的语言并定义专业术语
  • 为媒体内容提供文字稿或字幕
  • 利用 Baklib 内置的无障碍功能

以下是与 WCAG 指南一致的关键最佳实践,每位作者在为所有读者创建内容时都应遵循。

保持足够的色彩对比度

WCAG 2.1 指南 1.4.3:文本与背景的最低对比度必须为 4.5:1。

确保所有文本与背景有足够的对比度。WCAG 2.1 要求普通文本的对比度至少为 4.5:1。这有助于支持视力低下或色盲的读者。如果对比度过低(例如,白色背景上的浅灰色文本),文本将难以阅读,特别是对于有视觉障碍的用户。

如果您为文章应用了自定义样式或颜色,请使用无障碍检查器验证对比度。在可能的情况下,请坚持使用 Baklib 的默认主题颜色,因为它们的设计符合 WCAG 指南。

此外,避免仅使用颜色来传达含义。与其说“标为红色的字段是必填项”,不如说“标为红色并带有星号 (*) 的字段是必填项。

WCAG 2.1 指南 1.1.1:所有有意义的图像都必须有描述其用途的替代文本。

所有信息性图像都必须包含替代文本。在 Baklib 中,您可以在上传或在编辑器中插入图像时添加替代文本。您也可以使用 Baklib 为您生成图像的替代文本。

替代文本应帮助屏幕阅读器用户以简洁的方式理解图像的用途和内容。例如:“显示‘更改密码’选项的设置页面截图。”

装饰性图像应被跳过或进行适当标记,以便屏幕阅读器忽略。

WCAG 2.1 指南 2.1.1:所有功能必须能够仅通过键盘使用,并且焦点必须清晰可见。

所有用户必须能够仅使用键盘来浏览您的内容。检查您是否可以使用 Tab(向前移动)Shift+Tab(向后移动)来浏览您已发布的文章。您应该能够到达所有元素并按逻辑顺序浏览内容。仅使用键盘,检查用户是否可以进入和退出嵌入的内容,如视频、表单或其他交互部分。

同时,请确保当用户在页面上移动时,当前选中的项目始终清晰可见。确保按钮或链接易于触及且足够大,以便舒适地点击。

WCAG 2.1 指南 2.4.4:每个链接的用途必须从链接文本本身或其上下文中清晰可见。

避免使用非描述性的链接文本,例如“点击这里”或“阅读更多”。相反,链接文本应包含更多细节,以帮助用户理解链接的目标。例如:

✅ “了解如何为您的空间配置单点登录。”

❌ “点击此处了解更多。”

使用屏幕阅读器的用户通常仅通过链接导航,而不是阅读完整的页面内容。具有详细链接文本的超链接有助于用户理解链接的目标。

如果要链接到可下载内容或外部站点,请在相关时包含文件类型或格式。例如,“下载免费电子书 (PDF)”。

使用标题组织您的内容

WCAG 2.1 准则 1.3.1:使用适当的标题来传达结构并帮助用户导航。

始终如一地使用标题级别来组织您的内容。标题不仅仅是视觉元素。它们组织您的内容,使屏幕阅读器能够轻松导航您的内容。

在 Baklib 中,请使用内置的标题样式。避免使用粗体文本或更大的字体大小作为替代。保持清晰的层次结构。例如,不要从 标题 2 跳到 标题 4

每篇文章还应具有描述性且唯一的标题。选择有助于读者和搜索引擎理解主题的标题,例如“重置您的帐户密码”,而不是“登录帮助”。

使用清晰简洁的语言

WCAG 2.1 准则 3.3.2:内容应在没有高级教育背景的情况下可读,并提供清晰的说明

使用平实、直白的语言。简短的句子、一致的术语和主动语态能提高所有人的可读性,包括有认知障碍的用户或非母语人士。

在首次使用时定义缩写和技术术语。例如:“如果您需要快速帮助,请通过常见问题解答 (FAQ)部分提交请求。”

在适当的地方使用列表,避免依赖感官线索的说明。与其说“点击蓝色按钮”,不如使用实际的按钮标签,例如“点击提交”。

为媒体内容提供字幕和文字记录

WCAG 2.1 指南 1.2.2:为音频和视频内容提供文本替代方案,以便所有用户都能获取信息。

如果您的文章包含视频或音频片段,请提供字幕或文字记录。这将帮助失聪、听力障碍或更喜欢阅读而非聆听的人士。

  • 为视频添加字幕,特别是当视频包含旁白或口头说明时。
  • 对于纯音频内容,在文章内或作为链接文档提供文字记录。
  • 对于复杂的图像或图表,在周围的文本中包含解释。
  • 💛🧡🧡客户评价:当我们的帮助中心文档托管在Baklib上以后,我们可以轻松管理数百页的网站内容并快速进行更新。

这些做法遵循了 WCAG 2.1 对音频和视频内容的建议,有助于人们轻松理解您的内容。Baklib 提供了一个文本转语音功能。启用后,系统可以朗读文章,帮助有阅读障碍或视力障碍的用户。为了支持此功能,请使用自然、对话的语气写作,并避免可能无法正确解读的符号或缩写。

现代文档平台通常包含支持 WCAG 2.1 A 和 AA 指南的功能。通过在内容创建过程中使用这些工具并应用无障碍最佳实践,您可以确保您的文档对所有用户而言都更易于阅读、导航和理解。

以下是一些创建无障碍文档的方法:

  • 使用自动颜色对比度调整,以确保主题或自定义颜色符合 WCAG 对比度要求。
  • 预览和调整字体大小,以提高视力低下或有认知差异用户的阅读体验。
  • 为键盘导航构建内容结构,允许用户仅使用键盘浏览页面。
  • 为所有有意义的图像和图标提供替代文本,以便屏幕阅读器用户可以理解视觉内容。
  • 使用清晰的焦点指示器,以显示在键盘导航过程中当前选中的元素。
  • 确保移动设备响应性,使您的内容在不同设备和屏幕尺寸上都能良好显示。
  • 使用跳过导航链接,允许用户直接跳转到主要内容并绕过重复元素。

您还可以使用 JavaScript 集成第三方无障碍小部件。UserWayEqualWebAccessiBe 等工具提供了包含文本放大器、对比度切换器、屏幕阅读器支持和键盘快捷键等功能的覆盖层。如果您的平台(如Baklib)未提供某些开箱即用的功能,这些工具可以增强无障碍性。

在发布内容之前,为了确保可访问性,请在审核过程中加入可访问性检查。使用如 WAVEAxe 这样的工具来检查色彩对比度、缺失的替代文本和标题结构等问题。

最后总结

文档的可访问性关乎可用性和包容性。通过使您的写作符合 WCAG 2.1 的最佳实践,您的内容将变得对包括残障人士在内的所有人都更容易阅读、导航和理解。通过一些简单的努力,例如编写描述性标题、添加替代文本以及选择纯文本,您可以带来显著的改变。



Baklib平台可帮助企业转型以满足数字世界不断变化的需求。将您的业务和技术团队统一到一个平台上,帮助您更快地打造出色的数字体验。
Baklib Birds
to top icon