WCAG Understandable Principle

Principle 3: Understandable

Information and the operation of user interface must be understandable. Users must be able to understand both the content and how to use the interface.

Why Understandability Matters

The Understandable principle ensures that content is clear and interfaces behave predictably. This is critical for users with cognitive disabilities, learning disabilities, reading difficulties, and those who are not fluent in the page's language.

54%

of US adults read below 6th grade level

15-20%

of people have learning disabilities like dyslexia

21%

of US population speaks non-English at home

Guideline 3.1: Readable

Make text content readable and understandable.

3.1.1 Language of Page (Level A)

The default human language of each web page can be programmatically determined.

How to Implement:
<html lang="en">
<html lang="es">
<html lang="fr">

Why It Matters: Screen readers use the language attribute to select the correct pronunciation rules. Without it, content may be read with incorrect pronunciation.

3.1.2 Language of Parts (Level AA)

The human language of each passage or phrase can be programmatically determined, except for proper names, technical terms, and words of indeterminate language.

Example:
<p>The French phrase <span lang="fr">c'est la vie</span> 
means "that's life."</p>
Best Practice: Plain Language

While not a WCAG requirement at Level AA, writing in plain language significantly improves accessibility:

  • Use short sentences (under 25 words)
  • Avoid jargon and technical terms
  • Define abbreviations on first use
  • Use active voice
  • Aim for 8th grade reading level or lower
  • Use bullet points and headings to break up content

Guideline 3.2: Predictable

Make web pages appear and operate in predictable ways.

When any user interface component receives focus, it does not initiate a change of context.

Violations:
  • Forms that submit when a field receives focus
  • New windows that open when a link receives focus
  • Focus causing page navigation

Rule: Focus should only move the visual focus indicator - nothing else should happen until the user takes explicit action.

Changing the setting of any user interface component does not automatically cause a change of context unless the user has been advised of the behavior.

Common Violations:
  • Select menus that navigate immediately on selection
  • Radio buttons that submit forms
  • Checkboxes that trigger page changes

Best Practice: Use a submit button for form actions rather than auto-submit on input change.

Navigational mechanisms that are repeated on multiple web pages occur in the same relative order each time they are repeated.

  • Main navigation in same position on all pages
  • Links in same order across pages
  • Search box in consistent location
  • Footer links consistent

Components that have the same functionality are identified consistently.

Examples:
  • Search icon always represents search (not magnifying glass for one thing and search for another)
  • "Submit" vs "Send" vs "Go" - pick one and use consistently
  • Same icon for print on all pages

Guideline 3.3: Input Assistance

Help users avoid and correct mistakes.

3.3.1 Error Identification (Level A)

If an input error is automatically detected, the item in error is identified and the error is described to the user in text.

  • Error messages in text (not just color)
  • Identify which field has error
  • Describe what the error is
3.3.2 Labels or Instructions (Level A)

Labels or instructions are provided when content requires user input.

  • All form fields have visible labels
  • Required fields clearly marked
  • Format hints provided (MM/DD/YYYY)
3.3.3 Error Suggestion (Level AA)

If an input error is automatically detected and suggestions are known, then suggestions are provided.

Example: "Email address must include @. Did you mean example@email.com?"

3.3.4 Error Prevention (Level AA)

For legal, financial, or data submissions:

  • Reversible: Allow undo
  • Checked: Validate before final
  • Confirmed: Review before submit
3.3.7 Redundant Entry (Level A) - WCAG 2.2

Information previously entered by or provided to the user that is required to be entered again in the same process is either auto-populated or available for the user to select.

Examples:
  • Shipping address auto-fills billing address option
  • Multi-step form remembers previous entries
  • Don't ask for email twice in same form
3.3.8 Accessible Authentication (Level AA) - WCAG 2.2

A cognitive function test is not required for any step in an authentication process unless alternatives are provided.

What's Not Allowed (without alternatives):
  • Remembering passwords (allow paste, password managers)
  • Transcribing codes or words
  • Solving puzzles or math problems
  • Recognizing objects in images
Acceptable Alternatives:
  • Email/SMS authentication links
  • OAuth (login with Google/Apple)
  • WebAuthn/passkeys
  • Copy-paste support for codes

Common Understandable Issues

Issue Prevalence How to Fix
Missing language attribute 18% of sites Add lang="en" (or appropriate code) to html element
Unclear error messages 45% of forms Describe what's wrong and how to fix it
Inconsistent navigation 22% of sites Use same navigation structure across all pages
Auto-submit on selection 15% of sites Use explicit submit buttons for form actions
Missing form instructions 38% of forms Add clear labels, format hints, required indicators

Related WCAG Principles

Perceivable

Text alternatives, captions, contrast
Operable

Keyboard access, timing, navigation
Robust

Compatible with assistive technologies
On This Page
Related Laws
Plain Language Tip

54% of US adults read below 6th grade level. Keep sentences short and use common words.

Common Issue

45%

of forms have unclear error messages