Screen Readers


JAWS and other assistive technologies

Many students with visual impairment use an assistive technology called a screen reader. According to a 2015 survey done by WebAim Links to an external site., the most commonly used screen reader was JAWS ("Job Access With Speech"), but there are others, like NVDA Links to an external site., are gaining in popularity. Screen readers are specially designed software programs that read aloud any content that appears on a computer screen. Web-based text needs to be specifically formatted to work well with screen readers. If a screen reader encounters text on a web page that is not properly formatted for accessibility, the narration it produces would sound a lot like an audio version of the unformatted block of text you saw on the previous page. The screen reader would start at the first word on the page and continue to the last word. The chunking, headers, lists, and hyperlinks that are so helpful to sighted users would be completely missing from this experience.

But screen reader software is sophisticated. It allows the user to "scan" the page by telling the screen reader to look for headings, images, lists, or hyperlinks. To do this, however, the screen reader relies on "tags" in the HTML coding to find the features. Text that has not been "tagged" correctly is like the giant block of unformatted text —  unfriendly, uninviting, and not useful. 

Common mistake

Manually formatting "the look" of a heading (such as applying larger-sized text) creates inaccessible instructional materials as it lacks the unique tagging that only built-in Rich Content Editors can provide. In addition, adding color, using all capitals, or italicizing creates distractions that can impact the learning of any student.


Navigating with a screen reader

Screen readers can navigate strictly via headings, images, tables, and links on a page. Headings need to be formatted using the tools provided in the platform you are working in, such as a built-in Rich Content Editor (RCE) in an online platform (as is found in Canvas or LibreTexts) or using "styles" in a word processing program (such as Word or Google Docs). No matter what the authoring program is, built-in tools place a unique "tag" on text or pictures that relay crucial information to screen readers like the heading level, the reading order, and define whether an object is a text or an image. These tags help students access and navigate your instructional material. 

To get a better sense of what a screen reader does, view this short video.


Your choices in formatting affect your students

Later in the course, we'll discuss color usage and the acronyms LIST and CAT. Note that by applying these accessibility principles, your instructional content can be formatted for any student ability, for example, braille. 

Watch this video to learn how formatting affects our students. These concepts are also presented below in text format.


HTML

Hypertext Markup Language (HTML) is a standardized system for tagging text to achieve font, color, graphic, and hyperlink effects on web pages. 

This really just means that HTML is a formatting language. It tells browsers how to lay out and display the content on the page. Access to basic HTML gives you greater control over the appearance of your pages. Using any of the RCE tools will create different types of tags. For example, if you use the bulleted list tool in the RCE tool, you are creating an unordered <ol> HTML tag.

With tags, screen readers are able to decipher what the object is whether it is a numbered list, unordered list, a paragraph, an image, a link, etc. 

How screen readers interpret the tags:

<p>Here's a paragraph.</p>

<h2>Here's a heading 2.</h2>

Here's a bulleted list: 

<ul>

<li>Item 1</li>

<li>Item 2</li>

</ul>

How the browser renders the tags and how we see them:

Here's a paragraph.

Here's a heading 2.

Here's a bulleted list:

  • Item 1
  • Item 2

Symbols

Screen readers vary in how they interpret special characters. In many cases they are not read at all. Therefore, it is best to choose words over symbols.  For example, use the word "and" instead of the "&" symbol. You can find more details in this page that discusses how Screen Readers read various punctuation and typographic symbols Links to an external site..