Web Forms are considered the most interactive elements in a web environment. Users navigate, select, expand, insert data and do all possible types of interaction with the Web Forms. As a result, it is very imperative to ensure the accessibility of forms. Following are a list of things to consider when building a form and later when testing a form for accessibility.
A.T. = Assistive Technology
Form Validation
Verify whether the form has proper input data validation for form fields that require specific data-type entry, e.g., numeric values only (for zip code).
Input Mask
Verify whether a proper and accessible input mask is provided for any form fields that require specific data format such as phone number or social security number.
Instructions
Verify whether a proper and accessible instruction is provided for form fields that require user instruction for valid data entry. For example, "include street and apartment number."
Default Value
Verify whether the form field has a default value or not. If a default value/option is available, verify whether it is provided to all users and other options can be selected instead of the default value.
Required Fields
Verify whether all required form fields are properly marked as "required" and a proper description is provided to the user.
Error Handling
Verify whether the error handling system is functional and consistent. Proper error messages that would direct users with clear instruction and/or links to the errors should be provided for all missing form fields or invalid data entries. Error messages should also be accessible for assertive technology users.
Keyboard Access
Verify whether all form content and fields are accessible via keyboard.
Visual Focus
Verify whether all form fields and interactive elements within the form receive proper visual focus associated with keyboard navigation.
Tab Order
Verify whether all form fields and interactive elements follow a correct tab order based on the normal sequence of content. This should be applicable when CSS is disabled as well.
Headings
Verify whether the form fields, sections, instructions, and sub-pages have correct heading structure.
Labels
Verify whether all form fields have proper and meaningful labels associated. The "ID" and "FOR" attributes must match for each pair of field and label.
Reading Order
Verify whether the form content follows a correct/standard reading order. It is especially important for assistive technology users.
CSS
Verify whether all functionalities and content of the form remain the same when CSS is disabled.
Navigation
If the form is extended to multiple pages, verify if there is a proper mechanism to navigate through different pages of the form. The number of pages and an appropriate title for each page of the form should be provided to the user.
Review and Submission
Verify whether the form has a "review page" before submission. For sensitive and important information the user should be allowed to review and verify the data prior to final submission. Also, the review page/section should provide proper information and functionality to confirm or revise the data inserted, by properly navigating the user and providing the option of willingness to change.
Page Title
Verify if the form page and/or form sections have meaningful titles that would describe the purpose and content of each form or section.
Page Reload with Data Input
Verify whether the sensitive data inserted in the form fields are not restored and shown when the form is reloaded, or user navigates to the previous sections.
Assistive Technology Navigation
Verify whether the form is accessible with Assistive Technology. All the content of the form including, form fields, labels, headlights, legends, field-sets, error messages, paragraphs, buttons, instructions, tool-tips, input masks, default values, entry types, pop-up messages, confirmation boxes, navigation paths (for multi-page forms), review section and all other content are announced and provided to the assistive technology users accordingly.
Assistive Technology keyboard shortcuts
Verify whether the form page is fully navigable using the standard keys including assistive technology navigation keys. If not, verify whether any instruction is provided for assistive technology users to navigate the form properly.
Timed Response
If no activity is detected for certain period of time while the form is open, verify whether a Timed Response mechanism exists for properly informing the user about the time restriction and allowing to extend time (if possible). It should also save user entries by protecting form input data (if the user account is associated with the form).
