Skip to content
UX Atlas
AccessibilityCraft conventionIntermediate

Screen Readers

Software that reads the interface aloud, navigating by structure rather than by layout.

Definition

A screen reader converts the accessibility tree into speech or braille. Users navigate by headings, landmarks, links, form controls and tables, which makes semantic structure the primary interface rather than the visual layout.

Craft convention. True because the industry converged on it. Breaking it costs familiarity, not correctness.

On this page
  1. Definition
  2. How people actually navigate
  3. Common pairings to test against
  4. Sources
  5. Continue from here

How people actually navigate

  • By headings, which is the most common way of exploring a page. Correct heading levels are therefore navigation.
  • By landmarks: header, nav, main, aside, footer.
  • By pulling up a list of all links, which is why link text must make sense out of context.
  • By form control, in forms mode.
  • By table row and column, when the table markup is correct.

Common pairings to test against

Screen readerPlatformUsual browser
NVDAWindowsFirefox or Chrome
JAWSWindowsChrome
VoiceOvermacOSSafari
VoiceOveriOSSafari
TalkBackAndroidChrome

Sources

Where a source establishes something narrower than the popular reading of it, the note says so.

Continue from here

Each link says what the connection is, so you can tell a principle from an alternative from a thing people mix this up with.

Applies when you are designing

A Data TableA Mobile AppAn AI Product

Depends on

Get these right first, or this one will not hold.

  • Heading StructureAccessibility

    Headings are the primary way screen reader users skim a page.

Often used with

These usually appear in the same screen or the same decision.

Check your work

Review passes that test whether this was done properly.

Short definition

The one-paragraph version, for when that is all you need.

Related concept

Connected closely enough to change how you apply this.