Making web accessibility an active part of your organization's culture
To create an accessible website, go beyond typical point-and-click interfaces. Allow people with visual impairments to navigate pages via keyboard and voice commands. With this extra level of interaction, you'll make your site more usable for all visitors — including those with mobile devices and slower internet connections.Sometimes accessibility is the law. For example, section 508 of the Workforce Rehabilitation Act requires U.S. government agencies to design accessible websites. In the U.K., the Equality Act 2010 requires building services that don't exclude anyone based on disability. But even when not required, accessible design sends the message that everyone is welcome to your website.
1. Help people skip navigation links
At the top of each page, include a "skip navigation" link. This feature directs screen readers (text-to-speech software) to bypass links that appear on every page. Website visitors can get directly to the content rather than hearing the same navigation links repeated every time they click the "back" and "forward" buttons.
2. Stick to one window
Let people stay in the same window or tab as they browse your website. Remember that screen readers don't always indicate when a link has automatically opened up a new tab or window. As a result, people with visual impairments can get confused about which page is currently being displayed.
3. Label links with meaningful text
People who use text-to-speech apps often skim a web page by tabbing quickly tab from link to link. Help them out by giving each link a clear description. For example, "five guidelines for writing an effective blog post" is more informative than "click here."
4. Label images with meaningful text
As an experiment, go to your website's home page and change the settings on your browser to disable images. Then reload the page. If your website is accessible, you'll see "alt text" in place of each image. For instance, "[name of your organization] logo" will replace the logo image.
The purpose of alt text is to clearly label an image for people who can't see it. To write more descriptive alt text:
- Describe the function of an image rather than its content. For instance, replace a search button with "search the content of this site" rather than "image of a magnifying glass."
- Front-load alt text with keywords to signal different kinds of content. "Podcast: When to outsource your HR department" is more efficient than "When to outsource your HR department: today's podcast."
- Keep alt text brief. Keep in mind that every extra word is one more thing for screen readers to translate. However, don't sacrifice clarity for brevity. Label complex images with a more complete description. Give people the information they need to take the next step with your content.
- Be careful with images that include text. If an image includes text, put all of those words in the alt text.
- Double-check your work. To avoid confusing screen readers, check spelling carefully and avoid abbreviations.
5. Label elements of online forms and tables
Include HTML tags to describe the various elements of forms — text fields, check boxes, drop-down menus and buttons. Also label required fields with the word "required" rather than highlighting them in a different color.
For tables, include labels that associate the content of each cell with column and row identifiers.
6. Provide documents in text-based formats
When posting documents on your website, don't limit them to PDF files. Also provide HTML, rich text format (RTF) or word processing versions.
7. Provide captions and transcripts
Make sure that videos on your website include audio captions for any embedded slides or other static images. In addition, provide transcripts for videos, webinars and podcasts.
8. Let users adjust settings
Allow website visitors to change colors and font sizes. Also express font sizes in percentages above or below 100 rather than the more technical language of pixels or points.
9. Limit non-HTML elements
Screen readers aren't always compatible with the latest version of web browsers. People with disabilities might access your site with an older application — one that chokes on Java, Javascript, Flash or other non-HTML elements.
Design your website with this possibility in mind. Rather than relying on plugins, include HTML5 players with large controls for playing audio and video content.
10. Create policies for web accessibility
Provide your IT staff with training in web accessibility. If you contract with a consultant for web design, include accessibility as a project requirement. Transform web accessibility from an optional extra to an active part of your organization's culture.
References
American Foundation for the Blind: Creating accessible websites
General Services Administration: Section508.gov
W3C Working Group: Understanding WCAG 2.0: A guide to understanding and implementing Web content accessibility guidelines 2.0 (2016)
Usability.gov: Accessibility basics
Accessibility Community: Making your service accessible: An introduction (2016)
