PRACTICE 4 OF 5 · Forms and validation
Live validation timing
Type into a field and notice when validation becomes too early or too noisy.
Check whether live validation gives useful feedback without interrupting normal entry.
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
Type an email address slowly, then leave the field. Listen for when validation feedback appears.
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.
Hint
Listen while typing the first few characters, before the address could reasonably be valid.
End of intentional defect.
DIAGNOSE
Choose the primary cause
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.
- WCAG 2.2: Understanding Error Identification
- WCAG 2.2: Understanding Labels or Instructions
- WCAG 2.2: Understanding Status Messages
Editorially reviewed 20 July 2026.