[AEM Forms]{class="badge positive" title="适用于AEM Forms)。"}

创建无障碍的自适应Forms creating-accessible-adaptive-forms

简介 introduction

无障碍表单​是每个人都可以使用的表单,包括具有特殊需求和残疾的用户。 自适应Forms包含内置的辅助功能和特性,例如支持​辅助技术、键盘导航、与屏幕阅读器兼容的标签和可配置的颜色对比度,这些功能和特性可增强不同功能用户的可用性。 在自适应Forms中构建辅助功能有两个相互关联的目的:它向尽可能广泛的受众打开内容,并履行法律和监管义务。 由于许多司法管辖区在提供数字文档时要求遵守公认的无障碍标准,因此在这些地区,无障碍不仅是最佳做法,而且是符合​ 要求 ​的要求。 AEM Forms​帮助表单开发人员满足这些辅助功能标准。

在创作自适应表单时,表单作者必须解决以下注意事项才能构建可访问的自适应表单:

  • 使用可访问的名称和描述检查器(ANDI)进行测试 — 使用ANDI可访问性测试工具验证表单,以确认每个控件都公开可访问的名称和描述,确保辅助型技术能够正确解释每个字段。
  • 为表单控件提供适当的标签 — 将清楚的描述性标签与每个输入、复选框和选择控件相关联。 这可确保屏幕阅读器朗读每个字段的用途,并允许所有用户了解需要哪些信息。
  • 为图像提供等效文本 — 为图像和非文本内容提供替换文本,以便看不到图像的用户仍然可以通过辅助技术接收相同的信息。
  • 提供足够的颜色对比度 — 确保文本颜色和背景颜色之间有足够的对比度。 足够的对比度使视力低下或色觉缺失的用户容易理解内容。
  • 确保表单控件可使用键盘 — 使每个控件都可单独使用键盘操作。 对于无法使用鼠标并依赖键盘导航或其他输入设备的用户而言,这一点至关重要。

先决条件

创建无障碍自适应表单需要两个基本工具:无障碍检查工具和无障碍优化表单主题。 这些工具共同使您能够构建符合辅助功能标准的表单,并为依赖辅助技术(如屏幕阅读器)的用户正常运行这些表单。

所需工具:

  • 辅助功能名称和描述检查器(ANDI) — 辅助功能测试工具,用于检查每个表单元素以验证它是否公开正确的辅助功能名称和描述。 ANDI可帮助您识别辅助型技术无法解释的组件,这样您就可以在发布表单之前找到并纠正辅助功能之间的差距。
  • 为修复可访问性相关问题而开发的自适应表单主题 — 为解决常见可访问性问题而专门设计的主题。 此主题跨表单组件应用无障碍样式、焦点指示器和标记约定,确保呈现的表单满足无障碍要求,而无需手动修正每个元素。

将​ ANDI ​与侧重于辅助功能的自适应表单主题一起使用,可确保表单具有可检查性和结构正确。 因此,完成的自适应表单更适合残障人士使用,也更可能满足无障碍合规性期望。

如何下载和安装ANDI:适用于Section 508合规性的辅助功能测试工具

可访问的名称和描述检查器(ANDI)​是美国​ 国土安全部 ​的​ 受信任的测试者v5 ​准则中推荐的可访问性测试工具。 ANDI由美国​ 社会保险管理(SSA) ​开发,它评估Web内容是否符合​ 第508 ​节的辅助功能要求。 第508款是联邦标准,要求残疾人能够使用电子和信息技术,确保平等地获得数字内容。

ANDI使开发人员、测试人员和内容作者能够直接在Web内容中识别和修复无障碍合规性问题,使其成为必须证明符合Section 508的组织的可靠参考工具。

ANDI工具执行以下核心功能:

  • 检测网页上的辅助功能问题,标记不符合合规标准的元素,以便在发布之前对其进行更正。
  • 提供切实可行的建议​以提高可访问性,指导测试人员完成符合规范的修复,而不是简单地报告问题。
  • 识别键盘辅助功能和颜色对比度问题,因为依赖键盘导航或视力缺佳的用户依赖这些元素与内容交互。
  • 明确标识符合辅助功能标准的屏幕阅读器内容,以便测试人员能够准确确认用户将听到什么辅助技术。

ANDI跨所有主要的Web浏览器运行,因此无论测试环境如何,它都可以广泛使用。 有关配置和使用工具的详细说明,请参阅ANDI的文档。

