Creating user-centred accessible websites
Building equitable digital products starts with accessibility, usability and inclusion. We thought we’d explain what it means to have an accessible website, why it matters and what guidelines you should follow, in case you haven’t already.
According to the latest estimates, around 15% of the world’s population have some form of disability, which represents a massive underserved customer group in most industries. In the UK, 1 in 5 people have a disability – this could be visual, hearing, motor (affecting fine movement) or cognitive (affecting memory and thinking).
Accessibility is a series of activities aimed at creating equitable digital products, focusing in particular on people with disabilities, the elderly and those affected by many other limitations.
Web accessibility protects your website against demographic changes and opens your business to everyone with an internet connection.
Historically, people with disabilities have had a hard time interacting with technology. Limiting access to technology based on disabilities creates discrimination and inequality of opportunity. Making the internet a more accessible and equitable place will benefit everybody.
Having an accessible website enables more users to have positive experiences with your brand and could potentially convert them into brand advocates, increasing your brand awareness through word-of-mouth. Read more about it here.
Globally, people with disabilities represent one of the most neglected segments of the consumer population, forming the largest “minority” in terms of spending power. In the UK, people with disabilities and their households have significant spending power, accounting for the disposable income of approximately £274 billion, which continues to increase. Read more about it here.
Accessible websites have increased conversion rates because they are more usable to a larger percentage of their user base.
Search engines will rank your website higher. Both Assistive technologies and search engines rely on machine-readable content, thus having an accessible website provides a natural boost to your SEO endeavours.
Web Content Accessibility Guidelines (or WCAG) were developed by the World Wide Web Consortium and represents an internationally accepted standard for web accessibility of sites and applications. From its release in 2008, the WCAG 2.0 principles and guidelines have been consistent and since then have only had additional “success criteria” implemented via the latest version WCAG 2.1.0
Given the rapidly changing technological landscape, companies should try and adhere to the latest version of the guidelines to offer an inclusive experience to all of their users.
WCAG 2.0 has 12 guidelines that are organised under 4 principles:
Content and user interface components must be presented so that users can perceive and should not be imperceptible to all of their senses. One of the most common colour vision deficiencies is difficulty distinguishing between red, yellow, and green shades. This is referred to as “red-green” colour vision deficiency. It’s a common problem that affects around 1 in 12 men and 1 in 200 women. This is why according to Success Criterion 1.4.1 “colour shouldn’t be the only means of conveying information, indicating an action, prompting a response, or distinguishing a visual element”.
An example of a colour contrast guideline from WCAG 2.1 is Success Criterion 1.4.3, which states that “the visual presentation of text and images of text has a contrast ratio of at least 4.5:1.”
Navigation and User interface components must be operable by the users and should not require interaction that users cannot perform. For example Success Criterion 2.1.1 states that “all functionality of the content is operable through a keyboard interface without requiring specific timings for individual keystrokes” to always offer users a fallback by using.
Information and the operation of the user interface must be understandable. This means that users must be able to understand the information and the operation of the user interface. The Level A Success Criterion 3.1.1 encourages companies to offer multi-language support for their products so that “The default human language of each Web page can be programmatically determined.”
Content must be robust enough to be interpreted reliably by various user agents such as assistive technologies. One such criterion (Success Criterion 4.1.3) refers to status messages and the manner in which they are presented to the user through assistive technologies.
Each Guideline has several success criteria associated with it, and these are grouped under three importance levels.
Text size and colour contrast guidelines example
Success criteria in level “A” are critical; failure to meet these criteria will limit access to your content for some users. An example of this would be Success Criterion 2.5.4 Motion Actuation which states that functionality that can be operated by motion can also be operated by user interface components.
Success criteria in level “AA” are highly important; some users might have severe difficulties accessing your content if these haven’t been met. An example of level AA criteria is Success Criterion 1.4.4 Resize text, which states that users should be able to resize the text without assistive technology up to 200 per cent without loss of content or functionality, except for captions and images of text.
Success criteria in level “AAA” are useful, but only target a small portion of users. Depending on your user base, you would select only the most relevant as these are typically treated as nice-to-haves. For example, Success Criterion 2.4.8 Location, which encourages websites to provide information about the location (the typical mechanism being breadcrumbs), is a very useful feature but only critical to a portion of the user base.
You can read more about the WCAG guidelines here.
To meet government accessibility requirements, digital services must:
More and more people will be gaining access to the internet in the following years and as your user base becomes more diverse, you’ll want to make your website more inclusive and accessible. Meeting accessibility goals feels like a big responsibility and, at times, overwhelming, given the number of guidelines and user needs you need to take into account. Luckily, the WCAG and trailblazing organisations like the a11y Initiative are fighting to make them as clear and easy to implement as possible.
We at Den Creative strive to make the experiences we create as inclusive as we can.
If you’d like to read more about our approach to accessibility and how that impacts the way we design websites, apps, wireframes, prototypes or anything else, please get in touch. We’d love to hear from you.