At WordCamp US 2017, I caught the tail end of a session titled “Pah! Jamaican Sign Language and WordPress” presented by Bianca Welds. At one point she said something like, “if I plan an event I don’t want to ask, ‘Will there be deaf people there?’ Instead I want to prepare for the needs of the deaf and advertise that so that they will attend.” It’s an idea I can’t get out of my head. The problem is, we tend to think about who our audience is, not who it could be.
…we tend to think about who our audience is, not who it could be.
By making your site accessible, you will attract an audience of people looking for accessible content. By avoiding accessibility, you will drive away that audience. So what steps can you take to improve your site’s accessibility?
Improving Accessibility
Listen to your site
During a presentation at WordCamp DC 2017, Lindsey Kopacz played some audio clips of sites that had good and poor accessibility. The difference was astounding.
A well done site is easy to navigate and explains what is happening in each part of the site. A poorly done site repeats a lot of random and useless information. If I had to rely on a screen reader I’m not sure I could stand to be on most websites.
This presentation inspired me to investigate a plugin I was updating and use a screen reader to navigate the prompts. Not only were the icons completely pointless with the reader (something I was actively working to solve), but the way it read through the actions was confusing and intolerable.
It took me a good day of work to just finish that one plugin, but when I did the end result was so much better. Each icon explained what the link was going to do and all the extra garbage was gone. Now I’m even more proud of that plugin because I know it looks amazing and sounds great too.
This is why the very first step to improving your site accessibility is to listen to the site.
There are a few ways to do this on a PC. Newer versions of Windows have a built-in accessibility feature. Once you turn it on you can navigate the entire OS using the reader. It can get annoying so before you turn it on, review how to turn it off. I was ready to throw away my computer when trying to navigate the web to figure out how to turn it off.
There are also some programs you can get for PC if your version doesn’t support accessibility out of the box.
On Mac, just use the built in VoiceOver utility. It’s pretty easy to setup and has some nice features to make it easier to use.
For other platforms or to try tools beyond the built in utilities, here is a handy resource.
Once you have the reader working, try navigating your site. You may be pleasantly surprised, but in my experience you will likely get frustrated quickly.
Turn off the worst offenders
Did I mention the plugin I was fixing was really bad before I finished the update? I use that plugin on several sites and never realized how bad it was until I took this advice and listened to my site.
If I weren’t a developer for the plugin, it would have been deactivated. The simplest solution is to ask if you really, really need the plugin when it sounds that bad. Unless you really need them, deactivate the least accessible plugins on your site.
You may also need to evaluate your theme. Many theme developers never think about accessibility. They have beautiful themes full of images and icons that mean nothing to a screen reader. They have huge menus that can’t be navigated, and even take a site that could be read by many users without a reader and make it impossible for color blind and visually impaired users who can see but not in low contrast.
If your theme is inaccessible then it is time to think about getting a new theme.
You are telling users, ‘here is an image and you don’t matter enough for me to describe it to you.
Evaluate your content
This is HUGE and something a theme cannot help with.
One of the biggest mistakes people make is how they handle the alt tag for images. This tag is intended to be used when the image cannot be seen. This occurs when the image can’t be found on the server, when images are turned off in the browser, or when using a screen reader.
Often people use this field to try and gain better rank in the search results page. The images are filled with keywords that serve no purpose and worse, drive away users with screen readers because they make it impossible to understand.
Other times the field is left blank, which reads as a pause with no information. You are telling users, “here is an image and you don’t matter enough for me to describe it to you.”
Finally there are those who will use it for the caption text. This is an interesting way to do it, unless there is a caption for the image already. Because then the exact same content is read twice. As you can imagine, that is annoying.
The alt tag should describe the image but more importantly why the image is there. After all, an image may be worth a thousand words but it is far better to say the correct words to describe the image instead of writing with great detail.
The goal is to give relevant information to those who are not seeing the image while trying not to bore them so they leave your site.
Hire an expert
There are over 8 million Americans with some form of visual impairment. Consider how few sites are actually enjoyable to listen to. If your site is crafted to be as pleasing to use with a screen reader as it is with a browser, then you are opening the door to a significant audience that you had previously excluded.
Bringing an expert has a lot of potential for return on investment. Remember what Bianca Welds said about making sure the event is accessible in order to advertise to a whole new audience? That is what happens when you make a site accessible. It can be advertised to new readers and if it is a joy to listen to, they will become your supporters. If you are able to bring in only 1% of those 8+ million Americans (not to mention the millions more in the world) then you are talking a new audience of 80,000. There aren’t many things you can do on a site that can open up access to this kind of audience.
At the minimum, the next time you are planning on a new design, make sure that your developer understands accessibility.
