Course progress: 0 / 20 lessons

PRACTICE 4 OF 5 · Forms and validation

Live validation timing

Type into a field and notice when validation becomes too early or too noisy.

  • Level: Intermediate
  • Time: 5-10 minutes
Objective

Check whether live validation gives useful feedback without interrupting normal entry.

PREPARE

Set up your test

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

WORKING EXAMPLE

Establish the expected behavior

Type an email address slowly, then leave the field. Listen for when validation feedback appears.

Use a work email address.

Expected behavior: validation waits until blur or submission, then provides clear feedback without interrupting every character.

INTENTIONAL DEFECT

Find the barrier

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

Type an email address slowly. Listen for whether the error interrupts normal entry.

Use a work email address.

Hint

Listen while typing the first few characters, before the address could reasonably be valid.

End of intentional defect.

DIAGNOSE

Choose the primary cause

What is the primary problem with the defective live validation?

EXPLANATION

Understand and repair it

Reveal explanation

What happened

The defective field updates a live error on every keystroke. This can create repetitive announcements while the user is still entering a valid value.

Repair

Delay validation until blur or submission for fields that cannot be judged fairly mid-entry. Reserve live feedback for genuinely useful, low-noise guidance.

email.addEventListener("blur", () => {
  if (!email.validity.valid) {
    error.textContent = "Enter a valid email address.";
  }
});

Retest

  • Type slowly and confirm feedback does not interrupt every character.
  • Leave the field with an invalid value and confirm the error is available.
  • Correct the value and confirm obsolete errors clear.

Report it

Example: The email field announces “Enter a valid email address” on each keystroke, making normal screen reader entry noisy and distracting.

Standards and support

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

Editorially reviewed 20 July 2026.