A zoomed in image of a computer keyboard
A zoomed in image of a computer keyboard

Making Text Accessible For All Users

Megan Evans
Nov 5 · 4 min read

For visually impaired, dyslexic or autistic users, accessing text online can be difficult.

For some it’s as simple as making the font size bigger, but other impaired users may rely on a screen reader to help them browse.

There are two ways in which a screen reader can be used. It can read text aloud to a user or it can be used alongside an external brail translation device. Either way, these amazing pieces of tech are making life so much easier for lots of people — something which any modern business should factor in to their online presence.

However, we need to do more, there are lots of websites that aren’t optimised for screen readers or users with disabilities in general, but there are plenty of simple solutions!

Here a few easy ways to make your site more accessible:

1. Optimising buttons and graphics

We all love customising our buttons to catch a user’s attention, a fun ‘Check this out’ can be intriguing, but a button which reads ‘Go to the store’ would be far more useful for text readers.

If you have a button or graphic on your site which doesn’t have text, ARIA tags can be used in your code to provide a description for text readers instead.

2. Add alt text to images

Not only is this an SEO (Search Engine Optimisation) best practice, alt text allows screen readers to describe images to users.

If alt text is used in the code of a site by all images, then you can give a good description of what the picture is e.g. ‘A small brown dog playing with a bone’. This allows a visually impaired user to build up an idea of what the image is and interact with your brand in a meaningful way.

3. Organising your website

Using shortcut keys is an easy way to navigate a website, but to do this the site needs ordered headings.

For example, each page should only contain a single H1 (the big page title at the top.) H2s and H3s (smaller section titles further down the page) should help to break up complex information further down the page.

However, these headers should always follow a logical order — H3s are only ever needed if you break down the content in an H2.

A company selling different types of cakes may structure their content as follows:

H1: Welcome to our website

H2: What cake are you looking for?

H3: Wedding cakes

H3: Birthday cakes

H3: Other cakes

Here, the options are broken down clearly and presented in a logical way — this not only improves the organic SEO ranking of a page, but it fully optimises the text for dyslexic and autistic users, who may otherwise become overwhelmed.

4. Don’t auto play videos and sounds

While this may be quite a snazzy feature to make your content stand out, it can also be very distressing for autistic users who are sensitive to sound.

Also, for those using a screen reader, it will continue to read over the audio or video that is playing, which would be a confusing and distressing experience.

5. Big font, simple colours

Having the option to enlarge text on your site is really useful, many users will want to zoom in on text without distorting the proportions of the entire site. So enlarging the text alone is a good solution, as well as using a nice clear font (no fancy scribbles!).

As for colours, avoid using white text and stick with dark text on light coloured backgrounds. However, black against white can be difficult for dyslexic and autistic users to read, off white backgrounds make things easier to read. Whilst many of these users will have a screen overlay it’s always good to consider.

6. Seeing your true colours

Some users may struggle to recognise certain colours and so they should not be used alone to convey a message. For example, red is often used to imply when something is incorrect, a colour-blind user may not see this and so symbols are also required to help reinforce meaning.

It’s a good idea to always label graphs and icons to distinguish elements rather than relying on colours alone — this helps visually impaired users too.

The use of colours should be kept minimal- (don’t go mad!) Using lots of bright colours could be very confusing for colour blind users.

Simple, right?

These small changes will invite more people to your site, people who know they can comfortably guide themselves around and see all you have to offer!