创建可访问的自适应表单

简介

可访问的表单是每个人都可以使用的表单,包括有特殊需要的用户。 自适应表单包含许多功能,它们增强了不同功能用户的可用性。 将辅助功能构建到自适应表单中不仅允许尽可能最宽的受众内容,而且,在需要遵守辅助功能标准的地区提供文档时,也需要这样做。 AEM Forms帮助表单开发人员遵守辅助功能标准。

在创作自适应表单时,作者应考虑以下几点以创建可访问的自适应表单:

  • 使用“辅助名称”和“描述检查器”(ANDI)辅助工具测试工具检查表单
  • 为表单控件提供正确的标签
  • 为图像提供对等文本
  • 提供足够的颜色对比度
  • 确保表单控件可通过键盘访问

先决条件

您需要辅助工具工具(如 辅助名称和描述检查器 (ANDI)) 和自适应表单主题,该主题是为修复与辅助功能相关的问题而开发的 ,以创建可访问的自适应表单。

下载和安装辅助工具测试工具

可访问名称和描述检查器(ANDI)工具可帮助您识别和修复Web内容中与辅助功能兼容性相关的问题。 它是根据美国国土安全部v5测试人员指南推荐的工具。 它由美国社会保障管理部​开发,用于检查Section 508对Web内容的遵守情况。 工具:

  • 帮助检测网页​上的辅助功能问题
  • 提供改进辅助功能的建议​
  • 检测键盘辅助功能和颜色对比度问题
  • 明确标识符合标准的屏幕阅读器内容

ANDI可与所有主要的因特网浏览器一起使用。 有关配 置和使用该工具的 详细说明,请参阅ANDI的文档。

下载并安装Ultramarine-Accessible主题

Ultramarine-Accessible主题是参考主题。 它有助于在自适应表单中演示如何修复颜色对比度和其他与辅助功能相关的问题。 Adobe建议根据您的组织批准的样式为生产环境创建自定义主题。 请执行以下步骤将主题上传到AEM实例:

  1. 下载主题包。
  2. 导航到 Experience Manager >导 > Forms ​on您的AEM实例。
  3. 点按 创建 > 文件上传。 选择并上传x Ultramarine-Accessible-Theme.zip文件。 它将主题上传到您的AEM实例。

使自适应表单可访问

您应关注四个关键方面: 键盘导航、颜色对比度、图像的有意义替代文本以及表单控件的相应标签,使自适应表单可访问。 请执行以下步骤以使现有自适应表单可访问:

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

将“超海洋辅助工具”主题应用于现有的自适应表单。 要应用主题,请执行以下操作:

  1. 打开自适应表单进行编辑。
  2. 选择一个组件,然后点按父图标。 在上下文菜单中,点按自 适应表单容器 ,然后点按配置图标。
  3. 在属性浏览器中选择“超海洋辅助工具”主题,然后点按“ 保存 ”图标。
  4. 刷新浏览器窗口。 该主题将应用于自适应表单。

应用辅助主题后,请执行下面列出的其他修复。 这些修复除了辅助功能主题中涵盖的辅助功能修复之外,还包括:

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

    为自适应表单模板的页眉和页脚组件中的图像提供有意义的替代文本。 在修复模板并使用它创建自适应表单时,自适应表单将继承应用于模板页眉和页脚的所有与辅助功能相关的修复。 对于现有的自适应表单,在自适应表单级别进行更改。 对自适应表单模板所做的更改不会自动流向现有的自适应表单。

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

    大多数辅助工具会告知用户内容的层次结构,以帮助他们了解网页的结构。 在自适应表单上为组织名称和表单名称文本设置不同的标题级别,为这些文本提供分层结构。 此外,在每个面板和节之前使用具有相应标题级别的文本组件来创建层次结构。

    如何应用标题样式

  3. 根据辅助工具标准更改页脚背景颜色以使用适当的对比度,从而提高文本的可见性和可读性。 您可以使用ANDI在表单中查找颜色对比度问题。 另外,不要使用非常小的字体。 小字体很难阅读。

  4. 将现有自适应表单中的交换机和图像选择组件替换为选择(单选按钮)组件。

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

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

  7. 为日期选取器组件设置显示、验证和编辑模式。 此外,设置自定义验证错误消息。 例如,您指定的日期无效。 日期的正确格式为YYYY-MM-DD。

  8. 为日期选取器组件设置自定义辅助工具文本。 例如,输入您的出生日期。 屏幕阅读器阅读这些自定义辅助工具文本。

  9. 对于自适应表单组件,请使用简短描述而非长描述。 详细说明可添加帮助按钮。 确保自适应表单没有任何帮助按钮。

  10. 将自定义辅助功能文本添加到表的所有只读单元格。 此外,禁用表的所有只读单元格。

  11. 删除自适应表单中的涂鸦签名字段(如果有)。 配置自适应表单以使用Adobe Sign获得无缝的数字签名体验。

