Screen Reader Demo

Experience a screen reader in action by exploring two versions of the same product.

The most effective way to understand what a screen reader does is to experience it. Embedded here are two versions of the same ASTHOBrief. The "good" version is ASTHO's actual work product. The "needs improvement" version is one that has deliberately been made less accessible by adding in multiple links, not following good link text practices, and stripping out all of the page structure. They may look similar, but difference is significant once assistive technology gets involved.

Using Best Practices

Needs Improvement

Best Practices Make a Big Difference

After playing both videos, you'll notice some key differences that change the experience for users who employ screen readers.

Document Structure

  • Headers aren't decorative — using the built-in header structure, in the correct order, helps users identify new sections (and subsections), which allows them to have a better feel for the structure of the product and where they are in it.
  • List elements allow screen readers to alert users to the size of a list (number of entries) and when they have moved to a new entry.

Fewer Links

Too many links can be disruptive to the reading process for people who use assistive technology. Having the flow of information constantly interrupted by link annoucements can make it hard to follow the content.

Descriptive Link Text

Good Links in Action

This clip comes from the end of the Best Practices video, it is a demonstration of the screen reader jumping from link to link as it navigates the page. It highlights the fact that good link text will help users know what to expect if they click through.

Bad Links in Action

As a contrast, this video shows the screen reader tabbing through the links on the Needs Improvement version of the page. The vague link text makes it difficult for users to know what to expect if they open a link.

We would like to extend special thanks to Maggie Nilz for agreeing to let us use her real ASTHOBrief, Better Defining Disability Will Make Data More Inclusive and Usable, as an example of what to do. And for letting us make a not-so-great version of it to illustrate why best practices matter.