What exactly is web accessibility?
Let’s start with the basics. Put simply, accessibility is a subcategory of product usability.
It’s inextricably tied to the way you design your product to make it easy to use for everyone. We usually associate it with people with disabilities, whether permanent (e.g. blindness), temporary (e.g. broken wrist) or situational limitations (e.g. caring for your newborn). But it’s so much more than that.
Approaching accessibility from the point of view of visual impairment, or even disability at all, is too restrictive a definition. Instead, we must get to grips with the way everyone accesses — and often doesn’t access — our websites. This usability approach will help us make better design decisions and produce websites that are easy to use for everyone.
In other words, accessible websites are just better.
Yet, accessibility as a website concept has too often been low down on the list of priorities for businesses. It’s often an add-on, too time consuming or too expensive to really tackle properly.
There’s also a tendency in all design processes to produce stuff that fits with our own cognitive comfort zones, partly because that works for us, partly because it’s so difficult to see our websites through someone else’s eyes. If you’ve never experienced, or even met, anyone who has difficulties using the web, it’s likely that you simply won’t be able to imagine how it is to use our sites differently.
But there are plenty of reasons why we should be thinking about making our websites accessible. It is the right thing to do to remove the barriers that can exclude some users — particularly when it’s those very users who are more likely to depend on our websites and the services they deliver.
Plus there are sound business reasons behind making websites accessible. According to Government’s Family Resources Survey (FRS 2017) 22% (13.9 million) of people said they had a disability. It’s a significant number to potentially exclude from a business’ customer base.
Finally, there are compelling legal reasons why your website should be accessible.
Like many countries around the world, the UK requires businesses to make reasonable adjustments in the way they provide services. This might be introducing disabled toilets or providing step-free access — but in a growing number of countries, it also includes providing accessible websites.
Public sector websites in the US, UK and EU are already required to be accessible by law. Private sector companies will soon follow. In the EU, they have until 2025 to make their websites accessible. Similar rules already apply in Canada (AODA).
With more people and more businesses moving online, the trend for legalising accessibility requirements is only going in one direction.
The way we use websites
To start to put usability into practice, it’s worth unpacking the concept, and looking at the four main characteristics that determine how people access (or don’t access) websites. There are four main categories of impairments that can create barriers when accessing web content.
Vision
To use a website, we need to be able to see it.
But seeing is subjective, and not everyone (perhaps no one) is seeing what we’re seeing. And this quickly causes problems throughout the design: in the layout, the structure, the content, the typefaces, the font size, the colour palette… the list goes on. The design language we use all the time doesn’t make sense if our users can’t see it properly.
When it comes to impairments in vision, the list runs from full to partial blindness to problems with glare, blurring caused by cataracts, colour blindness, or even not being able to see any colour at all — among many others.
Many of these issues are more widespread than we think. According to colourblindawareness.org, 1 in 10 men suffer from some form of colour blindness in the UK, about 4.5% of the population.
You can read more on https://webaim.org/articles/visual/
Here are some examples of how a website would look like to some people with above vision difficulties:
Top tips on designing for users with visual impairments:
Top tips on designing for screen reader users:
Motor
The second thing we do with a website after looking at it is interact with it. It’s also the thing that people struggle to do the most.
Certainly there are people with lifelong motor impairments, from spinal injury, severe arthritis or cerebral palsy among many others. But motor problems go far beyond that narrow concept, reaching into the lives of most website users at some point.
Consider these scenarios: an elderly person struggling to position the mouse pointer accurately enough to click a button; a mother trying to use a computer while holding onto their baby, perhaps while breastfeeding; a builder trying to read the internet high up on a scaffold. The list of circumstances in which people could struggle to interact with our websites is long and needs careful consideration in design.
You can read more on https://webaim.org/articles/motor/
Top tips on designing for users with physical or motor disabilities:
Audio
According to the Government Digital Service, 11 million people in the UK are deaf or hard of hearing. That absolutely lays to rest the idea that accessibility is a niche issue. And when it comes to designing website audio, we need to consider a wide range of problems: people with hearing impairments, either full or partial, to people whose first language isn’t English, and users who just don’t have the sound turned on.
You can read more at https://webaim.org/articles/auditory/
Top tips on designing for users who are deaf or hard or hearing:
Cognitive
Cognitive disabilities are the least understood and least discussed type of disability among web designers and web developers.
Types of cognitive disabilities include learning difficulties, memory problems, attention deficit (ADHD and other), and visual / linguistic comprehension problems such as dyslexia. According to WebAim it is estimated that 15–20% of the population has some type of text or language comprehension difficulty, so it’s a vital consideration in any design.
You can read more at https://webaim.org/articles/cognitive/
Top tips on designing for users on the autistic spectrum:
Top tips on designing for users with dyslexia:
You can also access information pictured on posters above as a text version at https://ukhomeoffice.github.io/accessibility-posters/
Accessibility personas
The Government Digital Service (GDS) has done some great research on different accessibility needs and has developed the concept of accessibility personas.
Using the guidance and tools provided by the GDS, we have set up six personas and tried to simulate their accessibility issues. It’s worth noting that these are only simulations; it’s impossible to understand what it’s really like for people with accessibility issues. But these simulations give a sense of the different ways people use and experience our websites.
Claire
56, civil servant, partially sighted.
Claire uses a screen magnifier and changes colours to increase contrast.
Here’s how a popular news page could look to Claire.
Malcolm
76, retired, he suffers from multiple conditions: arthritis, hearing loss, and cataracts.
Malcolm does not know how to use any form of assistive technology. Here’s how the website might look to Malcolm. We’ve also simulated how difficult it might be for Malcolm to focus the pointer on the small navigation elements.
Anna
29, PhD student, blind.
Anna uses a screen reader and keyboard to navigate pages. This is a simulation of navigating hands-free by tabbing through the page while a screen reader reads out the content.
Anton
35, social worker, a British Sign Language user, English is his second language; he always has video captions switched on.
Here’s how a website in English might appear to Anton before he’s had a chance to work through a translation. We used pig latin so you can have a go at deciphering the text with this pseudo language rules. It’ll give you a sense of how long it can take to translate a website.
Judith
35, office worker, suffers from hyperactivity disorder and PTSD.
Judith adjusts things like colours to make them less distracting. But she still finds it difficult to focus her attention on the website. Here’s a simulation of how that might feel.
Julie
43, office worker, dyslexic.
Julie tints her screen yellow to minimise distractions, but still struggles to read websites easily. Here’s how a website might feel to Julie.
Where do we go from here?
The case for making websites accessible is clear. It makes financial sense, it’s the right thing to do and, increasingly, it’s the law. But once we accept that our websites need to be accessible, how do we put it into practice? That’s where the next part of the article comes in: building accessible web experiences.
This story was written, researched and edited in collaboration with Geraint Fisher.
