How to Make Design Accessible

At designdough, we understand that when designing, accessibility for all doesn’t have to mean sacrificing innovation and activity. 

We work hard to thoughtfully and strategically design with people in mind, no matter their age, abilities, backgrounds or specific needs. This is what design accessibility is all about – a design process in which the needs of people with disabilities are specifically considered.

Design for accessibility isn’t something that’s just ‘nice to have’ – it’s actually a legal requirement. For public sector businesses, this falls under the Public Sector Bodies Accessibility Regulations 2018, and for private sector businesses, this is under the Equality Act 2010. 

Now that we’re finished with legalities, we can get down to the good stuff: why is accessibility actually so important for businesses? 

You’re probably wondering what all the fuss is about – the thing is, you’ve probably used accessibility tools without even realising! For example, universally-used features such as autocomplete text and voice control were created for people with disabilities. It’s okay, we’ve used them too…but at least you now know what they were actually created for.

Getting into the techy side of it, accessible design also does well on the SEO (Search Engine Optimisation) front. It’s easier for search engine robots to interpret the data behind these websites thanks to features such as alt-text, descriptive link text and clear heading structures, resulting in better search rankings and traffic. 

So, what should you do if you want to make sure your design is accessible? This is what we take into account throughout our own work: 

Typography

• Text should always be left-aligned or centre-aligned if working in headings/titles 
• A minimum of 12pt text should be used throughout the design – 14pt is ideal (and 18pt should be used for visually-impaired people)
• Blocks of capital letters should never be used 
• All fonts used should be easy to read and perfectly legible, especially from a short distance. Some things to think about: horizontal proportions, defined letter shapes, open-spacing, stroke weight, large x-height, open counters and distinctive ascenders

Colour

• Ensure at least 70% contrast between text and background colours 
• Avoid tints of the same colour (e.g. light blue on dark blue)
• Use colour thoughtfully with shape and text to denote meaning 
• Avoid stark black text on white backgrounds to diminish glare – pastel/off-white backgrounds are much better

Copy 

• Use plain English and write in short, clear paragraphs or sentences 
• Avoid jargon, slang and idioms

• Use simple grammar and punctuation

Iconography

• When using iconography, ensure icons are commonly used and labelled with text appropriately 
• Use one icon for one meaning – never reuse the same icon for a different purpose 

Layout

• Use a consistent grid to create a design structure 
• Break up large sections of text where possible 
• Use bullet points and tables, alongside simple infographics, to communicate complex ideas 
• Break up large tables of information into simplified tables with clear headings and titles 
• Use page numbers and contents lists for clarity 
• Use colour-coding to assist with navigation 

Imagery 

• Ensure images are clear and bold, and make sure that they accurately depict the written content alongside them 
• Do not use flashing or animated gifs 
• All images depicting additional information should have captions or descriptions
• Do not use patterns or distracting colours over photographs 

A final tip from us…

It’s all well and good to follow our tips, but there would be no point if you didn’t test them! Make sure to consistently  test all designs on a relevant group to ensure that their direct accessibility needs are being met – after all, they know best. Ask for direct advice from individuals with accessibility needs and implement these changes within your design.