下载并安装Ultramarine-Access主题

Ultramarine-Accessible主题​是​ Adobe Experience Manager (AEM) ​自适应Forms的​参考主题。 它演示了如何在自适应表单中修复​ 颜色对比度 ​和其他​辅助功能相关问题,帮助团队根据公认的辅助功能期望调整其表单。 由于它是参考主题,因此Adobe建议根据组织批准的样式为生产环境​ 创建 ​自定义主题,然后重复使用Ultramine-Accessible主题作为工作示例。 执行以下步骤以将主题上载到​ Adobe Experience Manager (AEM) ​实例:

  1. 将主题包下载到本地计算机,以便可以上传。
  2. 在您的AEM实例上导航到​Experience Manager > 导航 导航 > Forms。
  3. 选择​创建 > 文件上传。 选择并上传​ Ultramarine-Accessible-Theme.zip ​文件。 此操作会将主题上传到您的AEM实例,使其可用于您的自适应Forms。

上传后,主题将显示在AEM Forms中的可用主题中,并且可以应用于自适应表单或用作构建组织批准的生产主题的起点。

使自适应表单可访问

使自适应表单可访问需要关注四个关键方面:键盘导航、颜色对比度、有意义的图像替代文本​和​表单控件的适当标签。 这四个方面共同确保了依靠辅助技术(包括屏幕阅读器、仅键盘导航和屏幕放大镜)的人能够无障碍地完成表单。 无障碍表单也符合广泛引用的标准,例如​Web内容无障碍准则(WCAG),许多组织将其视为包容性数字体验的基准。

表单作者可以通过解决以下四个方面中的每一个来访问现有的自适应Forms。

​1. 启用键盘导航

键盘导航可确保无法操作鼠标的用户(包括许多屏幕阅读器用户和运动障碍人士)仅使用键盘即可浏览和提交表单。

  • 验证每个字段、按钮和交互控件都可以接收焦点,并使用​Tab、Shift+Tab​和​ Enter ​键激活。
  • 确认焦点顺序遵循逻辑读取顺序,因此用户会按照内容的显示顺序在表单中移动。
  • 确保显示焦点指示器突出显示当前选定的控件,因为通过键盘导航的用户需要查看他们在页面上的位置。

​2. 确保足够的颜色对比度

文本及其背景之间的充足颜色对比度使视力低下或色觉缺失的用户能够阅读内容。

  • 选择符合​ Web内容辅助功能准则(WCAG) ​中定义的识别对比度阈值的前台和后台颜色组合。
  • 避免仅通过颜色传递信息;将颜色提示与文本、图标或模式配对,以使含义对无法区分特定颜色的用户保持清晰。
  • 在不同显示条件下测试表单,以确认标签、说明和错误消息仍然清晰可见。

​3. 为图像提供有意义的替换文本

有意义的替代(alt)文本允许屏幕阅读器向看不到图像的用户描述图像,确保不会丢失任何信息。

  • 向每个信息性图像添加简洁的描述性替换文本,以便辅助型技术可以传达其目的。
  • 描述图像的功能或内容,而不是简单地将其标记为“图像”或重复文件名。
  • 标记纯粹的装饰性图像,以便辅助技术跳过它们,从而防止屏幕阅读器用户出现不必要的混乱。

​4. 为表单控件添加适当的标签

清晰、以编程方式关联的标签告知用户每个字段需要哪些信息,这对于可用性和屏幕阅读器解释都至关重要。

  • 将描述性标签与每个输入字段、复选框、单选按钮和下拉列表关联,这样辅助型技术即可发出正确的提示。
  • 使用无障碍的描述以及​ 无障碍的富互联网应用程序(ARIA) ​属性(如适用)来传达必填字段、格式要求和验证错误。
  • 确保说明和错误消息与其相应的控件相关联,以便用户了解要更正的内容及其原因。

通过解决键盘导航、颜色对比度、替换文本和表单标签问题,表单作者将现有自适应表单转换为包容性的体验,该体验面向更广泛的受众,并支持对既定的辅助功能标准的合规性。

​5. 应用可访问的主题并执行其他修复

将​ Ultramarine-Accessible ​主题应用于现有自适应表单。 要应用主题,请执行以下操作:

  1. 打开自适应表单进行编辑。
  2. 选择组件并选择父级图标。 在上下文菜单中,选择​自适应表单容器,然后选择配置图标。
  3. 在属性浏览器中选择​ Ultramarine-Accessible ​主题,然后选择​ 保存 ​图标。
  4. 刷新浏览器窗口。 该主题将应用于自适应表单。

