Status messages

Trigger a visual update and test whether it is announced without moving focus.

Level: Beginner
Time: 5-10 minutes

Objective

Recognize when a dynamic message needs status semantics so it can be announced.

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 result.

Expected behavior: “Synchronization complete” is announced without moving focus away from the button.

INTENTIONAL DEFECT

Find the barrier

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

Activate the button. Keep focus on it and determine whether the new result is announced.

Hint

The text is inserted after the button, but focus does not move to it.

End of intentional defect.

DIAGNOSE

Choose the primary cause

EXPLANATION

Understand and repair it

Reveal explanation

What happened

The defective result is ordinary text inserted after the page has loaded. It is visible, but it has no semantics that ask assistive technology to announce the change.

Repair

Create an empty status container in the initial page markup, then insert the message into it. A status is polite: it should not interrupt more urgent speech.

<button type="button" id="sync">
  Check synchronization
</button>
<p id="sync-status" role="status"></p>

<script>
  const syncButton = document.querySelector("#sync");
  const syncStatus = document.querySelector("#sync-status");

  syncButton.addEventListener("click", () => {
    syncStatus.textContent = "Synchronization complete";
  });
</script>

Retest

Activate the control and confirm that the result is announced.
Confirm that keyboard focus remains on the control.
Repeat the update and check that changed messages are still announced without unnecessary interruption.

Report it

Example: The synchronization result appears visually but is not exposed as a status message, so screen reader users receive no confirmation unless they search the page.

Standards and support

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

Editorially reviewed 20 July 2026.