认知辅助功能

认知辅助功能涵盖了针对认知和学习障碍人士的无障碍考虑因素。本文介绍了认知辅助功能,以及如何改善 Web 对认知和学习差异人士的无障碍性。

认知障碍是指广泛的残疾,从智力障碍(可能具有最有限的能力)到与年龄相关的思考和记忆问题。该范围包括患有精神疾病的人,例如抑郁症和精神分裂症。它还包括学习障碍人士,例如阅读障碍和注意力缺陷多动障碍(ADHD)。

尽管在认知障碍的临床定义中存在很多差异,但这些障碍人士会遇到一系列共同的功能问题。这些问题包括难以理解内容、记住如何完成任务以及不一致或非传统网页布局造成的混淆。在本文中,我们将重点介绍开发人员应采取的步骤,以提高其网站和应用程序的认知辅助功能。

概述

认知和智力障碍涵盖了广泛的范围,并且可能是暂时的、临时的或永久性的状态。例如,痴呆和阿尔茨海默病是永久性认知障碍,并且会逐渐恶化。其他永久性认知障碍包括失语症、言语和语言、自闭症、多动症/注意力缺陷症、阅读障碍和计算障碍。

暂时性认知障碍的一个例子可能是受酒精或毒品等物质影响的人。另一种形式可能是抑郁症,例如在哀悼失去亲人时,或者因在网上看到推文或视频而暂时感到难过。第三个例子可能是睡眠不足。

解决各种认知差异似乎是一项艰巨的任务,尤其是在针对两个不同人的解决方案可能相互矛盾的情况下。一种处理方法是关注认知技能。认知技能包括

  • 注意力
  • 记忆
  • 处理速度
  • 时间管理
  • 字母和语言
  • 数字、符号和数学
  • 理解和做出选择

为认知障碍人士提供无障碍解决方案的可靠方法包括

  • 以多种方式提供内容,例如通过文本转语音或视频;
  • 提供易于理解的内容,例如使用简单语言标准编写的文本;
  • 将注意力集中在重要内容上;
  • 最大程度地减少干扰,例如不必要的内容或广告;
  • 提供一致的网页布局和导航;
  • 整合熟悉的元素,例如未访问时为蓝色,访问时为紫色的带下划线的链接;
  • 将流程划分为逻辑的必要步骤,并提供进度指示器;
  • 尽可能简化网站身份验证,而不影响安全性;以及
  • 使表单易于填写,例如提供清晰的错误消息和简单的错误恢复。

WCAG 指南

WCAG(Web 内容无障碍指南)包含多个指南,以改善认知辅助功能。这些指南由万维网联盟(W3C)的 Web 无障碍倡议(WAI)发布,它是互联网的主要国际标准化组织。该组织还负责可访问的富互联网应用程序(ARIA)指南。

WCAG 由四个原则指导:网站必须是可感知的、可操作的、可理解的和健壮的。为此,它们定义了 17 个具体指南,其中 6 个与认知辅助功能特别相关。

以下所有指南都有助于更多的人,而不仅仅是认知障碍人士。例如,能够延长需要通过短信发送到移动设备的身份验证码的应用程序的有效时间,有助于以下场景

  • 患有注意力或焦虑症的人。
  • 短期记忆力差或同时处理多项任务的人。
  • 技术知识水平较低的人。
  • 无线信号较弱的人。
  • 运动控制能力有问题的人。

适应性

指南 1.3 指出“内容应适应性强”。 创建可以以不同方式呈现的内容,而不会丢失信息或结构。 例如,提供响应式 布局,采用单列移动设计。

所有信息,包括通过呈现传达的结构和关系,都应以所有用户都能感知的形式提供,以实现此目标。 例如,信息可以通过旁白工具大声朗读。 使您的内容能够被软件理解,是帮助确保它可以被替代呈现模式使用的良好方法。

时间

允许用户花费完成任务所需的时间非常重要。 指南 2.2 指出“为用户提供足够的时间来阅读和使用内容”。

时间限制是指在设定时间后或定期发生的任何无需用户启动的流程,例如在 30 分钟后注销或在 15 分钟内进行购买。 认知障碍者可能需要更多时间来阅读内容或执行填写表格等功能。 解决方法包括为用户提供足够的时间来完成任务或完全消除时间限制。

计时器

调整时间要求的选项包括

  • 允许用户关闭或调整时间,至少达到原始限制的 10 倍,然后再遇到它。
  • 提醒用户并提供至少 20 秒的缓冲时间,以便通过简单的操作(例如按空格键)将超时持续时间延长 10 倍。