应用主题后的其他辅助功能修复

应用辅助功能主题后,请执行以下列出的其他修复。 除了这些修复之外,无障碍主题已经涵盖了辅助功能修复:

  1. 在自适应表单中为徽标图像添加有意义的替换文本。

    为自适应表单模板的页眉和页脚组件中的图像提供有意义的替换文本。 修复模板并使用它创建自适应表单时,自适应Forms会继承应用于模板页眉和页脚的所有与辅助功能相关的修复。 对于现有的自适应表单,在自适应表单级别进行更改。 对自适应表单模板所做的更改不会自动流向现有的自适应表单;您必须直接在自适应表单级别应用这些更改。 有意义的替换文本至关重要,因为屏幕阅读器会向看不到图像的用户朗读此文本,以便他们了解徽标的用途。

  2. 将包含表单名称的标题组件添加到自适应表单。 如果您的窗体设计指定了公司名称,则还要为公司名称添加单独的标题组件。

    如何应用标头样式

    大多数辅助工具都可传达内容的层级,以帮助用户了解网页的结构。 在自适应表单中为组织名称和表单名称文本设置不同的标题级别,为这些文本元素提供清晰的分层结构。 此外,还可以使用在每个面板和节之前具有适当标题级别的文本组件,以创建一致的层次结构。 此标题结构允许屏幕阅读器用户按标题导航表单,并了解各个部分如何相互关联。

  3. 根据辅助功能标准更改页脚背景颜色以使用相应的对比度。 文本和背景之间的充分对比度直接提高了文本的可见性和可读性,因为弱视用户依赖于足够的颜色对比度来区分内容。 您可以使用​ ANDI (可访问的名称和描述检查器) ​查找表单中的颜色对比度问题。 此外,应避免使用非常小的字体,因为较小的字体会降低视力缺佳用户的易读性。

  4. 将现有自适应表单中的开关和图像选择组件替换为选择(单选)组件。 这可以确保屏幕阅读器正确宣布选项,并且使用键盘导航可以可靠地操作选项。

  5. 将现有自适应表单中的数字步进器组件替换为数字框组件。

  6. 将日期输入字段替换为日期选取器字段。

  7. 设置日期选取器组件的显示、验证和编辑模式。 此外,设置自定义验证错误消息。 例如:您指定的日期无效。 正确的日期格式为YYYY-MM-DD。 清晰、具体的错误消息有助于所有用户(包括依赖辅助技术的用户)理解和更正其输入。

  8. 为日期选取器组件设置自定义辅助功能文本。 例如:输入您的出生日期。 屏幕阅读器会大声朗读这些自定义辅助功能文本,为用户提供完成字段所需的上下文。

  9. 使用简短的描述而不是对自适应表单组件的详细说明。 较长的描述会添加一个帮助按钮,添加帮助按钮可能会为辅助型技术用户带来额外的导航复杂性。 确保自适应表单没有任何帮助按钮。

  10. 向表的所有只读单元格添加自定义辅助功能文本。 此外,请禁用表的所有只读单元格,以便辅助型技术可以正确地表明这些单元格不可编辑。

  11. 从自适应表单中删除潦草签名字段(如果有)。 配置自适应表单以使用Adobe Sign实现无缝和可访问的数字签名体验。

​6. 为表单控件提供适当的标签 provide-proper-labels-for-form-controls

表单控件标签标识表单组件所代表的内容。 例如,文本“名字”告诉用户必须在文本字段中输入其名字。 要使辅助技术能够使用此标识,可访问的标签必须以​编程方式与表单控件关联,这意味着该关系在基础代码中定义(不仅隐含于视觉位置),以便辅助工具能够可靠地检测它。 或者,表单控件配置有附加的可访问性信息。

由于屏幕阅读器依赖于程序化关联而不是可视布局,因此对于看不到界面的用户而言,仅在屏幕上显示标记的控件可能仍不可用。 这种关联确保当用户导航到字段时,屏幕阅读器会朗读正确的标签,从而减少错误并提高辅助技术用户的表单完成率。

