The 3 W's of Web Accessibility

Go to next section

The 3 W's of Web Accessibility

Susana Gonzalez Ruiz said: “designing for the extremes meets the needs for the many.” At Signal we believe that considering the needs of all users helps us to push the boundaries of design and development - and come up with great ideas. 

That’s just one reason why we wanted to make an effort to acknowledge Global Accessibility Awareness Day (GAAD) in May. Also known as inclusive design, accessibility means that a product can be used by people of all abilities and disabilities, and it’s a topic that can often be overlooked or disregarded. We want to help improve this, and that was another reason for holding our own Awareness Day activity - after all, change begins at home (well, office). 

Global Accessibility Awareness Day

We held a lunch and learn in our Edinburgh office - supplementing a presentation and workshop with pizza and cider, and encouraging as many of our Signal colleagues to attend as possible. We even opened up the doors to our sister agencies Leith and Stripe - sharing is caring, after all! 

To build awareness of what the day is about and why it was important to us to hold our lunch and learn, we created a quiz beforehand and sent it to every department. It’s common for accessibility to be considered by Front End teams as they develop an end product for different devices and use cases, but it’s actually really key for everybody at every stage of the project to be aware of the most important points. 

Questions included: “have you ever navigated around a website only using a keyboard?” and “have you ever switched off images on a website or email to test if it still makes sense?” among others, and we’re planning to resend it in the future to compare results and hold ourselves accountable for our progress.

That's because we’ve realised that we shouldn’t just be talking about this on one day of the year, and that's why we’ve set up an accessibility committee, with at least one representative from each department. We’re also working to improve communication by setting up an accessibility group email and slack channel that are open to anyone to ask questions and share articles.

While we were working on this blog post, we had the idea that a useful resource would be a short, visual guide to the basics of web accessibility - something shareable (you can download it here), that would condense the key points for anyone new to the topic. 

Accessibility - a legal and a moral requirement

The legal side of accessibility is absolutely something that everyone should be aware of. In the UK, and many other countries, there is a legal requirement for you to make your service is accessible to everyone who needs it, and if it isn’t, you may be in breach of the Equality Act 2010

To meet government accessibility requirements, you must meet level AA of the Web Content Accessibility Guidelines (WCAG 2.0) as a minimum. In the US, companies have been successfully sued under the similar ADA, and this is something that’s very likely to become more prevalent over here. 

However, we don’t believe that the legal obligations should be the driving force behind improving accessibility. Did you know that 12.9 million people in the UK alone have a disability? That’s without even mentioning our longer life expectancy, resulting in an aging population and more users who have a different user experience as a result of their age. 

As the world becomes more and more reliant on technology, these people become more and more at risk of being excluded from society in some way. That’s a problem that we should all want to fix - if we’re making a product available for the public to use, then we have a moral obligation to make it accessible for everyone who could potentially want or need to use it.

Not sure exactly what could affect a user’s ability to access a website? We’ve put together some examples of the types of disability and how quickly an non-inclusive site design can alienate those affected:

Auditory & Speech

If you don’t have a contact form or email address on your site a customer with hearing or speech difficulties is likely to struggle with needing to contact you by phone. 

Cognitive

You may have used an inaccessible font-family on your site because you only considered how it looks - someone with a cognitive impairment like dyslexia might quickly give up on trying to read it. 

Neurological

You might have opted to display certain important information on your site via rollover, but have you considered that a customer with Parkinson’s Disease may have shaking hands and struggle to keep a mouse steady?

Physical 

It’s possible that you may have included a link or button on your site that cannot be seen - someone who is paralysed may use speech-recognition tools, and they rely on actionable items being visible on the screen so that they can be verbally “clicked”.

Visual

Lots of sites include text links in the main copy and often they’re ‘made obvious’ by being a different colour font. This sounds okay, until you think about the fact that anyone with colour blindness will struggle with calls to action that are visually conveyed through colour alone. 

Beyond the workshop.

Here at Signal we strive to go above and beyond. We use emotional intelligence to analyse as many user situations as possible, and communication plays a big part in this. Before any projects are started all departments are involved in the planning - a design never gets signed off until a developer can confirm it can be built, for example. We want to get to the point where accessibility is just as thoroughly built into the process. 

Next up, we're researching automated tools for quality assurance testing. We use tools in our development process to alert us if we’ve forgotten coding standards at any point, which helps to eliminate human error, and we want to add a check for accessibility standards in our coding.

Outside of our HQ we have plans to deliver our presentation and workshop to the wider community, with CodeBar, CodeClan, Women Who Code and Girl Geek Scotland all expressing an interest.

Any small step that can be taken to improve accessibility is a step in the right direction. Interested in sharing our presentation within your own business? Get in touch and we can help you out.

Useful resources:

Guide for adding captions and transcripts to videos can be found on YouTube.

The Hemingway Editor can give you an idea of the reading level someone would have to have to understand your copy.

You can use the Google Chrome extension Funkify and set it to ‘Trembling Trevor’ to simulate what it would be like to use your site with a trembling hand and constant mouse movement.

You can use a speech recognition tool to ensure that everything necessary on your website can be verbally clicked.

Test your content’s colour contrast using a contrast checker tool to ensure your designs are accessible.

Published on:

Related Articles