Sep 7, 20212 min read

How to make your website accessible: 5 actions

Updated: Oct 22, 2021

Illustration of a computer monitor with different accessibility icons around it, such as visual and hearing impairment.

Although websites are mainly a visual tool, everyone could and should be able to access their content, regardless of any (dis)abilities or impairments. If you have something to show or say on your website, why not share it with EVERYONE? As promoters of diversity and inclusion, we should always give some thought to those who will make use of our content in a way for which it was not primarily intended.

1 Make your website functional even without a mouse

Assistive software makes use of a keyboard to navigate through pages. So it’s important to ensure all the features of your website work without the help of a mouse. You can test your own website, by trying to navigate on it using only the tab key on your keyboard.

2 Structure the hierarchy of your website

Illustration of the hierarchy of headings and paragraphs.

Structuring the hierarchy means using headings correctly. There are different types of headings as well as plain text. Use an H1 header for the main title of your pages, H2 and H3 for other smaller titles, and plain text for the content. That way you optimize the structure of your website, making it easier for users of other software to understand and prioritize content to read.

3 Add ‘alt text’ to all your website pictures

Illustration of the picture icon, with a tag attached to it that says 'ALT TEXT'.

Websites make use of powerful media to increase their attractiveness. Pictures certainly help to make things more appealing, but not everyone has access to them. People with visual impairments or a lack of sight face difficulties when consuming these kinds of media through their screen reader software. That’s where the ‘alt text’ comes in. Alt texts (or alt-tags, or even alt-descriptions) are able to tell users what is in the pictures. Social media like Instagram and Facebook also have alt text options for pictures.

4 Use subtitling, ‘Alt text’, or audio description for your videos

When it comes to video, there are several things to consider. If the video consists of moving images and text or animations, the best solution is to provide an ‘alt text’ to describe what is happening. Although maybe audio description would work even better. For people who can see but not hear, subtitling your video is the way to go.

5 Pay attention to color contrast

Scheme of color contrast. The image is split in half and had two different colors. In the dark background, there is light-colored text, and in the light background, there is dark-colored text.

When designing your website, you want to make everything look attractive and appealing. In doing so it’s important to take account of colour contrast, to ensure that people with visual impairments will not miss out on anything you have to say.

Looking for more?

You can find a guide for keyboard accessibility design online. WebAIM offers a more technical approach to the matter. If you have questions, you can consult your web developer, or look at the guides if you operate with website builders like WIX or Wordpress.
W3C Web Accessibility Initiative (WAI) offers a free online course called Digital Accessibility Foundations. People with either a technical or a non-technical background can take part, and the focus is on different aspects of accessibility, such as coding, designing, writing and advocating.
If you use website builders like Wordpress and WIX you can check for plug-ins or wizards to help you start improving the accessibility of your website. Some features can easily be made accessible. But if it all starts to sound too foreign to you, you can always check with your website developer.