Website accessibility

1.
Introduction

2.
Creating an accessible website

3.
The influence of modern technology on accessibility

4.
Further reading & FAQs

People who have a medical condition or disability don’t always have the same online experience as someone who doesn’t.

But what can be done to help people in this position? And what sanctions are currently in place to ensure everyone is included? Let’s get a better understanding of website accessibility as a whole.

What is website accessibility and why do you need it?

Website accessibility is the practice of creating a web page which can be used by anyone, regardless of their ability or condition.

Accessibility ensures a person will be able to perceive, navigate and even contribute to the web. There are a number of disabilities which fall into the bracket of needing website accessibility assistance. Some of the most prevalent include:

Auditory
These are issues with hearing audio footage. This is a particular problem on websites which primarily use video content.

Cognitive
This is when someone has a mental condition which prevents them from fully understanding what they’re reading.

Visual
Having a visual impairment makes it incredibly tough to use the internet. After all, the majority of content is created with the able-sighted in mind.

Neurological
These are diseases caused by the brain which result in you having limited control over your nervous system. Parkinson’s is arguably the most notable example of this.

Speech
The inability to properly communicate could cause problems in an age where voice commands are becoming increasingly popular.

Aside from these demographics, website accessibility can also benefit people who haven’t got a disability.

This includes:

Elderly internet users
This demographic are characteristically unfamiliar with using modern technology. They might need things simplified in order to get the most out of a website.

Temporarily disabled users
Not every disability is for life. A broken arm for instance would seriously impact your ability to scroll the internet. Even having a cold can affect our cognitive abilities.

Restricted internet users
Someone who has limited internet connectivity, due to a lack of bandwidth, might need things made as accessible as possible in order to accommodate for a lack of functionality.

Why do we need website accessibility?

The UN defines access to the web as a basic human right for someone with a disability.

Being able to use the internet allows a person to have better access to:

• Educational resources
• Chances of employment
• Communication channels with the government
• Other people in their community with a disability

While 78% of disabled adults currently get access to the web on a regular basis, there’s still nearly a quarter who don’t.

It’s particularly important for people living in rural areas or developing countries to have a connection with other people in a similar situation to themselves.

Web content accessibility guidelines

Web content accessibility guidelines (WCAG) have gone through several iterations since their inception in 2008. The latest version is WCAG 2.1, which built on all the elements of past versions, with the addition of focus on mobile.

Rather than focusing on technologies, WCAG emphasises the need for principles to be at the forefront of design. This was done in order to ensure all disabilities were catered for. The four core principles are:

• Perceivable
• Operable
• Understandable
• Robust

Each of these were broken down further, with a series of boxes under each section that need to be ticked.

Perceivable

This section focuses on a user being able to recognise what’s in front of them. Features which fall under this bracket include:

• Providing alternative text for non-text content where appropriate
• Transcripts and captions for any audio or visual material
• Easily readable and navigable content
• Use of proper markup for all content
• Text colours which show up against any background
• Ensuring every feature can be used when text size gets increased to 200%
• Making sure your page is responsive to the users needs (for example with page orientation and font size)
• Ensuring your page works with assistive technologies

Operable

This means the user should be able to find and use your content, regardless of their access method (anything from keyboard to voice command). Operable features are things like:

• Making sure everything works fully, regardless of the platform through which the website is being accessed
• Creating content which can be played, paused and stopped at any moment
• Not using flashing content (or allowing the user to disable it if there is any)
• Using descriptive titles and page frames
• Making it easy for users to navigate content
• Making it obvious where content is going to carry a user to when they click on a link
• Using meaningful, relevant and clear labels which match what’s being said in your content
• Use “Active Focus” technology to highlight what they’re looking at
• Only use dynamic interactions when they necessary (and allow people to turn these off)
• Make it easy for users to disable and change shortcut keys

Understandable

The name says it all here. The content on your website must be easy for everyone to understand. That means:

• Use clear and easy-to-understand language
• Don’t use phrases or words people won’t understand
• Explain all abbreviations which are commonly used (such as UK, EU etc.)
• Use consistent and easy-to-predict language behavioural patterns
• Make it simple for people to correct an error in a form

Robust

This means your content should be readable by a wide variety of user agents (such as outdated browsers and assistive technologies). This includes:

• Using HTML so agents are able to accurately interrupt content
• Making sure coding tells assistive technologies what every interface component is for
• Status messages and model dialogs are marked up in a way that makes it easy for users to understand what they mean

