Global Accessibility Awareness Day took place a few weeks ago on 16th May, and it got me thinking just how much more inclusive web design has become in recent years.
With so many incredible features and functions available these days for webmasters who love to push the boundaries, it’s never been easier to create a platform that stands out with clashing colours, attention-grabbing videos and dramatic parallax effects.
But many designers – including me! – are preferring to shun these over-the-top technologies and instead focus on creating websites that are clean, easy to use, and above all, accessible to all.
What makes a website ‘inclusive’?
Inclusive web design isn’t just about making sure your platform looks clean and modern. It’s much more than that. It’s about considering the needs of those who have visual, auditory or cognitive disabilities, thinking about the requirements of people who may be less digitally aware (such as the elderly), and catering for users who don’t have access to desktop devices or the high speed internet connections most of us now take for granted.
Here, I’ve listed 5 important things you need to consider when designing and developing a website that can be accessed by everyone, regardless of their impairments or abilities.
1. Design with the user experience in the forefront of your mind
If your visitors find it difficult to interact with your website, they’re much more likely to abandon their journey altogether and take their business elsewhere.
Developing a clear user journey is absolutely key if you want high engagement from everyone who lands on the site. Your design should guide the reader in the direction of the information they’re looking for – and help them find it without clicking through reams of pages. This means keeping your layout clean, simple and free from unnecessary clutter.
Choosing the right typography is also vital. The fonts and the font sizes you use need to ensure the text is easy to read. Avoid scrawling, calligraphic styles and opt for standard web-safe fonts, like Arial, Helvetica and Verdana, instead.
2. Use colour with caution
It’s web design 101, really – but there are still designers out there who like to go a little colour-crazy! When experimenting with your colour palette, consider the needs of those who are visually impaired, as they may struggle to see colour contrasts. Think about those who are colour-blind, too, as they’ll be immune to certain colour combinations.
The number one rule here is to make sure that all text stands out against the background by setting a darker colour against a lighter one (or vice versa). Avoid mixing shades that are too similar in hue and saturation, as they will make the content very difficult to read.
If you’re concerned that your colour selections might be making life difficult for some of your readers, run your ideas through any of the colour contract tools listed here before you commit to them.
3. Use alt text to describe elements on the page
Those who are visually or cognitively disabled will often use screen readers to help them understand the content on a website. Because screen readers are designed to turn written text into audio, these programmes will interpret content differently to humans – so, to ensure your website is completely accessible, you need to make sure that your design is packed full of headings and tags that accurately describe every single element on each page.
It’s important to add alt tags to all of your images, too. This will help screen reader users understand the message you’re trying to convey with the photographs, illustrations and infographics that will inevitably be scattered throughout your site.
4. Make sure your content is easy to understand
Did you know that the average reading age here in the UK is 9 years old? Or that 1.7 adults in England have literacy levels below those expected of an 11-year-old?
To make sure your content can be understood by a wider audience, use plain, simple language wherever possible. Content Design London recommends using short sentences, sticking to one idea per paragraph, and using lots of sub-headings throughout the copy to make it easy to scan.
Oh, and avoid peppering your text with jargon. If you really must use technical terms, explain what they mean at the very top of the page to avoid alienating your users.
5. Use dynamic content sparingly
Screen readers struggle to keep up with content that updates itself dynamically (ie, without the need for a page refresh). They will most likely ignore design elements such as screen overlays and in-page updates, which means your user may not be able to access some of your most valuable content.
My best advice? Steer clear of dynamic content altogether if you know a high percentage of your audience is likely to need extra assistance as they browse the web. If you absolutely must include lightboxes and other dynamic techniques within your design, use Accessible Rich Internet Applications (ARIA) standards to support this functionality for people with disabilities.