屏幕阅读器感知到的标签不必与可视字幕相同。 在某些情况下,作者可以比可见文本更具体地说明控件的用途。 对于表单中的每个字段对象,辅助功能选项可准确指定屏幕阅读器会朗读的内容,以识别特定的表单字段 — 当简短的可视标签(如“名字”)需要更完整的口语描述以便清楚表述时,该选项非常有用。

要配置辅助功能选项,请执行以下步骤:

  1. 选择一个组件并选择 cmppr 。
  2. 单击侧边栏中的​ 辅助功能 ​以选择所需的辅助功能选项。

然后,选定的辅助功能选项可确定屏幕阅读器为该表单字段朗读的文本,从而完成控件的程序化标签设置。

表单组件中的辅助功能选项 accessibility-options-in-form-components

表单组件中的辅助功能选项

每个表单组件支持多个可确定辅助技术(如屏幕阅读器)所声明文本的可访问性选项。 选择正确的选项可确保依赖屏幕阅读器的用户可以准确地识别和完成每个字段。

自定义文本​表单作者在辅助功能选项自定义文本字段中提供内容。 辅助技术(如屏幕阅读器)使用此自定义文本。 仅在使用标题或简短描述时无法创建​自定义屏幕Reader文本,因为它需要手动维护独立于可见标签的措辞。

简短说明​对于大多数组件,当用户将指针悬停在组件上时,会在运行时显示简短说明。 表单作者在帮助内容选项下的简短描述字段中设置此选项。

在大多数情况下,建议使用​ 标题 ​辅助功能选项。 使用此选项可让Adobe Experience Manager (AEM) Forms使用与表单字段关联的可视标签作为屏幕阅读器文本。 由于标题会重用字段的现有可见标签,因此它与视力正常的用户所看到的内容保持一致,并减少替换文本不匹配或过时的风险。

名称​表单作者在“绑定”选项卡的“名称”字段中指定一个值。 名称值不能包含空格。

无​选择“无”会导致表单对象在已发布的表单中没有名称。 因此,屏幕阅读器无法将控件公告给用户,导致该字段实际上没有标签。 “无”不是​ 表单控件 ​的建议设置,应尽量避免使用可访问的标签。

NOTE
  • 单选按钮和复选框仅支持两个辅助功能选项:自定义文本和标题。
  • 对于基于XML Forms架构(XFA)的自适应Forms,可访问性选项直接继承自XML数据包(XDP)中设置的可访问性选项。 XDP中的工具提示被映射到简短描述,并且字幕被映射到标题。 其他选项按原样工作。

​7. 为图像提供等效文本 provide-text-equivalents-for-images

表单中的每个图像都必须包含替换文本(替换文本)。 替换文本是一种书面说明,辅助技术可代替图像朗读,使看不到该图像的人可以访问可视化内容。

虽然图像可提高视力正常用户的理解能力,但无描述的图像会降低依赖屏幕阅读器的用户的辅助功能。 添加图像时,请始终为每个图像提供文本描述,这样就不会将任何用户排除在图像传输的信息之外。

确保替换文本描述显示的对象以及该对象在表单中的用途。 屏幕阅读器会在遇到图像时朗读此替换文本,从而使用户无需看到图像即可了解图像的含义和角色。 正因为如此,图像必须始终指定替换文本 — 屏幕阅读器用户实际上看不到没有替换文本的剩余图像。

如何向图像添加替换文本:

图像的替换文本

  1. 选择表单中的图像组件。
  2. 选择 cmppr 。
  3. 在侧边栏的​ 属性 ​下,指定图像的替换文本。

​8. 提供足够的颜色对比度 provide-sufficient-color-contrast

辅助功能设计涉及考虑有关颜色使用的其他准则。 颜色对比度是指前景文本与其背景之间的明度(感知亮度)差异。 表单作者可以使用颜色通过突出显示各种表单组件来改善表单的外观。 但是,如果颜色使用不当,则导致视力缺佳或色盲等具有不同能力的人难以或无法阅读某种形式的文字。

视力障碍的用户依赖文本与背景​ 之间的 ​高对比度来读取数字内容。 这是因为较大的亮度差异会锐化字符及其背后的表面之间的视觉边界,这对于无法轻松区分细微颜色差异的读者来说至关重要。 由于对比度不足会降低易读性,因此对于视力减退的用户而言,表单可能会变得难以阅读或无法阅读。 广泛认可的无障碍性指南,例如Web内容无障碍性准则(WCAG),将文本和背景之间的充分对比度视为可读数字内容的核心要求。

