Test live pages Free
Screen reader preview
See roughly what a screen reader lists on a page: headings, landmarks, links and form fields, plus the whole page in reading order.
Updated for Lumtera 1.2.2 and Lumtera Pro 1.1.1.
Overview
The Screen reader tab is part of review mode. It reads the page the way a screen reader's lists do, using the accessible names, roles and states worked out in your browser, and shows the result as five views: Headings, Landmarks, Links, Form controls and Read the page. It is built the first time you open the tab, and again when you choose Refresh preview.
Each view marks what may confuse a listener. Headings shows skipped levels and empty headings. Landmarks points out a missing main landmark and two landmarks of the same kind without different names. Links flags links with no name, text that says nothing on its own and the same text used for different pages. Form controls flags fields with no name, or named only by placeholder text or a tooltip.
Read the page lists the content in reading order, with each element announced as a role and a name, such as "heading level 2, Our story" or "link, Home". Images with no text alternative are marked. Each list is a single Tab stop: the arrow keys move through it and Enter shows the item on the page.
Why does it matter?
Screen reader users often jump from heading to heading, or pull up a list of every link, to find their way. A page can look tidy and still sound confusing: links that all say "Read more", fields named only by placeholder text, a menu and a footer that both announce as "navigation". Most editors never hear their pages this way.
What do you get?
- Headings as an outline, with skipped levels and empty headings marked.
- Landmarks, with a note when there is no main landmark or two of the same kind share a name.
- Every link, flagging links with no name, links that say nothing on their own, and the same text used for different pages.
- Form controls with their role, name and state, flagging fields named only by placeholder text or a tooltip.
- Read the page: the content in reading order, roughly as a screen reader would say it ("link, Home").
How does it work?
-
Open the Screen reader tab
In review mode, switch to the Screen reader tab. The preview is built the first time you open it.
-
Move through the lists
Pick Headings, Landmarks, Links, Form controls or Read the page. Use the Up and Down arrow keys to move, and Enter to show the item on the page.
-
Confirm with a real screen reader
Listen to anything that looks wrong with NVDA (free, on Windows) or VoiceOver (built into Mac and iPhone).
Who is it for?
-
Editors who have never used a screen reader
See why "Read more" repeated ten times is a problem, and how the heading outline sounds without the visual layout.
-
Checking forms
Find fields that only have placeholder text, which disappears once someone starts typing.
-
Preparing for real testing
Spot the obvious problems first, so time with NVDA or VoiceOver goes on the harder questions.
Good to know
How it behaves, what it needs, and where its limits are.
- A preview, clearly labeled
- The tab says it is an approximation of what screen readers announce and suggests NVDA or VoiceOver to confirm. Real screen readers remain the reference.
- Read-only
- Building the preview does not change, focus or scroll the page.
- Hidden text is shown
- Text that only screen readers get, such as a visually hidden label, appears in the lists. Choosing it tells you it is not visible on the page.
- Long pages
- Read the page stops after the first 800 items, and says so.
- Whole page, not just the post
- The preview covers everything on the rendered page, including the header, menus and footer from your theme.
Checks you will see here
-
WCAG 1.3.1 · ANeeds review
Page headings are missing an H1 or skip levels
-
WCAG 1.3.1 · ANeeds review
Page landmarks are missing or share a name
-
WCAG 2.4.4 · ANeeds review
Link text is vague
-
WCAG 4.1.2 · AError
Form field has no label
Questions
Something else on your mind? Contact support
Is this the same as testing with a screen reader?
No. It is a preview, worked out from the names, roles and states the browser exposes. Real screen readers differ from each other and from this preview, so they remain the reference.
Why does it say "Nothing stood out"?
The preview found no missing names, skipped headings or vague links. That is a good sign, not proof. Listen to the page with a screen reader to be sure.
Does it play audio?
No. It shows the announcements as text in the panel.
More in “Test live pages”
-
Free
Whole-page review
Check a page the way visitors see it — theme, header, menus, footer and page-builder output — with {page_checks} checks for contrast, target size, keyboard and widgets.
-
Free
Keyboard walk and widget tests
Review mode's Keyboard tab numbers every Tab stop on the page, flags focus you cannot see, and opens menus, dialogs and tabs from the keyboard.
-
Free
Contrast everywhere, with a palette fixer
Contrast measured on gradients, images, text shadows, controls and focus rings, plus a block editor fix that suggests the nearest passing color from your palette.
Start with the free plugin today
All 69 content checks and 33 whole-page checks, fixes you approve with undo, and the site report — free, with no account and no page limits.