These core principles are key when creating an accessible-friendly site. Failure to do so can result in a hefty fine, with reports from Get ADA Accessible suggesting:

• Fines of up to $55,000 for the first noted violation
• A further $110,000 for each subsequent violation
• Sponsored funding can also be withdrawn if a site is non-compliant

We’ve already looked at the types of disabilities which website accessibility takes into account. Let’s now explore how each of these is catered for.

Auditory

If someone struggles with hearing problems, they’ll be unable to properly interact with video content. They might also struggle with voice-activated content if they were born deaf.

Solutions for people who experience auditory problems include things like:

• Captions and transcripts added to media content
• Adjustable text size and colour if the original isn’t readable
• Sign language options to supplement any text which is difficult to read

Cognitive

Cognitive issues refer to problems someone might face as a result of a neurological disorder. The primary problem here is often an inability to understand or comprehend what it says on a page.

These kinds of issues can be remedied via the use of:

• Web layout which is as simple to understand and follow as possible
• The simplification of any complex sentences. You can assess this by checking your Fleisch-Kincaid readability score
• Images and bullet points to help break up long periods of text
• The option to turn off flicking or flashing animations
• Web designs which can be quickly adapted to the user’s requirements

Speech

While voice command is currently not a prominent feature of websites, it’s continually growing as a concept. Recent stats showed as many as 23% of smartphone owners used voice command at least once a day. People with speech disabilities are unable to accurately communicate on sites where this is a requirement.

This can be fixed by:

• Ensuring there’s always an option to type information
• Making sure a phone number isn’t the only way for someone to get in contact with a company

Visual

Colour blindness and vision loss or impairment are the most common examples of these kinds of conditions. Shockingly, colour blindness can affect 1 in 12 men on a global scale. It could also be that someone experiences heightened sensitivity to bright colours.

Visually impaired users can be catered to by:

• Adding text alternatives for every image which appears on a page
• Audio-description for any video which appears on the page
• Overly complicated navigational functions removed
• Ensuring background colours and foreground text have an appropriate colour contrast to make sure they are readable

Whatever the accessibility need, a website owner needs to plan ahead and ensure everyone will be able to use the page with little to no assistance.

Why accessibility is good for a business

Accessibility is good for business. Don’t believe us? There are several ways heightening accessibility on your site will benefit a company, whether they be commercial, educational or even governmental.

Driving innovation

By adopting an accessible-friendly approach on your site, you could be taking the first steps towards changing the future of website use.

Innovative designs like the typewriter, voice-to-text technology and even the telephone were all created with disabled users in mind, and the same is true of most online advancements.

By introducing an approach which keeps accessibility in mind, a business can increase their overall UX (user experience) for visitors as a whole. By adapting to the needs of disabled users, a business can improve the experience for everyone who lands on their site.

Enhancing your brand

By showing a clear commitment to your disabled customers, a business will demonstrate corporate social responsibility (CSR). An increased level of CSR will improve both brand image and reputation.

Good examples of companies who’ve done this include the likes of Barclays and Microsoft. Both of these giant organisations assessed their company structure and approach from top to bottom.

Barclays in particular have gone the extra mile, creating a video series which highlights their commitment to accessibility – whether that be online, or when you’re in the bank itself.

Extending your market reach

By failing to make your website accessible to disabled users, you’ll be reducing the potential customer base you could be hitting.

The current estimate shows the disability market could be worth as much as £5.7 trillion. And while that figure won’t be attainable in its entirety, there’s definitely a market which can be tapped into, regardless of your industry.

It’s not just disabled users you’ll be targeting, either. You’ll also be able to appease the demographics we mentioned earlier, who might be struggling with your user interface.

Minimising legal risk

Protect against being put on the legal chopping block by running a forward-thinking website. This kind of pre-emptive action has been crucial since the internet became prevalent.

The first such example came as far back as 2000, when a lawsuit was filed against the Sydney Olympics website, after a blind plaintiff complained about an inability to be able to properly use the official site.

The importance of ensuring you accommodate the needs of users with a disability is perhaps no better demonstrated than by the latest stats. The current rate of lawsuits being filed against websites which fail to do has risen to as many as 40 per week.

Increase diversity in the workplace

By optimising your own equipment for accessible use, you’ll provide new opportunities for those with an impairment to work for your company.

7.6 million people of working age (16-64) in the United Kingdom were reported to have a disability between January and March of 2019. That accounted for 18% of the entire demographic.