在内容上提供一个切换开关,允许用户启用更长的会话时间限制,或根本不设置会话时间限制。 定时内容的示例包括表格、定时阅读练习和培训材料。 如果时间限制超过 20 小时,则无需提供便利措施。

移动、闪烁、滚动

重要的是不要分散用户的注意力,尤其是认知障碍者。

如果移动、闪烁、滚动或自动更新信息自动开始,持续时间超过 5 秒,并且与其他内容并行呈现,则用户必须能够暂停、停止、隐藏或控制它,除非它是基本功能。“基本”是指删除移动、闪烁、滚动或自动更新信息将从根本上改变内容和/或功能的含义,并且无法以符合标准的其他方式实现信息和功能。 这包括动画 GIF,如果 GIF 的动画持续时间超过 5 秒。

其他需要考虑的时间标准包括

  • 认知或语言能力有限的人可能需要更多时间来阅读和理解。 为了提高可用性,请删除任何时间限制。 应避免使用定时内容,非交互式同步媒体和实时事件除外。
  • 患有注意力缺陷障碍的人应该能够在没有干扰的情况下专注于内容。 用户应该能够推迟或抑制中断,紧急情况下的提醒除外。 这通过使他们能够专注于内容的主要目的,为认知障碍者提供了访问权限。 通过提供一种请求内容更新而不是自动更新的方法,使用户能够推迟内容更新。 此外,启用一种方法使非必要警报可选。
  • 确保人们可以在重新验证已过期会话后继续执行活动,而不会丢失数据,例如保存问卷的状态。 确保以可以重新验证用户后修改数据的方式保存数据。 在重新验证之前,将数据编码为隐藏或加密。
  • 提供有关可能导致数据丢失的非活动警告。 当使用超时时,请告诉人们准确的时间会导致会话超时并导致数据丢失。 唯一的例外是在 20 小时内没有任何操作的情况下保留数据。

指南 2.4 指出“提供方法帮助用户导航、查找内容并确定他们身在何处”,并提供 10 条指南来确保网站可导航且内容可找到

包含一个<title>

务必包含一个<title> 用于文档,因为标题提供了一个快速简便的参考,用于描述屏幕的主要内容。 认知障碍者、短期记忆力有限者和阅读障碍者都可以通过这种方式识别内容的用途,从而受益。

标题和标签

包含清晰且描述性的标题,以便用户可以轻松查找信息并了解不同内容部分之间的关系。 描述性标签可以帮助用户识别内容中的特定组件。 阅读速度慢和短期记忆力有限的人,如果标题可以预测每个部分包含的内容,他们会从中受益。

节标题

标题有助于定义页面内容的总体组织。 它们有助于通过页面内容部分进行导航,并提供一种机制来帮助理解。 标题的示例包括内容的章节、节和子节等等。

与其他用于识别页面内容部分的方法(边框、空白、水平规则等)相比,标题是更明显的导航辅助手段。

查找内容的多重方法

不同的用户喜欢不同的查找信息的方法,因此为用户提供多种查找网站上内容的方法非常重要。

提供不止一种导航网站的方法可以帮助人们更快地找到信息。 一些用户可能更喜欢目录、网站地图或搜索功能,而不是阅读和遍历多个页面来找到他们需要的东西。 其他用户可能更喜欢以顺序的方式浏览网站,从一个页面移动到另一个页面,以更好地了解网站的布局、内容和概念。

能够绕过内容块

提供一种机制(例如,跳过链接)来绕过在多个网页上重复出现的内容块。

焦点顺序有意义

交互式元素的焦点顺序应该有意义。 为实现这一点,DOM 顺序应与视觉顺序匹配,而视觉顺序又应与选项卡顺序匹配。 如果选项卡顺序跳来跳去,尤其是以一种与使用键盘导航时的视觉顺序不匹配的方式,用户可能会感到迷茫。

获得焦点的元素应明显获得焦点

当用户使用键盘导航时,UI 应该清楚地表明哪个元素当前获得了焦点。 不要更改或删除浏览器的默认:focus 样式,除非您要使焦点更加明显。

链接文本应清楚简洁地传达用户激活它后应导航到的内容。 表达不佳的链接文本可能会让用户对它的用途或目的地感到困惑。

某些辅助技术允许用户通过页面上所有链接的列表进行导航。 链接将从其周围的非链接内容的上下文中删除,这使得对可理解的链接文本的需求更加重要。 糟糕体验的示例是,一个页面上全是链接,其文本是“单击此处”。 如果没有指明“此处”将带您到哪里,则链接的用途不清楚。

