When developing a website, one of the things you take note of is the user interface and the user experience—UI/UX as it is more commonly called—of your website. You put in a considerable amount of effort into making sure that the site is user-friendly and easy to use.
But, we often do not take people with disabilities into consideration. For your website to be truly accessible, everyone should be able to use it, including people with disabilities.
Importance of Web Accessibility
The task of improving the accessibility of your website may be difficult as it requires extra effort; however, there are immense benefits that come with it.
One of the easiest ways to do business with people with disabilities is through an accessible website. For example, people who have a hard time reading print media, or people who cannot shop on their own can do all this easily on an accessible website. This, of course, means more profit for your business.
In some cases, some of the things you would do to make your website accessible would also help with optimizing your site for search engines(SEO).
There are specific actions that you need to take to make your site more accessible. These actions are contained in the Web Content Accessibility Guidelines. The WCAG was developed by the World Wide Web Consortium or W3C. The W3C is an international community that helps develop web standards for better experiences.
Evaluating the Accessibility of Your Website
So how do you determine if your site is accessible to those with disabilities? There are a couple of ways this can be achieved. To properly access your website for accessibility, you need a combination of online tools and manual inspection of your website for accessibility lapses.
In this section, you’ll learn about some things you need to check when evaluating your website.
Check your website for:
- Problems with Color Vision Impairment
- Problems with General Vision Impairment
- Images on Your Website for “Alt” Texts
- The Availability of Video Captions
Problems with Color Vision Impairment
Colorblind people have problems distinguishing between certain colors. A significant percentage of people are affected by one form of color blindness or the other; therefore, it is essential to make sure that this set of people do not have problems navigating your website.
There are three primary forms of color blindness. They are:
- Protanopia/Deuteranopia: The inability to distinguish between green and red.
- Tritanopia: The inability to distinguish between blue and yellow.
- Achromatopsia: The affected person suffers from grayscale sight, so they only see things as black, white or shades of gray.
Of course, making your site accessible to one with Achromatopsia might be impossible, but you should at least make it easy for those with the green and red or the blue and yellow variant of color blindness to navigate your site.
There’s a tool that helps with this called Toptal Color Blindness Filter. It allows you to view your website just as a color-blind individual might see it. There are four options available; Protanopia, Deuteranopia, Tritanopia, and Achromatopsia.
For the best result, you should test your page for each of them. This enables you to see which of your page element’s might be hard to see by individuals with each of the different forms of color blindness. You can then fix problems you encounter by increasing the contrast of the specific element, which means you pick a color with more contrast.
Problems with General Vision Impairment
Asides color vision impairment, there are other eye defects that would prevent a user from being able to use your website. Cataract, which causes a person’s vision to be cloudy, making it harder to see objects is one example, Shortsightedness which causes objects far away to look blurry is another example.
You should make sure you optimize your site for this category of people. There is a Chrome extension called NoCoffee that helps with this. Just like with Toptal above, it has filters that enable you to see your website like any of those mentioned above would.
After installing the Chrome extension, you click on the icon. You would be presented with a dropdown list displaying the options you have.
To fix accessibility problems you discover by doing this, you can do either of two things:
- Increase the contrast of the inaccessible element.
- Increase the font size.
One thing to take note of is to avoid compromising your website design while trying to optimize your website.
Images on Your Website for “Alt” Texts
“Alt” texts are HTML attributes added to an HTML tag usually an image tag. These texts aren’t visible by default and only shows when you have a poor internet connection, and the image is yet to load.
Screen readers also make use of these attributes to provide more information to its users. Every image should have an ‘alt’ text to make it easy for screen readers to know what the images are. Blind people make use of screen readers to navigate websites. Your website would be more accessible to them if you include this in your images as well. It also helps the search engines understand what an image is.
To determine if the images on your website have alt texts, you can make use of a tool called WAVE Web Accessibility Tool which allows you to among other things check for alt texts in images. When you visit the website, there is a field where you can paste the link to the website you want to evaluate. There is a browser extension available, but it doesn’t work as well as the site.
Aside from ensuring that your images have alt texts, you should make sure the texts you provide are relevant and descriptive enough, but not too descriptive. If an image has no functional purpose on the website, you do not have to add an alt text to it.
The Availability of Video Captions
Asides people with visual impairments, there are others with hearing impairments. Such people might find it challenging to listen to an audio file or a video on a website. To ensure that they can also benefit from your content, you should create captions or transcripts of your videos that they can read.
Of course, creating video captions, especially for long videos, is no easy task. But there are tools that help with generating these captions for you. YouTube also has a feature that auto-generates captions for your videos. Although these auto-generation tools are sometimes inaccurate, so you would have to be careful with them.
The steps mentioned above are just a few of the various actions to be taken to make your site accessible. For a full list of things to do, you should check out the WCAG created by the W3C. You can also find a list of the various tools you can use to evaluate your site for accessibility.