Toast notifications

Trigger a toast and test whether important feedback is announced and remains available long enough.

Level: Intermediate
Time: 5-10 minutes

Objective

Determine whether transient notifications communicate important results without disappearing too quickly.

PREPARE

Set up your test

Turn on a screen reader you know how to operate.
Navigate by controls or use Tab where the task asks you to.
Listen for purpose and state, not one exact sequence of spoken words.

WORKING EXAMPLE

Establish the expected behavior

Activate the button. Keep focus on it and listen for the notification.

Expected behavior: the result is announced and remains visible long enough to review.

INTENTIONAL DEFECT

Find the barrier

The example below deliberately contains one accessibility defect. Skip the defective example.

Activate the button. Determine whether the notification is available to a screen reader and whether it remains long enough.

Hint

The toast is inserted as ordinary visual text and is removed quickly.

End of intentional defect.

DIAGNOSE

Choose the primary cause

EXPLANATION

Understand and repair it

Reveal explanation

What happened

The defective toast has no status semantics and disappears quickly. A screen reader user may not know the save happened or may be unable to review the result.

Repair

Use a status region for non-urgent results and keep important messages available. Do not use disappearing toasts for information users must act on.

<div role="status" id="save-status"></div>

Retest

Activate the action and confirm the toast text is announced.
Confirm the notification stays visible long enough to read.
Confirm focus remains where the user expects.

Report it

Example: The save confirmation appears as a short-lived visual toast without status semantics, so screen reader users may not receive the result.

Standards and support

This exercise describes behavior rather than promising identical speech across screen reader and browser combinations.

Editorially reviewed 20 July 2026.