Accessibility Demo Page

This page is designed to show how people can use screen readers like NVDA or VoiceOver to navigate content.

Headings

Just as sighted users scan pages by looking for bold or larger headings, people who use screen readers can also quickly jump between headings to find what they need.

Heading Levels

That’s why heading levels are so important. They make pages more easily navigable for more people.

Coding Heading Levels

The heading level above was styled visually as a heading but it is not coded as one. When we don’t use proper heading levels, it can make pages more time-consuming to navigate and create confusion.

Skipping Heading Levels

And if we skip heading levels (like jumping from a level 3 to level 5 without an order) page structure can become confusing to navigate and it can be difficult for people to understand how content is connected.

Links

Links Need Unique Text

But when links don’t have unique or descriptive text, it can be confusing or meaningless for people using screen readers.

Forms

This form asks for a name, an email address, and a favorite color, but is it accessible? Can you complete the form with just a mouse? How about with a screen reader? Can you submit the form?





Submit

Use of Color

Chart
Miles Ahead Project Homepage
American Society on Aging Hompage

©2025 Miles Ahead Project.

Created in collaboration with the American Society on Aging.
keeps it polished.