Name
Accessible names
Find an icon button that has no meaningful name and repair what a screen reader exposes.
Course progress: 0 / 20 lessons
LESSON 1 OF 20
Start with the right mental model
A screen reader is not simply text read aloud. It is a way to explore, understand, and operate a product through information exposed by the interface.
In this lesson
Recognise the screen reader as both an output system and a navigation system.
What a screen reader does
A screen reader converts interface information into speech, refreshable braille, sound cues, or a combination of these. It communicates content such as text, headings, links, buttons, form fields, errors, and status messages. Output is only one part of the experience: a screen reader also provides commands for moving through and operating the interface.
- Move between headings, links, controls, form fields, and other structures.
- Read continuously or move through content one item at a time.
- Explore a touchscreen by moving a finger across it.
- Navigate using a keyboard, touch gestures, or braille controls.
- Activate controls, enter text, change values, and complete tasks.
A product example
Imagine a mobile banking app with a page title, navigation menu, search field, account sections, and a list of recent transactions. A sighted user may understand the page through visual position, size, colour, imagery, and spacing. A screen reader user needs equivalent meaning to be exposed programmatically. They may navigate to the page heading, move to the search field, jump through section headings, and inspect transaction buttons. A control might be announced as “Transfer, button” or “Show balance, toggle button, not pressed.” That output communicates the control’s name, role, and current state. If the balance control is only an unlabeled icon, the visual design may look complete while the alternative interface remains incomplete.
What a screen reader is not
A screen reader should not be confused with other accessibility features. A person may use several of these features together, but they solve different access needs. Supporting one does not automatically make a product usable with another.
- Captions provide a text alternative for speech and important audio.
- Audio description describes important visual information in video.
- Magnification enlarges or changes the presentation of visual content.
- Voice control lets users operate a product using spoken commands.
A common misconception
Screen reader accessibility does not mean making every visible detail audible or narrating the interface pixel by pixel. The goal is to expose the content, structure, relationships, controls, states, and feedback needed to understand and operate the product. Visual and screen reader experiences do not need to be identical, but they should provide equivalent meaning and access to the same tasks.
Output
Output includes speech, refreshable braille, tones, and optional visual focus indication. Users may customise voices, speaking speed, punctuation, verbosity, and braille presentation. Test whether the necessary information is available rather than expecting one exact spoken sequence.
Navigation
Screen readers provide commands beyond ordinary keyboard tabbing. A user may move by heading, link, control, landmark, table, list, or other structure. A visually organised page can still feel unstructured when those sections are not represented programmatically.
Interpretation
The screen reader interprets names, roles, states, values, order, and relationships exposed by the product and platform. If a selected tab is shown only through colour, its state does not automatically become meaningful screen reader output.
Interaction
A screen reader is also an input system. Users activate controls, edit text, change values, navigate media, dismiss dialogs, and complete transactions. After an action, they need feedback that explains what changed and whether it succeeded.
TRY THIS NOW
Experience information, operation, and feedback
Use the control below with a keyboard and, if available, a screen reader. The visible label, button role, current state, and result all contribute to the complete interaction.
The preference has not changed.
Notice: the button's accessible name and pressed state change together, and the result is also available as a status message.
What to remember
The screen reader does not merely describe the screen. It provides an alternative interface to the product.
Try this with your team
Choose one product your team owns. Identify what a person must understand when it opens, how they can discover its main sections, which controls and states they need, how changes are communicated, and how they can recover from an error. Answer without relying on colour, position, size, or other purely visual cues.
Knowledge check
Answer every question, then use the forward lesson button to record this lesson as complete. The check is not scored and can be repeated.