PRACTICE 5 OF 5 · Forms and validation
Character counter
Type in a limited field and test whether remaining characters are announced usefully.
Check whether counters communicate limits without creating noisy live announcements.
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 into the field. Listen for the limit description and whether announcements stay useful.
Expected behavior: the limit is available, and status updates are limited to useful moments such as near or over the limit.
INTENTIONAL DEFECT
Find the barrier
The example below deliberately contains one accessibility defect. Skip the defective example.
Type several characters and listen for repeated count announcements.
Hint
A live character count can become noise if every character is announced.
End of intentional defect.
DIAGNOSE
Choose the primary cause
EXPLANATION
Understand and repair it
Reveal explanation
What happened
The defective counter sends a live announcement for every character. This can interrupt screen reader users while they are composing text.
Repair
Expose the limit as a description. Announce only meaningful thresholds, such as when the user is near the limit or has exceeded it.
<textarea maxlength="40" aria-describedby="bio-help bio-status"></textarea>
<p id="bio-help">Maximum 40 characters.</p>
<p id="bio-status" role="status"></p>Retest
- Focus the field and confirm the limit is available.
- Type normally and confirm count changes are not announced on every character.
- Approach the limit and confirm useful feedback appears.
Report it
Example: The short bio counter announces the remaining character count after every keystroke, interrupting text entry for screen reader users.
Standards and support
This exercise describes behavior rather than promising identical speech across screen reader and browser combinations.
- WCAG 2.2: Understanding Labels or Instructions
- WCAG 2.2: Understanding Status Messages
- WAI-ARIA: aria-describedby
Editorially reviewed 20 July 2026.