ARIA Alert
An alert is an ARIA live region is meant for error or warning messages that appear on the screen. It is usually implied to have a aria-live value of assertive
Example 1: Visual alert
This solution works well for new and existing work.
Clicking the button below will show the current time on the screen. Since the current time text is inside an div with role="alert" and aria-live="assertive", the text will be announced immediately by screen readers.
This is an aria live region
alert.
Code Walkthrough of the Above Example
Below is the HTML of the above example. Use the dropdown to highlight each of the individual steps that makes the example accessible.