Of this number, just 3.9 million were employed. While this is a 150,000 increase on the same figures from 2018, it still speaks volumes about the need to make workplaces more accessible.

All top enterprises cater for the needs of users with accessibility requirements. Your business can profit by following suit.

What to know before you start

Taking your first steps into the world of website accessibility can be tough. Where do you start, and how? Take our advice and follow this set of guidelines.

Research
Don’t approach any situation without doing thorough research first. This applies to all walks of life, but is especially important with the looming threat of penalties and fines hanging over your head. Find out what mistakes people often make. Reading up on accessibility as a whole will help.

Have people tell you what they need
Get people with different types of needs to come in and explicitly tell you what they want to see included on the site. This will either back up your research or highlight something new you need to consider.

Accessibility checklist
Creating a checklist is useful for ensuring you include everything you should. Examples would be features like:

• Descriptive link text
• Manageable colour schemes
• Viable interactive options for every type of disability

The easiest way to create your list is by going through the guidelines we looked at earlier and making sure you’re not missing anything. You can also turn to online tools like Accessibility Insights to find and fix an issue before they can ever become a problem for your customers.

Accessibility mistakes to avoid

Not taking accessibility into account
First and foremost, think about the needs of disabled users. You could even look for volunteers to come in and talk to you about the common issues they face as disabled web users. A major mistake people make is assuming what is or isn’t accessible-friendly themselves.

Poor HTML coding
This is important in the creation of any website, as it helps a search engine to understand what your page is actually showing. There’s a lot that goes into correctly marking up a website, so be sure to follow an SEO-friendly guide on the subject.

Overuse / improper usage of ARIA tags
Aria tags can be used in your HTML markup to help guide certain assistive technologies, most commonly screen readers. More often than not, having correct, semantic markup will be all that you need. Adding aria tags when they are not required can often be detrimental to a websites accessibility. More information on this can be found at webaim.org

A confusing colour scheme
Colour should never be used as the sole conveyor of information, as it can be hard or even impossible for someone who’s colourblind to understand what they’re reading. Also make sure a screen doesn’t flash (or “blink”) between two different colours, as this can also be a challenge to read.

Overuse of CSS (cascading style sheets)
These are what a website uses to portray information to its users. Disabled visitors often make the decision to create their own style sheet, which allows them to process any information they’re reading online more quickly. Make sure no critical information is presented in your CSS file, as these will be overridden by the disabled user’s style sheet.

Bad descriptive link text
Rather than having links which say things like “read more”, make sure it’s clear what a person is clicking on. This can be particularly useful for people with cognitive conditions, who are unable to process what “more” might refer to. For example, you could put “Read more about this product”.

Too much dynamic content
This refers to content which can be accessed interactively. While this can sometimes be popular, it runs the risk of trapping a person in a page overlay if they’re using screen-reading technology. Sometimes these devices don’t communicate properly with technologies such as Javascript.

Testing accessibility in each production stage

All websites should ideally go through a range of testing stages. This is crucial at all points of the journey:

1. Discovery

This refers to your research stage. As we’ve seen, it’s at this point you should ideally be looking to educate yourself as best as possible on the subject of accessibility. That means stuff like:

• What accessibility actually means to your users
• Fully comprehending all the different types of disabilities a user might have
• Tapping into resources and reading profiles of users who have disabilities. This will give you precise case studies to learn from

Educating yourself as best as possible will give you the best chance of ensuring you have less to clean up in the next two stages.

How to test:

You won’t have a website at this point. But you can still compare your proposed plans with the WCAG, or case studies. You could even ask people with disabilities to come in and look over your plans.

2. Alpha

At the Alpha stage, you should reach a point where you have a site that’s close to being fully functional. This is where the WCAG design principles we mentioned earlier need to have been accounted for.

How to test:

With something users can actually navigate, it could be time to bring in people for a research session. This is a great firsthand way of seeing if you’ve missed anything.

3. Beta

During the beta stage of website creation you should be on the verge of sending it live. It’s at this point you should pay for an accessibility audit.

This takes a reasonable amount of time to organise, so in reality you should start thinking about getting it booked in while your page is still in alpha stage.

How to test:

Get your site audited. This isn’t cheap. It can sometimes cost in the region of £3,000 - £7,000, but it is worth doing. Having a professional check your site can prevent any costly mistakes slipping through the cracks.

Improving live pages’ accessibility