对于屏幕阅读器,链接文本描述每个链接的用途至关重要。 如果您为屏幕阅读器添加了链接的内容,并且该内容冗长且可能对有视力的读者造成混淆,请考虑剪切添加的文本以在视觉上将其隐藏起来,使其不被使用辅助技术的人看到。

当前位置可用

用户应该能够在网站或应用程序中定位自己。 这对于注意力跨度短的人来说尤为重要且有帮助,因为他们可能在遵循一系列漫长的导航步骤时感到困惑。

所有用户都可以从有关他们在网站层次结构中的位置的信息中受益,尤其是对于内容量大或子部分众多的网站或应用程序。 面包屑导航网站地图 和在导航中识别当前页面为“当前”都是帮助传达当前位置的技术。

可读性

指南 3.1 指出“使文本内容可读且易于理解”。 对于某些用户来说,很难从上下文中推断出单词或短语的含义,尤其是在单词或短语以不寻常的方式使用或被赋予了专门的含义时。

对于这些用户来说,阅读和理解的能力可能取决于特定定义或首字母缩略词或缩写的扩展形式的可用性。 一些用户可能会在识别书面单词方面遇到很大困难,但当文本被朗读或当关键流程和想法以视觉方式说明时,他们会理解极其复杂和复杂的文档。

声明页面的语言和任何非该主要语言的内容

每个页面的语言都必须通过在lang 属性上使用<html> 元素来声明。 在以除文档主要语言以外的语言编写的文本上再次包含lang 属性。

正确使用lang 允许一些屏幕阅读器在将文本转换为合成语音时正确地宣布该文本。 它还有助于使用文本到语音软件的人。

定义不寻常的单词和单词用法

某些残疾使人们难以理解非字面意义的单词用法,例如习语、口语和专业术语。 非母语人士也可能难以理解这些术语。 如果一个单词或短语在文档中具有独特的含义,请在内联或链接、词汇表中或链接到在线词典中提供定义。 如果一个单词或短语有多种含义,请定义每种用法。

定义缩略词

缩略词可能会让以下人感到困惑

  • 在解码单词方面有困难。
  • 记忆力有限。
  • 在使用上下文来帮助理解方面有困难。
  • 依赖屏幕放大器(通常会减少上下文线索)。

首次使用缩略词时,提供缩略词的扩展形式,然后将缩略词放在一个<abbr> 元素中。 如果缩略词没有扩展形式,或者是一个不在文档主要语言中的单词的缩写(例如拉丁语),请解释其含义。 此外,请考虑使用ruby 文本 来表示首字母缩略词(首字母缩略词的发音)。

阅读水平

内容应尽可能清晰地编写。 一个很好的准则是使内容足够简单,以便可以第一次理解。 实现这一目标的方法包括

  • 使用简短的简单词语。
  • 编写简短的句子。
  • 在现在时态中使用主动语态。
  • 使用正确的语法和拼写。

为认知障碍者提供低阅读水平的文本摘要(有时称为 TL;DR 或“太长;没读”)会有所帮助。 您可以使用的另一种技术是提供辅助视觉效果来帮助解释想法、事件和流程。

有一些工具可以评估您的内容水平。 例如,本文档的平均年级水平约为 11。 这意味着 16 到 17 岁的英语母语人士应该可以轻松理解它。 一些工具甚至可以提供建议来帮助简化它。

发音

有许多技术可以帮助人们学习如何发音

  • 在单词后面立即提供发音。
  • 链接到发音列表。
  • 提供包含发音的词汇表。
  • 使用<ruby> 元素来说明如何发音一个词。

提供有关如何发音单词的指导,可以帮助许多不同类型的人,包括那些喜欢大声朗读的人、非母语人士和不熟悉术语在上下文中的含义的人。

另一个解决方案是使用字形或变音符号来说明发音。但是,如果使用此技术,必须有一种机制来将其关闭。此外,将链接到正在使用的标记的指南很有帮助,因为它们的含义可能并不明显。

可预测性

WCAG 指南 3.2 指出“使网页以可预测的方式显示和操作”。这是良好的用户体验设计的一项原则。一致性对于认知障碍人士尤为重要。这包括页面布局的一致性和可预测的交互式组件。

使用激活,而不是焦点来改变上下文

创建上下文变化应该是故意的。因此,当 UI 功能接收 焦点 时,它不应触发进一步面向用户的操作。相反,用户应该需要“激活”功能以触发更改。

