Accessibility and screen readers

Completed

The web is an amazing place, and it's best when everyone can participate. The first step in building accessible web applications is a basic awareness of the diverse ways that users interact with those applications.

The importance of inclusive design

When you're developing a web app, it's easy to get into a workflow of writing some code, testing it in a browser, fixing bugs, repeat, repeat, repeat. Unfortunately, this approach leads to web apps that don't work for everyone.

There are good reasons to consider accessibility in your web apps:

  • A substantial number of your potential users might have one or more impairments that require them to interact differently with web apps. Improving accessibility increases your potential user base.
  • Web apps are now under many legal requirements for compliance with web accessibility standards. Failure to incorporate accessibility into your development methodology can result in legal and financial penalties.
  • Accessibility is a human right. Helping others to gain full access to the internet is the ethical thing to do.

We don't all browse the same way

Web developers often focus on conventional browser-based interaction, but many users access applications in different ways.

Screen readers

One of the best-known accessibility tools is a screen reader. Screen readers are commonly used clients for people with vision impairments. They're built into most operating systems.

At its most basic, a screen reader reads a page from top to bottom audibly. If your page is all text, the reader conveys the information in a similar way to a browser. It's rare that webpages are purely text; they contain links, graphics, color, and other visual components. Care must be taken to ensure that a screen reader can correctly read this information.

Visual impairments

Visual ability is a spectrum. Some users require, or prefer, an auditory experience. Many prefer a visual experience but might encounter issues with small text or contrast.

Input devices

Developers commonly consider keyboard, mouse, and mobile touchscreen interactions in web apps. However, these devices are just some of the ways that users interact with computers and web apps. Other modes include ergonomic keyboards, chording keyboards, voice interaction, eye tracking, and head tracking.

The web is an accessible platform

All this information might seem a little daunting. Fortunately, HTML and web standards are designed for accessibility. In many cases, when you follow web standards, your web apps "just work" in various accessibility scenarios or require minor modification.

The ASP.NET Core templates are built with Bootstrap, which is designed with accessibility in mind. It considers responsive design, structural markup, and color contrast. Although it's not automatic accessibility, it can help get you started.

Accessibility Insights for Web intro

In this module, you use a browser extension called Accessibility Insights for Web to find and fix accessibility issues in web apps and sites.