Once a page is live it’s risky to assume you’re all set. There are a number of occasions where you’ll need to re-assess how accessible your site is:

New features
Whenever you add anything new to your website, you’ll need to pre-emptively assess how it’s going to impact users with accessibility requirements. Ideally, this should be done in the testing stage, rather than after they’ve been put live.

Change of server
If you’re migrating your site or changing the server you’re on, you’ll need to make sure everything continues to operate properly. With something this extreme, it might be worth carrying out another audit.

User testing
Sporadic user testing is helpful, regardless of whether you’re introducing something new or not. Having people come in every six months or so to make sure the site is still accessibility-friendly can help you avoid any potential punishments down the line.

Accessible technologies in schools and higher learning

School is an integral time in anyone’s life. It can be damaging for a child to be left behind because they’re unable to keep up with the demands of education. No disability should prevent learning.

Electronic worksheets
These are designed to help people who have issues with spelling and reading. They help to line up words on a screen, and can even use text-to-speech technology to help those who struggle with the writing side of their learning condition.

Phonetic spelling software
Again focusing on dyslexia, this specialist software has the capability of understanding what the word a child intended to write was, and then automatically correct it. We’ve all used autocorrect on our phones, but this software makes changes not via familiar patterns, rather phonetic relevance.

Variable speed recorders
Some students struggle to follow the pace at which a teacher or lecturer speaks. This device works by recording them, and allowing the student to play it back at a later date, at the speed of their choosing. It even allows you to change the pitch if that helps you.

Talking calculators
Dyscalculia isn’t a condition many are familiar with. It affects your ability to read and comprehend numbers, making it much harder to do maths. The calculators read out the numbers for you, making it easier to understand.

Accessible technologies in the workplace

It’s not just at school where people need assistance. It’s not uncommon for people in the workplace to make the most of assistive technology. Here are some examples of where this kind of tech can be a great help.

Screen joysticks
Rather than a mouse or touchpad, these joysticks (shaped similarly to the gaming devices of the same name) could be controlled by almost any part of the body. That includes hands, but also feet and even a person’s chin.

Screen magnifiers
Visual impairment and some forms of learning difficulties naturally lead to an inability to properly read what’s on a screen. Making text larger by magnifying it is an easy way of tackling the problem. There are many software patches and forms of hardware which can help make the text on a page much larger.

Touch screens
While these have become the norm for smartphone users, touch screens aren’t always a common sight in the workplace. Having PCs or laptops which operate with touch control can make it easier to navigate online throughout the working day.

Speech recognition programs
This is another handy shortcut for those who have trouble spelling or are missing limbs. They work by transcribing what a person is saying straight onto an online document.

Refreshable braille displays
This mechanical device effectively serves as a “keyboard for the visually impaired”. It uses software to read what’s written on a screen before communicating this to a blind user via pins on a hardware device. This allows someone with poor vision to work normally at a desk, regardless of their disability.

The quality of general life in the home has also improved thanks to accessible technology. Some of the names at the forefront of this advancement are:

Lightware
This near-futuristic tech has the ability to steady someone’s body while eating. This is particularly useful if they’re a regular sufferer of seizures or have a nerve-related condition like Parkinson’s disease. The tech itself is cutlery, which adapts to the sudden movements of the holder and steadies their hands by up to 70%.

Roomba
You may remember this gadget from your days at school. While back then it was nothing more than a nifty way to show off the potential of the future, it’s now transformed into a dedicated cleaning tool. Just set the circular device off and it’ll traverse the room, picking up dust and dirt along the way. Needless to say, this is incredibly handy for those who can’t physically clean their home themselves.

Alexa, Google and other AI
Tools like this are commonplace in most houses, but they have an under appreciated impact on the disabled community. Operating primarily via voice command, these robotic helpers can set reminders, help you contact friends and family, do your shopping for you or even just set the atmosphere by playing music. They’re a timesaver for everyone, but especially those with a medical condition.

Useful links

Ability Net point users towards several useful accessible-friendly sites and forms of media

abilitynet.org.uk

The Government discuss new accessibility requirements for public sector bodies

gov.uk

Medium look at the impact accessibility has and will continue to have on AI

medium.com

The NHS website demonstrates a great use of accessible-friendly features

nhs.uk

Nomensa provide an easy-to-understand guide to what web accessibility is in all its guises

nomensa.com

W3C discuss the required standards for accessible website designs as a whole

w3.org