Status messages on websites should be programmatically determined so that Assistive Technologies (AT) can understand what is happening on pages or whether the task performed by them was successful or not.
Official Requirements
Success Criterion 4.1.3 Status Messages (Level AA): In content implemented using markup languages, status messages can be programmatically determined through role or properties such that they can be presented to the user by assistive technologies without receiving focus.
Why is it required?
First let us understand status messages. Status messages are updates or alerts that notify users on the success or results of an action, on the waiting state of an application, on the progress of a process, or on the existence of errors. For example, a confirmation message to the user that their email has been sent successfully.
When status messages don’t support AT, it is difficult for users with disabilities to determine whether their performed action was successful or not.
How do we fix it?
Make sure that you set proper roles for HTML elements in ARIA such as
- role=status in ARIA to convey status messages to users
- role=alert or Live Regions to identify errors and update the same to users
- role=progressbar to present progress status to users
Mistakes to avoid
- Status messages are provided but it doesn’t support AT or doesn’t receive focus
- Providing status updates that are not relevant to users.
