Accessible Forms in Acrobat XI
Compared to HTML, PDF forms have some inherent accessibility limitations. There is no real way to associate the visible text label with the form field, but there is a way to provide a text description that will be read to a screen reader while navigating through the PDF. In addition to the accessibility principles outlined in the previous page of this article, the following four steps are required to ensure the accessibility of a PDF form:
- Add the correct form fields to the PDF. This can be accomplished by creating a PDF form from scratch within Acrobat or by adding form fields to an existing PDF.
- Include an accessible label that describes the purpose of the form control to a screen reader. This is provided through the Tooltip.
- Add tags to the form fields.
- Check, and if necessary repair, the tab order.
While many of the principles in this article can be applied to older versions of Acrobat Pro, this article is written specifically for users of Acrobat XI Professional.
1. Add Form Fields
Just as "tags" are essential to the accessibility of a PDF file, true form fields and buttons are essential to the accessibility of a PDF form. This allows the form to be filled out and submitted within Adobe Reader.
You can easily check to see if a PDF form has the necessary fields by opening the file in Acrobat or Adobe Reader. If theoption is visible in a purple bar at the top of the page, this means the PDF already has form fields.
Creating PDF forms from scratch
When creating a new form within Acrobat XI Professional, Adobe will prompt you to use another application called FormsCentral. It can be opened as a standalone application or by selectingfrom the main menu in Acrobat.
- While FormsCentral can be used to create accessible PDF forms, the interface itself is not accessible to keyboard or screen reader users.
- An online version of FormsCentral is available as a subscription service as well. It provides the same functionality as the desktop version and also includes the ability to distribute and analyze forms online. See Adobe's site for additional information about this service.
New form fields can be added to the page with themenu in the upper-right part of the screen or with the menu that is always visible at the end of the document.
This menu provides options for all common types of form fields and also includes an option for Likert-type rating scales. Most of these options automatically add the correct accessibility information, but a few options, such as groups of checkboxes and Likert scales, may need some additional information (more on this below).
There are some accessibility limitations in FormsCentral including lack of support for headings and alternative text. These will need to be addressed in Acrobat. To edit a PDF created in FormsCentral within Acrobat, you must: open the PDF in Acrobat, select(not ), close the original file, and open the copy.
Form submission buttons can only be added in Acrobat Pro or with FormsCentral online.
LiveCycle Designer is another tool that can be used to create PDF forms. Although it has a number of features to facilitate the creation of accessible PDF forms (possibly better than the features in Acrobat), be aware of a few important limitations:
- LiveCycle Designer was packaged with Acrobat X Professional and earlier, but it is no longer included with Acrobat. It must now be purchased separately, meaning it is likely that many people will not have access to this program into the future.
- It is a Windows-only program.
- PDF forms created in LiveCycle Designer cannot be edited in Acrobat. While both programs produce PDF files, they are not compatible with each other.
For more information about creating accessible PDF forms in LiveCycle Designer, visit Adobe's LiveCycle accessibility page.
Adding form fields to an existing PDF
Many PDF forms are created in other programs such as Adobe InDesign or MS Word. Form labels must be added to these fields within Acrobat Professional before they can be filled out electronically. With most files, the easiest way to add form fields is to have Acrobat detect and label these fields automatically. There are two main ways to do this:
- Use the Make Accessible Wizard outlined in the previous page of this article. This is probably the easiest approach, and something you should be doing anyway.
- Select from the right-hand column, then . A dialog will open. Select , and Acrobat will automatically add form fields to the file.
This option can also be accessed in themenu, but all three options will trigger the same process.
Adding and removing form fields
If a form field was not detected, select theto add a field manually. A menu of available form fields will appear.
Select the desired form field type and drag it to the correct place on the page. Ensure the new form field covers the existing space in the file (e.g., a new radio button should cover the circle that already appears on the page).
Items that are not true form fields can sometimes be incorrectly added to the PDF by Acrobat. This is especially common for cells within a data table or lines that are used to separate page sections. To remove incorrect form fields, selectin the right-hand column . on the unnecessary form field and select .
2. Ensure Every Form Field Has a Descriptive Tooltip
Regardless of the method used to add form fields to a PDF, the next step is to ensure that the field has correct descriptive text.
When a screen reader user navigates to a form field or button, its contents must be described to the screen reader. This descriptive text is known by several different terms including "name" in WCAG 2.0, "accessible name" in WAI-ARIA, and usually just "label" in HTML. In Adobe documentation, and in this article, it will be called "accessible label," or simply, "label." There are a number of ways to provide this accessible label in a webpage (
aria-labelledby, etc.). In a PDF, the only reliable way to provide this information is with the property within a form field. With the exception of radio buttons (described below), which require some additional work, the rule is simple:
Any information that a screen reader user needs to fill in a form field must be included in the field's Tooltip.
Editing the Tooltip
To check or edit the Tooltip of an existing form field, select the. Then the field and select Properties dialog will appear. Ensure the Tooltip conveys all the information that a screen reader user would need to correctly complete the field.
It is usually easiest to check all the Tooltip values at the same time by leaving this Properties window open in an empty part of the screen and clicking on each of the form fields.
Fields that are marked "Required" within Acrobat are not identified by a screen reader. Identify required fields in the Tooltip.
To edit the Tooltip in FormsCentral,and a option will appear on the right-hand side of the page. Select checkbox and then enter the new expanded Tooltip in the field that appears.
Form field types
The following section provides additional details for specific types of form fields.
In most forms, the most common field type is a text field. There are options within Acrobat Pro to make this single or multi-line. Placeholder text (calledin in the window) will be read by a screen reader in addition to the Tooltip, but it should not be used in place of the Tooltip and should not include essential information. It is usually best to leave it blank.
These menus can be navigated with the arrow keys or by selecting the first letter of the desired option. If an option is selected by default, it will be read by a screen reader in addition to the Tooltip.
A list box looks like an expanded dropdown list and allows the user to select multiple options by holding down the Shift or Control key while selecting an option with a mouse. List boxes introduce accessibility issues for keyboard users and usability issues for everyone. Use a group of checkboxes instead.
Radio buttons (a group of options where only one option can be selected) require additional information to ensure accessibility. The following information must be provided:
nameattribute for HTML radio buttons. It also allows a keyboard user to select an option within the group using the arrow keys.
must be the same for all of the radio buttons within the group. This groups the options together, just like the
<legend>elements in HTML. Because this information will be read for each option in the group, it should be succinct.
value should also be the same for all radio buttons within the group. This provides a shared label for each of the options, like the
- Under the
tab, the value must match the text that appears next to each radio button.
If these three fields contain the correct information, both theand values will be read to a screen reader.
FormsCentral includes Likert scale options (e.g., Strongly Agree-Strongly Disagree). Thefor these options are not correct and will need to be repaired.
Unfortunately, checkboxes cannot be grouped together in the same way as radio buttons. This means that the description of the group of checkboxes and the individual checkbox should be presented in the.
These principles for radio buttons and checkboxes must be balanced with the need for a succinct Tooltip. For example, descriptive text that is merely informative (e.g., "Check all that apply") should probably not be added to each Tooltip. A Tooltip that is extremely long could possibly be added to the first checkbox or radio button with a more succinct Tooltip added to other options. Use your best judgment.
To add text to a button, open thedialog for the button, select the tab, and then enter the appropriate text in the option. If a button does not have a Tooltip, the text that appears on the button will be read by a screen reader, but if a Tooltip is provided it will override the button text. While adding a Tooltip to a button does not appear to be necessary, the accessibility checker will flag a button without a Tooltip as an error, so it may be best to provide a Tooltip for the button that is identical to the button text.
4. Check and Repair the Tab Order
Once the form fields are labeled correctly, and the reading order has been corrected, the tab order of the form fields should be reviewed. To review the tab order, select the. The bottom half of this sidebar will now display a list of all the form fields in the file. Within this section, select the . Ensure and are checked.
Numbers will appear within each form field outlining the tab order.
If these numbers do not match the visual reading order, return to theand as outlined in the previous section and ensure the reading order is logical. This is always preferable to changing the tab order manually. If this does not work for some reason, return to the menu and select and check option.
Then drag and drop the options in thepanel to change the tab order.
Manually reordering the tab order can delete the tag information for the reordered form. If you reorder forms, recheck the accessibility and repeat the steps in the previous section if necessary.
- When a screen reader enters a form, it usually switches to a different reading mode, often called "forms mode." While in forms mode, the screen reader skips over content that is not a form control or link. For this reason, it is best to place important information or instructions before the form begins and not between form fields.
- Form error messages (e.g., an email field does not include an email address) are presented in a popup dialog. This dialog is accessible to screen reader users. If these are being used, ensure the error message provides the information that a user needs to find and fix the error.
- Not every PDF form requires a button for submission. Many forms are designed to be filled out online and then printed and submitted in person or by mail.