SKIP TO MAIN

Alert - Toast messages

Back to complex components

Alert (Toast) messages should be communicated to all users.

WHEN I am on a page with alert messaging.
AND I am using a screen reader.
WHEN I trigger the message.
THEN I hear the message read out.

WHEN I am on a page with alert messaging.
AND I trigger the alert.
THEN I am provided enough time to read the alert.

Related Acceptance criteria

Alerts by nature are not allowed to take focus. If you need some sort of interaction you may want to see acceptance criteria for modal.

More Information.

Alerts can be handled is several ways for accessibility. No matter if using role or aria-live, the following are true.

Alerts MUST meet the following:

  • Be able to be perceived by all assistive technologies.
  • Be short and provide enough time to read.
  • Must NOT use role="alert" or aria-live="assertive" on non time sensitive information [ WCAG 4.1.3 ].
  • Must NOT steal focus [ WCAG 4.1.3 ].

Helpful Links