How Accessibility Gets More and More Important in Web Development

How you can make your website accessible — including a checklist

Daan
Daan
Nov 7 · 4 min read
Photo by Glenn Carstens-Peters on Unsplash

Accessibility is essential for businesses and organizations that want to create high-quality websites for everyone. It’s important for these businesses and organizations to not exclude anyone from using their products or services.

But what exactly is an accessible website? An accessible website is a website that people with disabilities can perfectly use. This can be people that are visually impaired, blind, or deaf, etc.

According to W3, the global market of people with disabilities is over 1 billion people. And with increasing life expectancies, people spend around 11% of their lifespan living with a disability. Despite all of this, accessibility is not taken into account on most websites. At least not enough. The great thing about accessibility is that it not only improves the online experience of people with disabilities. Accessibility often improves the online experience for all users.

How do you know if your website is fully accessible? Generally speaking, a website is fully accessible if all users have equal access to information and functionality.


The Business Case for Accessibility

Besides your website being useable for everyone, there’s also a strong business case for accessibility. Case studies show accessible websites have better search results (SEO), reduced maintenance costs, and increased audience reach. The overall customer experience gets improved once a website gets more and more accessible.

The 1 billion people with disabilities I mentioned before have a spending power of more than $6 trillion. So when you are building your web shop. you probably should spend some time on making it accessible for everyone. If you’re looking to maximize your sales, you should start by making your web shop available for a broader audience.

But there could also be a totally different reason why you want your website to be accessible. Many countries have laws that require digital accessibility. Minimizing legal risk is sometimes the reason why you want your website to be accessible.


A Quick Checklist

As accessibility is getting more and more important, it’s a great tool to have under your belt as a developer. A lot of the points on this checklist are technically not very hard to implement but dramatically increase the accessibility of your website.

A few quick wins that you can do for your website:

Alt text for images

The alt tag is used in HTML to describe an image. If you’ve ever touched HTML you probably are familiar with the alt tag and its use.

The Web Content Accessibility Guidelines (WCAG) 2.1 states the following about text alternatives:

The alt attribute needs a helpful description for screen readers. Assuming you were blind, what would you need to know about the image? “Child” isn’t much help, but maybe “Child playing with toys in the garden” would give more information about that image to the people that use screen readers.

Note that if the image is purely decorative, you can leave the alt tag empty.

Contrast

People with low contrast sensitivity, mostly older people, and people with color blindness who cannot distinguish between certain colors benefit from sufficient color contrast between the color in the fore- and background.

Sufficient color contrast makes your content better readable, even for people that don’t have disabilities. And this doesn’t take a lot of effort to fix.

WCAG 2.1 states the following about contrast on a website:

In the list of tools at the bottom of this article, I’ve included a contrast checker you can use to see if you’re having sufficient contrast.

Keyboard input

While this might be the hardest one to implement, from a technical point of view, keyboard input is extremely important for accessibility. Many people with motor disabilities rely on a keyboard.

WCAG 2.1 states the following about keyboard input:

Transcripts for audio

People who are deaf or hard of hearing have difficulty processing auditory information. To support videos and audio on your websites also for those people, transcripts are required.

WCAG

The checklist above included quick wins that are important to improve accessibility on your website. Of course, the list of things that you can do to improve accessibility is almost endless. If you want a full list of things you can do to improve accessibility, I suggest you go to the WCAG 2.1 section on the W3.org website.


Want to Know Where Your Website Stands?

So you want to know where your website stands in terms of accessibility. That’s great! Luckily for you, there are numerous tools available that you can use to evaluate your website.

Here is a list of tools that you could use:

  1. Contrast Checker by WebAIM
  2. Accessibility Developer Tools by Google Accessibility
  3. A11Y Compliance Platform by Bureau of Internet Accessibility
  4. AccessLint, a GitHub app that checks your pull requests for accessibility
  5. WAVE by WebAIM

If you want a bigger list of tools, you should check out the Web Accessibility Evaluation Tools List.

Better Programming

Advice for programmers.

Daan

Written by

Daan

Backend developer from The Netherlands. Crypto enthusiast.

Better Programming

Advice for programmers.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade