I decided that my first blog on this website would be about web accessibility. The way that I describe accessibility to non-web people is to say it is to the web what wheelchair ramps are to buildings. Wheelchair ramps help people with physical challenges get into buildings. Accessibility for the web ensures that people with a variety of challenges can visit websites and have an equivalent experience that person without that disability has.
The Worldwide Web Consortium (https://W3.org) has global professionals who create web standards and have also created accessibility standards for the web. The c. urrent standards, WCAG 2.0, can be found at https://www.w3.org/TR/WCAG20/. They are very extensive and encompass a broad range of disabilities and parts of a website.
Learning What Accessibility Means
There are a number of webinars available regarding web accessibility. I regularly attend webinars to keep up with what is happening in the industry and to learn more about how I can ensure my websites, both at work and for my personal customers, are as accessible as possible. If you ‘Google’ or ‘Bing’ or whatever search engine you use and enter ‘web accessibility’ or ‘web accessibility training’ you’ll find a number of resources. Wikipedia has an article at https://en.wikipedia.org/wiki/Web_accessibility that covers the basics. YouTube also has some videos of people using assistive devices.
Assistive Devices
Simply put, an assistive device helps a person with physical challenges navigate websites or their computers. Some visitors can’t use a mouse or need a special keyboard. Some need things magnified. There is a wide range and I recommend finding training materials regarding the breadth of these devices. Not only will it open your eyes as to the extent of challenges but it will help you get an understanding of why some of WCAG guidelines exist.
One of the most widely used tools is probalby JAWS – it is a computer tool that reads the screen for people with visual difficulties. Paired with a braille keyboard, it allows a person who is blind to work easily on a computer. If you ever get the chance to view someone using JAWS, I recommend it. It is humbling to see how quickly a person can listen to the text and it gives you a good sense of how a person can navigate around a website. For example, a person can have the tool just list the header tags (H1, H2). This is one of the reasons why it is very important to structure your HTML tags like your English teacher taught you how to create an Outline for your term papers (do people still have to do that?) If you structure a web page like an outline, with header tags nesting the topics accordingly, it makes the web page easier for a person using JAWS or other tools to navigate.
Another of the WCAG guidelines deals with hyperlink text. People have gotten used to links labeled ‘Click here’. But imagine if you were having a website read to you by links and it sounded like this: ‘Click Here… Click Here… Click Here…’ The WCAG guidelines indicate that the link text needs to be understand independently of the text around it. So, instead of ‘Click Here’, an alternative could be ‘View the XYZ document’.
UC Berkeley has a list of assistive devices with explanations at https://webaccess.berkeley.edu/resources/assistive-technology but a search for ‘assistive technology devices’ will help you learn more and possibly find videos of them in use.
Things I’ve Learned
Some of the things that assist people in navigating are just good structured HTML code. As I mentioned above, structuring the header tags properly is a basic one. What I tell people who edit web pages is not to pick a header tag by how it looks but how the page needs to be organized. Using Cascading Style Sheets (CSS), you can change the look of headers by what you need – just don’t pick an H5 tag, for example, because you want the text to look a certain way.
Another thing to keep in mind is the contrast of the text color against the background. I would guess that everyone has visited some website at some time and pulled back because the page ‘hurt your eyes’. If the contrast is not sufficient, it can make the page difficult to read for anyone but especially for people who are visually challenged. One of the challenges of meeting this requirement is that the ‘pretty’ colors a person would like to use may not contrast sufficiently with the background of the text area.
The WCAG guidelines are so extensive, I, for one, would find it impossible to read front to back. So, it can be important to find some tools to analyze your site and point out the rules that you are not meeting. In addition, the guidelines change regularly and the tools will highlight new issues if you use them regularly.
Some Tools I’ve Found Useful
There are website checkers that crawl your site and list A, AA and AAA rules that are not met. The AAA rules are considered the most important to meet first.
Here are some tools that I’ve used:
- WebAIM is an organization that provides information and some tools for accessibility. One of their I use regular is the Color Contrast Checker which helps you figure out a background and text color that meets the WCAG requirements. The checker is found at https://webaim.org/resources/contrastchecker/ They have other tools on their resources page but this is the one I use regularly.
- SiteImprove – this is a commercial tool that checks your website to find accessibility issues as well as things like broken links and misspellings. We use it at work and I’ve found it invaluable in working through issues on our sites. Of course, there is a price for this tool and you’ll need to assess what your budget can withstand. In my eyes, it has been worth the price in my professional life. There are competitors to SiteImprove that have come onto the market but SiteImprove has not let me down.
- WebAIM has a free accessibility checker called WAVE that can be found at http://wave.webaim.org/ I’ve used this in my personal life and it is sufficient to identify issues. Maybe not as fancy an interface as SiteImprove but effective for those on a budget.
- W3C has a list of accessiblity tools at https://www.w3.org/WAI/ER/tools/ A quick search of ‘web accessibility tools’ on your favorite search engine will result in a plethora (my $20 word of the day) of results.
Why Make Your Website Accessible?
In order to be inclusive of everyone, independent of how they visit your website, it is critically important to ensure that your website meets the WCAG guidelines. We certainly wouldn’t want to turn away visitors because they are unable to navigate or do business with us via our website. In addition to the altruistic reasons for ensuring your website is accessible (It IS the right thing to do!), there are legal reasons. Recently, the Supreme Court ruled against Domino’s because their website and mobile app did not provide a blind customer with the same options as other customers. There are hundreds of cases regularly filed so even if you aren’t motivated by the ‘right’ reasons, maybe the thought of going to court might make you do the right thing!