Accessibility in Forms
The Elgin Community College Accessibility Guides is an independent publication and is neither affiliated with nor authorized, sponsored, or approved by Adobe, Google, or Microsoft Corporation. For permission to use content from this presentation or link to this document, please contact the Elgin Community College Web Team at digitalaccess@elgin.edu.
Overview
Let's create accessible PDF forms.
Forms need to be made accessible due to the increasing use of technology; most forms are now provided in formats such as PDF, HTML, Microsoft Word, and Google Docs. The PDF forms are most commonly used. If the forms are not accessible, people using screen readers or keyboards will be unable to fill them out. PDF forms are different from HTML forms. In HTML forms, you need to associate the label text with the input field. Label text is not possible to add in PDF forms, but Adobe offers a way to work around this limitation. PDF forms have some limitations. It is recommended to use Google Forms and HTML forms if possible.
To create PDF forms and make them accessible, you will need the Adobe Acrobat DC to access the prepare form tool.
After completing this training guide, you will be able to:
Add Form Fields to Make Accessible Forms
Adobe Acrobat’s Prepare Form tool allows you to add and edit form fields in a PDF. If you do not see Prepare Form in the Tools panel, you can access it in one of the following ways:
- Click on the More Tools option.
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/more-tools.png)
Scroll down in the tool list until you see the Prepare Form tool./prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/forms-signatures.png)
Click the Add button below. - Type “Prepare Form” in the Search tool field on the right side of the document window to find it another way.
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/search-tools.png)
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/prepare-form.png)
When you find this tool, click "Prepare Form." The following window will appear:/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/require-signatures.png)
- If the document requires signatures, click the checkbox labeled "This document requires signatures" (Tip: signatures should be required only when absolutely necessary). Then, click on the Start button. Checking this prompts the program to populate some or all of your form fields.
- You may need to add fields manually if you've created a complex form.
Write proper tooltips to improve accessibility
Tooltips in PDF form are like alt text to images. Writing descriptive tooltips is critical to screen readers. Write clear and concise tooltips.
How to add tooltips
Right-click on the field and select Properties > General to access the Tooltips.
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/tooltip-example.png)
Tips
A good example of a tooltip for the field below would be “Mother’s first name.” Your tooltip text should be fewer than 50 characters.
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/textbox-tooltip.png)
Tooltips on form fields such as checkboxes and radio buttons can be tricky. For checkboxes, include the number of total checkboxes you have. In the example below, there are 4.
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/checkbox-example.png)
A good example of tooltips for the checkboxes above would be:
| Field | Tooltip |
|---|---|
| None | English conversation level: None (1 of 4) |
| Beginner | Beginner (2 of 4) |
| Intermediate | Intermediate (3 of 4) |
| Advanced | Advanced (4 of 4) |
When writing tooltips for radio buttons, include the question that corresponds to each option. For example, for the field below, the tooltip for both Yes and No radio buttons would be “Do you plan to drive?”. However, you do not need to include “yes” or “no” in the tooltip because, for the radio buttons, the screen reader announces the options. For example, when the Yes radio button in the field below is selected, the NVDA screen reader announces, “Do you plan to drive? Yes, radio button not checked.”
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/radio-button-example.png)
What are tags in accessible forms?
Tags in a PDF form serve a similar purpose to HTML tags. Assistive technologies rely on these tags to understand what content is essential and how it should be presented. For example, headings are identified with heading tags, form fields are identified with form tags, and paragraphs are identified with paragraph tags.
Tags also define the reading order of the document. Screen readers read content in the order it is tagged. If content is tagged incorrectly, it may be read out of order or announced improperly. For example, if a form field is tagged as a paragraph instead of a form field, the screen reader will not announce it as interactive, and the user may not realize it can be completed.
If content is not tagged, screen readers may not be able to read it at all. It is important to note that creating form fields in a PDF does not automatically make the necessary accessibility tags. Additional steps are required to correctly tag all form fields.
Tags can be added or corrected using Adobe Acrobat or Acrobat Pro or by using specialized PDF remediation software. Here at ECC, we use Allyant's CommonLook PDF.
Adobe Acrobat can automatically add tags to a document if it is not already tagged. To use the autotag document feature:
- In the Tools pane, select Accessibility. You may need to search for it in "More Tools" if you don't see it in your Tools pane.
- Select Autotag Document
- You can review the tags by going to View in the top toolbar then Show/Hide > Navigation Panes > Accessibility Tags
Set the correct tab order
Tab order refers to the sequence in which form fields are navigated when the user presses the Tab key. Setting the correct tab order is crucial for screen readers to function correctly; otherwise, it will confuse users of screen readers and those navigating with only the keyboard.
Acrobat has a feature that enables you to set the tab order. On the right side, click on the dropdown button beside the text “Fields.”
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/tab-order-list.png)
You should see the following options:
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/order-tabs.png)
You can order tabs:
- By Structure: This option automatically sets the tab order. For complex forms, this option may not yield the desired tab order. In that case, select the “Order Tabs Manually” option.
- By Row: This option sets the tab order left to right.
- By Column: This option sets the tab order top to bottom.
- Manually: This option allows you to set the tab order manually by clicking and dragging fields in the list on the right side.
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/tab-order-example.png)
We recommend checking the order by pressing the TAB key on the keyboard to navigate the form fields. Then, arrange the form fields in the correct order using the steps above.
Additional Features
Adobe Acrobat provides tools beyond standard form fields to add interactive elements and supporting content to a form.
- Text: Used to add instructions, labels, or explanatory content that users read but do not interact with.
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/add-text.png)
- Button: Used to submit a form, reset fields, or trigger actions such as opening a link or running a script. Buttons must be adequately labeled and tagged so screen readers announce their purpose.
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/add-button.png)
- Images: Used for logos, seals, or visual guidance. Images should include alt text so screen reader users understand their purpose.
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/add-image.png)
- Barcode: Used to encode form data for processing or tracking. Barcodes must include alternative text that explains their purpose, as screen readers cannot interpret the images of barcodes.
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/add-barcode.png)
Document properties create a solid foundation
Consider the document properties of title and language while making your document accessible. The document title is different from the file name. If you do not set a document title, the title defaults to the file name, which is not always readable. For example, without a title for the document, the screen reader will use the file name for the title and announce the title as “file 1 dot pdf”.
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/filename-example.png)
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/filename.png)
Set the document language so screen readers can identify the language. For example, if your document is in Spanish and the language of the document is not set, the screen reader will not read the document correctly because it will not pronounce words accurately.
To add the title:
- Go to File > Properties
- Add the Title in the Description tab.
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/doc-title.png)
To change the language:
- Go to the Advanced tab in the Properties panel.
- Correct or add the document language.
/prod01/cdn-pxl-elginedu-prod/media/elginedu/accessibility/pdf-forms/doc-lang.png)