要确保足够的颜色对比度,请应用以下指南:

  • 使用默认字体和背景颜色 — 白色背景中的黑色文本可提供最强、最可靠的对比度。
  • 如果更改默认颜色,请保持前景色和背景色在亮度上明显分开 — 选择浅色背景色中的深色前景色,或深色背景色中的浅色前景色。
  • 避免低对比度组合 — 配对(如白色背景上的浅灰色文本或类似深色背景上的深色文本)会降低易读性,因此不应使用。

保持强烈对比度可确保所有用户(无论其视觉能力如何)都可以阅读并完成您的表单。

​9. 确保可使用键盘访问表单控件 ensure-that-form-controls-are-keyboard-accessible

仅使用键盘或等效输入设备即可完全操作无障碍表单 — 无需使用鼠标。 行动不便或视力不佳的用户通常只依赖键盘,而许多能够操作鼠标的用户仍然更喜欢键盘输入以提高速度和效率。 支持键盘输入是辅助设计的基本原则,因为它确保每个控制都可以通过可预测的击键顺序来达到、激活和完成。 通过支持多种输入方法,您不仅可以构建符合公认辅助功能标准的无障碍表单,还可以创建更好地匹配所有用户偏好并减少完成障碍的表单。

以下键盘快捷键在AEM Forms​中可用于核心表单导航和提交:

操作
键盘快捷键
在表单中向前移动光标
选项卡
在表单中向后移动光标
Shift+Tab键
移到下一个面板
Alt+向右键
移到上一个面板
Alt+向左键
在表单中重置填写的数据
Alt+R
提交表单
Alt+S

此外,自适应Forms中的​ 日期选取器 ​组件可以使用各种键盘快捷键。 要启用快捷键,请选择​ 日期选取器 ​组件,然后选择 配置 以打开属性。 在​ 模式 ​部分中,使用​ 类型 ​和​ 模式 ​下拉列表中选择显示模式。 保存属性以启用对​ 日期选取器 ​组件的快捷键。 此配置步骤是必需的,因为快捷键对选定的显示模式进行操作。

以下键盘快捷键可用于自适应Forms中的​ 日期选取器 ​组件:

操作
键盘快捷键
  • 当选项卡焦点突出显示日历图标时,显示日期选取器组件选项
  • 当选项卡焦点突出显示某个选项时,执行单击事件
空格或Enter
隐藏日期选取器组件选项
Esc
  • 在日期选取器组件中可用的选项中向前移动光标。
  • 在日期输入字段处于活动状态时将选项卡焦点设置为日历图标
选项卡
在日期选取器组件中可用的选项之间向后移动光标
Shift+Tab键
  • 当选项卡焦点突出显示日期输入字段时显示日期选取器组件选项
  • 在日期选取器组件中可用的日历中向下移动光标
向下箭头
在日期选取器组件中可用的日历中向上移动光标
向上箭头键
在日期选取器组件中可用的日历中向后移动光标
左箭头
在日期选取器组件中可用的日历中向前移动光标
向右箭头
对日历中右导航箭头和左导航箭头之间的标题执行操作
Shift +向上键
对日历中可用的右导航箭头图标 右箭头 执行操作
Shift +向左键
对日历中可用的左导航箭头图标 左箭头 执行操作
Shift +向右键

使用辅助功能工具查找剩余的辅助功能问题

可访问的名称和描述检查器(ANDI)​是一个可访问性测试工具,可识别和帮助解决自适应表单中的可访问性合规性问题。 确保自适应表单可访问,允许使用辅助技术(如屏幕阅读器)的用户感知、导航表单字段并与表单字段交互,这支持遵守广泛采用的辅助功能标准,并为所有用户提供更包容的体验。

要使用​ ANDI ​工具在自适应表单中查找和解决辅助功能问题,请执行以下步骤:

  1. 在​ 预览模式 ​下打开自适应表单。
  2. 单击已添加书签的​ANDI工具图标。 然后,ANDI​工具将分析自适应表单并检查元素中缺少或不正确的可访问名称、描述和相关属性,并显示它检测到的可访问性问题。 有关如何使用该工具的详细信息,请参阅ANDI的文档。
  3. 查看并修复​ ANDI ​报告的问题。 应用更正后,重新运行​ ANDI ​分析,以确认报告的辅助功能问题已得到解决并且没有新的问题剩余。
recommendation-more-help
experience-manager-cloud-service-help-main-toc