2.为表单控件提供正确的标签

组件的标签或标题标识表单组件所代表的内容。 例如,文本“名字”告诉用户,他们必须在文本字段中输入自己的名字。 要供屏幕阅读器访问,标签以编程方式与表单组件关联。 或者,表单控件配置有附加的辅助功能信息。

屏幕阅读器感知到的标签不一定与视觉描述相同。 在某些情况下,您可能希望对控件的用途有更具体的说明。 对于表单中的每个字段对象,可使用辅助功能选项指定屏幕阅读器宣布的用于标识特定表单字段的内容。

要使用“辅助功能”选项,请按照以下步骤操作:

  1. 选择一个组件并点 按组件
  2. 单击提 要栏 中的“辅助功能”以选择所需的辅助功能选项。

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

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

自定义文本 “表单”作者在辅助功能选项“自定义文本”字段中提供内容。 屏幕阅读器等辅助型技术使用此自定义文本。 在大多数情况下,使用“标题”设置是最佳选项。 仅当使用标题或无法提供简短说明时,考虑创建自定义屏幕阅读器文本。

简短描述 对于大多数组件,当用户将指针悬停在组件上时,将在运行时显示简短描述。 您可以在帮助内容选项下的简短描述字段中设置此选项。

标题 使用此选项可让AEM Forms使用与表单字段关联的可视标签作为屏幕阅读器文本。

名称 您可以在“绑定”选项卡的“名称”字段中指定一个值。 名称不能包含任何空格。

“无 ”选择“无”会导致表单对象在已发布的表单中没有名称。 对于表单控件,不建议设置“无”。

注意
  • 单选按钮和复选框在辅助功能方面只能有两个选项,即自定义文本和标题。
  • 对于基于XFA的自适应表单,辅助功能选项从XDP中设置的辅助功能选项继承。 XDP中的工具提示会映射到“简短说明”,“题注”会映射到“标题”。 其他选项按原样工作。

3.为图像提供对等文本

图像有助于提高某些用户的理解能力。 但是,对于使用屏幕阅读器的用户,图像会降低表单的可访问性。 如果选择使用图像,请为所有图像提供文本描述。

确保文本在表单中描述对象及其用途。 屏幕阅读器在遇到图像时读取此替换文本。 图像必须始终指定替代文本。

选择图像组件,然后点 按comppr。 在提要栏中的属性下,指定图像的替代文本。

图像的替换文本

4.提供足够的颜色对比度

辅助工具设计涉及考虑有关颜色使用的其他准则。 表单作者可以通过突出显示各种表单组件,使用颜色来改善表单的外观。 然而,不当使用颜色可能使不同能力的人难以或无法阅读。

患有视觉障碍的用户依靠文本与背景之间的高对比度来阅读数字内容。 如果没有足够的对比度,某个表单可能会对某些用户变得难以阅读。

建议您使用默认字体和背景颜色——白色背景上黑色的内容。 如果更改默认颜色,请在浅色背景颜色上选择深色前景色,反之亦然。

有关 更改自适应表单的颜色对比度和主题,请参阅为自适应表单创建自定义主题。

5.确保表单控件可通过键盘访问

仅使用键盘或等效的输入设备即可完全填写可访问的表单。 行动性或视力受损的用户可能别无选择,只能使用键盘,许多可以使用鼠标的用户更喜欢键盘输入。 通过允许使用各种输入方法,您不仅可以创建可访问的表单,还可以创建更适合所有用户偏好的表单。

以下键盘快捷键可用于AEM Forms。

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

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

可访问名称和描述检查器(ANDI)可帮助您在自适应表单中识别和修复与辅助功能兼容性相关的问题。 要使用ANDI工具在自适应表单中查找辅助功能问题,请执行以下操作:

  1. 在预览模式下打开自适应表单。
  2. 单击标记为书签的ANDI工具图标。 ANDI工具可分析自适应表单并显示辅助功能问题。 有关如何使用该工具的详细信息,请 参阅ANDI的文档
  3. 查看并修复ANDI报告的问题。

在此页面上