What’s the big deal about accessibility?

You may have heard about accessibility lately in regard to web design and development. And you may be wondering what the big deal is. What does it even mean?

Accessibility, in regard to websites, means that anyone can use your website, regardless of any disability they may have. You can make the most awesome website in the world, but if those with disabilities can’t use it, then you are missing potential customers. In the US, web accessibility isn’t something that’s been mandated by the ADA… yet. But it’s coming. And it should. We should all be making an effort to make websites accessible to everyone. Not only will it be beneficial to those who use screen readers for web browsing, but it’ll also be good for your bottom line.

A few examples:

• Say a visually disabled person wants to pay their homeowners insurance online, but when they go to the website, they can’t because the site isn’t working with their screenreader.
• School announcements posted on the school website can be troublesome to visually impaired parents that need that information, but can’t access it because the school website isn’t accessible.
• People with visual impairments like to shop online too. If your e-store isn’t accessible, then you are losing customers.

This isn’t necessarily about those that are blind. This extends beyond that to all kinds of visual impairments, including colorblindness. You may be raising an eyebrow and saying, “What’s the big deal with color blindness? They can still see the website.”

True. They can. But if you make poor color combinations, your text may be completely unreadable to someone with color deficiency. 

An example, say you love red and green and have a holiday themed website. So you make some graphic images that look like this:

Never mind that this is hideously ugly. There’s no accounting for taste. But say you decide that this color scheme is exactly what you had in mind and you’re thrilled.

Here is what someone with red-green colorblindness sees:

I bet you never even thought of that. But we need to think of it… because 8% of the male population is colorblind. That may not seem like much, until you realize that translates into approximately 280 million colorblind men in the world. That’s not including colorblind women, which happens on a lower percentage, but is still a consideration.

That’s a lot of colorblind people! 

A story:

A guy I went to high school with had an accident later in life that left him legally blind. His vision was almost completely gone. This is someone who used computers and smartphones on a regular daily basis. After the accident, he had to rely on screen readers, and at that time, web accessibility was not something that was even a consideration. While it’s gotten better, it’s not yet a widely accepted practice in the US.

We need to consider these people when making websites, and do what we can to make our websites useful for them.

A few basic things to do to enhance accessibility on your website:

1. Include proper alt text for images. If you are using images, screen readers can’t “see” the image. It’s not the same as having a person describing what’s in the image. The alt text is what the screen reader will read to the visually impaired person. No alt text means that they have no idea what your image is about.
2. Make sure your links are descriptive. No more “click here” links. Instead, use a descriptive phrase such as, “Learn more about our company on our About Us page” and add the link on the “about us” part.
3. Make sure your forms have field names. If you want someone to fill out the form, then they need to know what you are asking for.
4. Avoid tables unless you are displaying data. Don’t use them for design, screen readers will pick up the code for tables and alert the viewer to the number of columns and rows. (Remember when we all used to use nested tables? The olden days. But some sites still have them. Stop doing that.)
5. Use structured headings so that your content is correctly organized. <h1> is for your main title. <h2> for subtitles. Don’t skip to <h3> or <h4>. Choosing the header style because you like the way it looks instead of keeping it organized by hierarchy can confuse screen readers. Adjust your CSS to accommodate your headings.

If you haven’t considered making your site web accessible for the visually impaired, now is the time to do it.