创建无障碍的自适应表单

简介

无障碍表单是每个人都可以使用的表单，包括有特殊需要的用户。 自适应Forms包含许多特性和功能，可增强具有不同功能的用户的可用性。 将辅助功能构建到自适应表单中不仅允许尽可能广泛的内容受众，而且在要求遵守辅助功能标准的地理位置提供文档时，还要求提供这些文档。 AEM Forms帮助表单开发人员遵守无障碍标准。

在创作自适应表单时，作者应考虑以下几点以创建无障碍的自适应表单：

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

先决条件

您需要辅助工具，例如 辅助名称和描述检查器(ANDI) 和 为修复与无障碍相关的问题而开发的自适应表单主题 创建无障碍的自适应表单。

下载并安装辅助功能测试工具

辅助名称和描述检查器(ANDI)工具可帮助您识别和修复Web内容中与辅助功能合规性相关的问题。 它是国土安全部Trusted Tester v5准则下的推荐工具。 它由美国社会保障管理部​制定，用于检查Section 508是否符合Web内容。 工具：

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

ANDI可与所有主要的互联网浏览器配合使用。 看， ANDI的文档 以了解有关配置和使用该工具的详细说明。

下载并安装Ultramarine-Accessible主题

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

1. 下载主题包。
2. 导航到 Experience Manager > 导航 > Forms 在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. 单击 辅助功能 ，以选择所需的辅助功能选项。

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

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

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

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

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

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

3.为图像提供对等文本

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

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

选择图像组件并点按 . 在侧栏中的属性下，为图像指定替代文本。

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

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

患有视觉障碍的用户需要借助文本与背景之间的高对比度来阅读数字内容。 如果没有足够的对比度，某个表单对于某些用户来说可能会变得很难阅读，甚至是不可能。

建议您使用默认字体和背景颜色，即白色背景中黑色的内容。 如果更改默认颜色，请选择浅背景颜色上的深前景颜色，或者选择反之。

请参阅 为自适应表单创建自定义主题，以了解有关更改自适应表单的颜色对比度和主题的更多信息。

5.确保表单控件可以使用键盘

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

以下键盘快捷键在AEM Forms中可用。

此外，还提供了各种键盘快捷键， 日期选取器 组件。 要启用快捷键，请点按 日期选取器 组件和点按 以打开资产。 在 图案 ，使用 类型 和 图案 下拉列表。 保存属性，以启用对 日期选取器 组件。

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

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

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

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

1. 在预览模式下打开自适应表单。
2. 单击添加书签的ANDI工具图标。 ANDI工具可分析自适应表单并显示无障碍问题。 有关如何使用该工具的详细信息，请参阅 ANDI的文档.
3. 审查并修复ANDI报告的问题。

Business.Adobe.com 资源

Content Intelligence Theme Editor Document Generation Dynamic Media Headless Cms Digital Asset Management