“The power of web is in its universality. Access by everyone regardless of disability is an essential aspect.” – Tim Berners-Lee
Volcanic’s Head of Design, Shanma Ahmed, shares her top tips for achieving accessible website design:
Add enough colour contrast
Achieving the right colour contrast is vital to ensuring your candidates with visual impairments can read the content on your website. The measure of contrast is displayed as a ratio, a measure of difference in perceived brightness between two colours. This ratio can range from 1:1 (white on white) to 21:1 (black on white). You can find out the requirements for the minimum contrast ratio here.
There are a number of online tools that can help you asses whether your website meets the WCAG guidelines for colour contrast. See below:
-WebAIM
-Contrast MacOS app
-Site Improve
-Colour contrast checker Google Chrome Extension (We’ve tried this one on the Aspire website, created and powered by Volcanic)
Don’t use colour alone to make critical information understandable
If you use colour as a way of distinguishing content, candidates who are blind, partially blind or are colour blind will be unable to recognise your content. You should either use patterns, meaningful semantics or formatting along with colour to highlight critical information, such as hyperlinked text. If you’ve ever used Trello for task management, you may have noticed their accessibility mode, which when switched on displays patterns alongside their colour-coded labels.
Use labels or instructions with form fields and inputs
Forms are a critical part of your recruitment website, they are the literal gateway for your candidates to gain access to your services. Aside from candidate registrations, you may use forms for client enquiries or digital downloads. Your forms must be as easy to use and accessible as possible for everyone. This is a key element when considering web design for recruiters. Including instructions help users understand how to complete your forms, and labels not only ensure that your users know where to enter specific information, but it also helps users who may be using speech input or screen readers to navigate your content.
Support keyboard navigation
Many website users with motor disabilities as well as blind users often rely on a keyboard to navigate through content. Motor disabilities can range from mild tremors to no use of hands and there are a range of modified keyboards available to cater for the needs of these users. Supporting keyboard navigation allows your candidates to use the tab key to move through the interactive elements of your website such as links, forms, buttons etc and then continue to engage with each element using their keyboard.
Design usable focus states
Focus states, also known as focus indicators, provide visual indicators to let your website users know that a specific interactive element, such as a form field, is the current focus of the page. Most web browsers provide this automatically and it often appears as a change in outline colour on the form field, but you may want to go a step further and apply a stronger colour contrast, perhaps adding a background colour to the field as well.
Write useful alt text for your images and non-text content
Alt text ensures that your candidates with visual impairments can understand the non-text content on your website. A screen-reader can easily read out your text content, but without a written description, it won’t be able to tell your visitor the detail of your images. Moz provides a great guide to alt text which you can check out here.
Use the correct semantic markups on your content
Semantic markup essentially involves using HTML to add meaning to your content so that non-humans can read it. If you’re not familiar with HTML, don’t worry, your website provider can take care of this for you. But it’s important to understand that using the correct semantic markups does more than just help Google and bots crawl your content. Some candidates may use assistive technologies that read your site in the same way that Google does.
Download our eBook‘ Creating an Inclusive Candidate Experience on your Recruitment Website: Your Guide to Breaking Down the Barriers to your Candidate Attraction’ for actionable tips on how to make your website more inclusive, accessible and personalised to your candidates.
