Errors in forms do not get focus
Archived Issue
Current Iteration of Issue
Current Iteration as Reference
Short Description
When there is an error, focus does not move to the location of the error.
Long Description
- The information about an error on a form entry is not always sequentially next to the entry where the error occurred according to how a screen reader navigates. As a result, once the user finds the error message, they then must search for the relevant form element in order to make the correction. A screen reader user has to spend extra time and energy to make a correction.
- Visual information such as a graphic or color change might indicate where an error is to help a sighted user find it more easily, but a screen reader user cannot access the visual landmarks. It is helpful, instead if the error message is just before the form field with the error.
- If a page displays errors after a submission, it is helpful if the focus goes directly to the first error, not the top of the page.
- The focus of the screen magnifier means that a user cannot look at the whole screen at one time. As a result, any assistance finding important information is helpful. Also, visually putting information about an error next to the error helps a user not have to search the whole screen.
Example of Issue
Screen reader user demonstrates impact of error pop up not receiving focus
Recommendations
- Visually, place information about an error next to the form field where the error exists.
- Make sure a screen reader will navigate sequentially directly from information about the error to the relevant form field.
- When information about an error appears, move the focus to the information about the error and the relevant form field.
- Do not rely on visual cues to bring awareness to an error.
Related Issues
WCAG Reference
Accessibility/Usability
Accessibility
Usability
Impacted Assistive Technology
Screen Reader
Screen Magnifier
Impacted Type of Device
Computer
Mobile