Structure

Use a hierarchy of headings
For digital use, a designer or developer will tag these as h1, h2, h3 and so on. This helps those who have a visual impairment and use a screen reader to determine the hierarchy of the text.

Make your navigation clear
Consider how you want a person to move through your website or document. Is it obvious? Reduce the number of click-throughs and pages. Too many stages loses the audience’s attention.

Make calls to action unique
Give context to any calls to action, for example ‘find out more about our services’ instead of ‘click here’. Those who use assistive technology will sift through content to get to links. ‘Click here’ tells them very little.

Check the reading order
If there are separate boxes or layers to your document, screen readers may not read them in the visual order you’ve set. For example, if software allows you to ‘send to back’ this is an indication that it can arrange elements on different layers.

Layout

Allow space
Empty space is not wasted space. Space allows the reader to see all elements clearly and take a pause between sections. Provide a clear space around logos, images and boxes.

Consider readability
Add a line space between paragraphs. Reading long sections of text (especially on screen) can be tiring or overwhelming. If it’s a single column of text, reduce the line length and increase the margins. Lines of over 75 characters become increasingly harder to read.

Keep a consistent alignment
Left aligned text is the quickest to read (that is for those who read left-to-right). Centred text is fine for titles but not for body copy. Also, be cautious with hyphenated text. Separated words slow reading. My preference is to avoid hyphenation but there are times to use it.

Summarise with bullets
It’s obvious but four lines of bullets are quicker to read than a whole paragraph.

Typography

Use familiar typefaces with recognisable letterforms
Experts fail to agree whether sans serif type is easier to read than serif. Some dyslexics prefer serifs as the extra decorative lines (or feet) can help them to recognise the individual letters. Choose typefaces where each character is distinct. Certain typefaces, such as Gill Sans can have similar representations for different characters. For example, a capital i looks the same as a lower case l and the number 1.

Limit the number of typefaces
One or two different typefaces is fine (three as an absolute maximum). Handwritten, calligraphic or italised text is harder to read, so use these sparingly. If using two typefaces, ensure they are substantially different from each other.

Use a variety of weights
Another option is to use a single typeface with a variety of weights, such as light, regular, medium, bold or black. Avoid thin and extra light weights as these are often difficult to see and they don’t print well. Also, there’s no need to use bold italic – it’s just ugly and hard to read.

Adjust the type size for your audience
On a website, provide options for changing the type size. On a printed document, a body copy size of 10-12pt is fine for most applications. For an audience that may struggle with regular-sized print, 14pt is the minimum size.

Colour

Not everyone sees colour in the same way
Those with a colour deficiency will see colour differently. Colour blindness affects 1 in 12 men and 1 in 200 women. Colour Oracle can imitate how colours will look for different colour deficiencies.

Check for colour contrast
Don’t use pale text on white backgrounds, or white text on pale backgrounds. These combinations are difficult for many people to read, let alone those who have visual impairments. Regular text (12-14pt) needs a minimum contrast ratio of 4.5:1 and larger or bold text a ratio of at least 3:1. Colour contrast analyzer is an easy tool that can quickly identify contrast ratio.

A pale background helps some readers
An off-white background can lessen glare (on screen) and an off-white or uncoated paper will have a similar effect in print. Those who are autistic or dyslexic often prefer pastel colours as they’re less bright. However, it’s important to still use a sufficiently contrasting colour for text – for example navy or near black.

Don’t rely on colour to differentiate
For example, say ‘select the green Proceed button’ rather than ‘select the green button’.

Images and video

Add text descriptions to imagery
This is known as an ‘alt tag’. It ensures those using screen readers can understand the visual content. Only include descriptions for images that add meaning to the copy. Otherwise, leave without or mark as ‘decorative’. Don’t just describe the image. Make sure your description is relevant. See GOV.UK for more guidance. Also, alt descriptions improve your website’s SEO, enabling search engines to index your images.

Avoid using pictures of text
Type this content where possible or include an alternative description.

Don’t just rely on visual content to relay information
Make sure this content is in the copy or can be accessed as another method.

Annotate your videos with subtitles
This assists those that are deaf or hard-of-hearing to read a text version of the video.

Remove autoplay
Autoplay can be distracting and challenging to people with disabilities. Ensure that a video will only play when clicked.

Provide a transcript
This helps those that are blind and deaf to access the content. Include any non-speech descriptions that are applicable. Also, providing annotations and transcripts for videos is helpful in many other ways. For example, when it’s difficult to have the volume turned up loud, or as an alternative document that can be quickly scanned for information.