根据活动请求更改设置

表单控件操作和数据输入应产生可预测的行为。上下文变化会让认知障碍用户感到困惑,因此只有在清楚地知道这种变化是响应用户的操作而发生时,才会发生。

更改状态应需要用户有意操作。例如,选中复选框、输入数据或更改选择选项。还要确保提供一个提交按钮来启动上下文更改,并在更改之前描述将要发生的事情。

保持整个网站的导航一致

保持页面之间导航顺序的一致性。例如,如果在多个页面上都有一个导航栏,请确保该导航在整个网站上保持一致,并在相同位置使用相同的链接。这不仅适用于导航:每次出现重复的组件时,都以相同的相对顺序呈现它们。

提供一致的标签

相同的功能应在每次使用时具有类似的标签。一致的按钮标签、图标的替代文本和类似交互的图标等,即使在您网站的不同部分,也能帮助所有用户。

保持一致性和可预测性,并使用规范

虽然未标记的图标不是传递信息的最佳方法,但保持图标的使用(如果已标记,则包括其标签文本)的一致性有助于人们理解图标代表什么。同样,不要更改浏览器的后退按钮之类的默认值。如果您需要重定向用户,请事先告知用户。

输入辅助

指南 3.3 有助于确保准确的数据输入,指出“帮助用户避免和纠正错误”。虽然我们都会犯错,但有些人更容易犯错,不太可能注意到错误,或者在犯错后更难纠正错误。

输入帮助指南旨在减少用户(尤其是残疾人)犯错的可能性,并且如果他们确实犯了错,则提高他们看到和理解错误消息并能够成功修复任何错误的可能性。

传达自动错误检测

用户需要被提醒错误并被告知问题所在。如果存在客户端错误检测,请遵守以下指南,使错误在传达给用户时尽可能有效。

  • 错误必须在文本中描述。
  • 确保错误消息尽可能具体。
  • 提供文本以标识未完成的必填字段,以及在输入的值无效时提供文本描述。
  • 如果错误阻止表单提交,请将焦点放在错误上。如果存在多个错误,请提供摘要,并将每个错误链接到相关输入。
  • 除了使用图标、图像、颜色等之外,还包括文本。有些人难以理解图标和其他视觉提示的含义。
  • 另一些人可能难以理解错误消息的文本版本。对于这些人,还要提供图标和颜色等。
  • 此外,还要提供表单成功提交时的反馈。

提供用户输入说明

从有关如何操作表单的文本说明开始。在用户需要输入信息时,包括标签或说明,使用 <label><fieldset><legend> 元素来实现这一点。

标签应该具有描述性,并且应位于与其相关的输入附近。当需要以特定格式输入时,请提供以正确方式格式化的示例。此外,请考虑执行服务器端验证以帮助格式化输入数据,以帮助简化用户输入。

如果表单控件是必需的,请以视觉方式和 通过代码 指示它。如果表单控件更改上下文,请以用户能够理解的方式描述将会发生的事情,然后再让他们导致上下文更改。

错误建议

如果自动检测到输入错误并且已知纠正建议(除非这样做会危及内容的安全性或目的),请向用户提供建议的输入。

防止灾难

对于会导致或可能导致法律、财务或其他重大后果的提交,请确保提交可以被审查、确认和/或可逆。

在提交之前应检查用户输入的数据是否存在错误,并且应让用户有机会更正错误。用户应该能够在最终提交之前查看、确认和更正信息。此外,请务必在提交按钮之外包含一个确认复选框。

如果提交导致发生法律或财务交易,请提供用户可以修改或取消请求的规定时间。

提供帮助

应提供上下文相关的帮助。如果表单需要文本输入,请提供表单说明,描述目的和必要的输入。包括拼写检查和长文本输入建议,以及指向帮助和支持材料的链接。如果需要特定数据格式进行输入,请提供示例。

注意

以上是良好的设计实践。它们将使每个人受益。

  • 许多有认知障碍的人也患有身体残疾。网站必须符合 W3C 的 Web 内容无障碍指南
  • W3C 的 认知和学习障碍无障碍工作组 为认知障碍人士制定了网络无障碍指南。
  • WebAIM 有一个 认知页面,其中包含相关信息和资源。
  • 美国疾病控制与预防中心估计,截至 2018 年,美国有 1/4 的公民有残疾,其中 认知障碍在年轻人中最常见
  • 在美国,“智力残疾”过去被称为“智力迟钝”。在英国,“智力残疾”通常被称为“学习障碍”或“学习困难”。

另请参阅