Why Accessibility? Building Websites Everyone Can Use
After completing this lesson, you will be able to:
- Describe some accessibility issues for users with visual impairments
- Describe the advantages of making websites more accessible
- Install the extensions needed for this class
- Evaluate the accessibility of a page using ChromeVox and Developer Accessibility Tools
Time to complete
Accessibility can mean a lot of things. You might think of web accessibility as making products and services available to all users, regardless of their physical ability, internet speed, or the device they are using. While these are all accurate, in this course we will focus on creating websites that are more accessible to users with visual impairments.
You have enormous potential to reach a large audience through the web. By creating content with as few assumptions as possible about the users of your websites and applications, you can reach a much larger audience.
Some of your assumptions might include:
- the size of a user’s display
- a user is using a mouse
- all users see colors in the same way
- all users see their screen
- all users can read the text
Image 1. Devices with multiple screen sizes
Why make something accessible?
The more inclusive your application is, the broader the reach. Why exclude a segment of the population? While it might not always be easy, you might discover that improving the accessibility of your site can improve the experience for all users.
Well-created web content works in a wide variety of contexts, from desktop to mobile, continues to function in low-bandwidth environments, and degrades gracefully if the user’s device or browser is missing certain features. In this course, you will learn how to add common accessibility features that you can apply to your own websites right away to improve their usability for people who are blind or have low vision.
To get started, complete the following:
- If you do not already have have a screen reader installed, install the Google Chrome extensions ChromeVox and Accessibility Developer Tools
- Watch a short ChromeVox demo (you might want to opt-in to the HTML5 YouTube Player)
- Watch the Accessibility Developer Tools demo by Alice Boxhall
Now, use ChromeVox and the Accessibility Developer Tools on your own website, or on any website you visit often, and answer the following questions:
1. Close your eyes and interact with your site using only your screen reader and keyboard, pressing Tab to move to links, and Enter to click. Are there any parts of your site that do not work as you expected? Take note of these so you can fix them as you go through the course. NOTE: if you need to use ChromeVox visually (e.g. you are a user who is deaf or has a hearing impairment) please see the FAQ page for instructions.
2. Pay attention to how many of the Accessibility Audit tests passed. You can ignore those that were not applicable. Watch this video to learn how to run an audit. NOTE: In Google Chrome go to chrome://extensions and make sure to place a checkmark in the "Allow access to file URLs" box next to the Accessibility Developer Tools extension.
3. Which of the Accessibility Audit tests passed? Don’t worry! By the end of this course you’ll know how to fix many of these issues: