Forms
Accessibility Guidelines for Web Site Forms
The following are some of the guidelines that should be validated for accessibility compliance for all Web site forms:
Change of Context
Ensure that changing the setting of any user interface does not automatically cause a change of context.
For example, avoid using an active dropdown control that changes the page or page content as soon as an item is selected.
WCAG Guidelines referenced:
- Guideline 3.2 Predictable: Make Web pages appear and operate in predictable ways.
- 3.2.2 On Input: Changing the setting of any user interface component does not automatically cause a change of context unless the user has been advised of the behavior before using the component. (Level A)
Error Handling
When an error is detected, provide clear error text near the problem field, and make sure the focus is on the error text.
WCAG Guidelines referenced:
- Guideline 3.3 Input Assistance: Help users avoid and correct mistakes.
- 3.3.1 Error Identification: If an input error is automatically detected, the item that is in error is identified and the error is described to the user in text. (Level A)
- 3.3.3 Error Suggestion: If an input error is automatically detected and suggestions for correction are known, then the suggestions are provided to the user, unless it would jeopardize the security or purpose of the content. (Level AA)
- 3.3.4 Error Prevention (Legal, Financial, Data): For Web pages that cause legal commitments or financial transactions for the user to occur, that modify or delete user-controllable data in data storage systems, or that submit user test responses, at least one of the following is true: (Level AA)
Reversible: Submissions are reversible.
Checked: Data entered by the user is checked for input errors and the user is provided an opportunity to correct them.
Confirmed: A mechanism is available for reviewing, confirming, and correcting information before finalizing the submission.
- 3.3.1 Error Identification: If an input error is automatically detected, the item that is in error is identified and the error is described to the user in text. (Level A)
Labels
Use properly tagged labels for all form fields.
Place labels so they are near their associated field. You can right-align the labels to make it easier for users to understand what each field is for.
WCAG Guidelines referenced:
- Guideline 3.3 Input Assistance: Help users avoid and correct mistakes.
- 3.3.2 Labels or Instructions: Labels or instructions are provided when content requires user input. (Level A)
- Guideline 4.1 Compatible: Maximize compatibility with current and future user agents, including assistive technologies.
- 4.1.2 Name, Role, Value: For all user interface components (including but not limited to: form elements, links and components generated by scripts), the name and role can be programmatically determined; states, properties, and values that can be set by the user can be programmatically set; and notification of changes to these items is available to user agents, including assistive technologies. (Level A)
Note: This success criterion is primarily for Web authors who develop or script their own user interface components. For example, standard HTML controls already meet this success criterion when used according to specification.
- 4.1.2 Name, Role, Value: For all user interface components (including but not limited to: form elements, links and components generated by scripts), the name and role can be programmatically determined; states, properties, and values that can be set by the user can be programmatically set; and notification of changes to these items is available to user agents, including assistive technologies. (Level A)
Logical Sequence
Place fields in a single column in a logical sequence.
This helps users work through the form in a clear, logical manner. Minimize white space and avoid using layout tables to lay out the form.
WCAG Guidelines referenced:
- Guideline 1.3 Adaptable: Create content that can be presented in different ways (for example simpler layout) without losing information or structure.
- 1.3.2 Meaningful Sequence: When the sequence in which content is presented affects its meaning, a correct reading sequence can be programmatically determined. (Level A)