An accessibility audit for the Co-op Insurance website

This is a guest post about co-opinsurance.co.uk – a product developed by a team within Co-op Insurance. The author is Paul Braddock, an interaction designer who works on it.

There are a lot of reasons for checking and improving how accessible co-opinsurance.co.uk is. In the crudest terms, it makes good business sense: the more people who don’t find it frustrating to use, the more potential customers we have. 

But the purpose of accessible design is far more than making a sale. 

AbilityNet estimate there are 19.1 million people in the UK who may have physical, cognitive, visual or hearing impairments that could affect how they interact with the world online. Equality is one of Co-op’s values and it states all members should have the opportunity to be involved. Being inclusive is part of what we do at Co-op and it’s what we strive for in our design.

With this in mind we commissioned a technical accessibility audit of the site. This post is about the recommendations made, how we’re tackling them and the effect we hope setting a standard will have on our partners.

Defining the scope

Our data analyst Nick Jones looked at the site’s traffic and identified the most common user journeys we see on co-opinsurance.co.uk He also pulled out our most frequently used page templates so that if one of those wasn’t accessible, fixing it would mean we could fix a lot relatively quickly.  

We worked on 10 sample website pages with AbilityNet who would be checking to see if the pages comply with the W3C Web Content Accessibility Guidelines version 2.0 (WCAG 2.0). To get the most value from the audit testing was carried out using JAWS for desktop and Talkback for Android, across all major browsers including Chrome, IE11 and Firefox.

Issues identified

Across the 10 pages, AbilityNet found 18 issues which would affect people who use assistive technology to navigate our website. They estimate 3.8 million people in the UK use assistive technology such as screen readers. They also identified issues that would impact 2.3 million people in the UK who may have difficulty seeing the screen. 

Of the 18 issues, they deemed 3 to be ‘high priority’ because aria labels were not in place so screen readers would not read out:

  1. Icons in tables.
  2. Dropdown options in our live chat feature.
  3. Our sticky ‘Live chat’ button.  

Here’s an example of a table we use on the site. 

insurance-travel-tableThe ticks and crosses are the icons that weren’t announced to users. For example, the ticks and crosses in the table shows that platinum multi-trip insurance includes cruise cover but bronze, silver and gold don’t. However, a screen reader would have announced, “platinum blank column 5”. Not only are the icons not compatible with screen readers, we hadn’t made the information available elsewhere on the page. 

Here’s a screenshot of issue 2: live chat dropdown options.

insurance-yd-chat-dropdown

The live chat window has a drop down so that users can indicate what they’d like help with. But screen readers don’t announce it, so users are at risk of not knowing what the options are. This would have a major impact on our users who are dependent on using live chat as a preferred method of contact.

And below is how the sticky live chat button looks (issue 3).

insurance-car-chat

With our live chat feature, neither the label or the fact it is a button is announced by a screen reader. Which means that screen reader users may not know that the button and method of contact exists.

How we’re fixing them

AbilityNet also gave recommendations on how to fix the issues they identified. Our content, design and developer teams are now in the process of fixing the 18 issues that were identified and taking what we learnt from the audit and applying the fixes across the whole of co-opinsurance.co.uk 

The content team were able to fix their issues straight away, as only minor tweaks to aria labels where required for certain products. James Martin has development fixes in progress and these changes will form part of a future code release. We’ve also been speaking with the external team who built our live chat and to make sure the problems that were identified are prioritised for their future releases.

Hoping to influence good behaviour

The audit was just for co-opinsurance.co.uk – that’s what we own and manage. However, our ‘quote and buy’ journeys are owned and managed by our underwriting partners so once a user clicks ‘get a quote’, their online journey passes over to a partner’s site.

Just like the issues that were identified with our live chat, we can’t necessarily fix them but we can influence them. We are therefore in the process of creating a ‘standard’, similar to a set of guidelines, that would cover our expectations and best practices when it comes to accessibility for our partners. This could eventually be fed into our Design system if we believe it brings value to other areas of the Co-op.

We recognise that inclusive design is a process so we are taking additional steps in our ways of working to make sure that we don’t exclude people when they come to our website:

  • by including accessibility checks in our quality assurance process when publishing new content or doing development improvements
  • using open source tools such as Accessibility Insights and Lighthouse to check co-opinsurance.co.uk on a quarterly basis
  • recruiting Co-op members with accessibility issues for our user research – if you would like to get involved email: gidigital@co-opinsurance.co.uk

Paul Braddock
Designer from Co-op Insurance

Improving accessibility in Co-op wills

Everyone needs a will and everyone deserves to fully understand such an important document. That’s why making a digital service accessible to everyone matters.

download

A good service is one that everyone can use regardless of access need or the type of technology they use. Making things accessible isn’t just about catering for those who are blind, Deaf or hard of hearing. Service teams should consider things like cognitive impairments and motor impairments too. Thinking about colour contrast and writing in plain English also make services more accessible – it’s all about breaking down barriers.

Right from the beginning of the wills alpha, this is what we’ve been doing with wills.coop.co.uk

Accessibility is everyone’s responsibility

I think accessibility issues can be overlooked by digital service teams. It’s not because they don’t care, it’s more that sometimes they’re not aware of different accessibility needs. When I started working on this project I made it my business to flag these issues from the start. Soon afterwards, the rest of the digital wills team began considering access needs automatically.

To help people on the wider team (our subject matter experts from Co-op Legal Services) understand the importance of designing in an accessible way, we invited them to user research sessions so they could see how people with accessibility needs use the service.

We started with clear content

Wills are traditionally written using complex language that many people find hard to understand. Lots of will-related terms are unfriendly, sometimes unfathomable – for example a grandchild is referred to as an ‘issue’.

Terms like this make the service restrictive for everyone, not just for people with certain cognitive conditions, and those with low literacy (16% of adults in England are ‘functionally illiterate’ which means they wouldn’t pass an English GCSE).

So, every time we use a will-specific term, we explain it in plain English. We cut the jargon and replaced it with clear, simple language so people can understand the decisions they were making more easily, and without having to involve a solicitor.

By making things understandable, we’re making them accessible. Our content designer Jo Schofield explains how we designed the wills content so it would lessen the effort needed to read and understand it in her post Making a will can be daunting. We’re trying to change that.

Totally on form

We thought about and tested how we could reduce the cognitive load throughout the user journey. The idea was to break down the content so that users got the information they needed, when they needed it.

We used ‘nesting’ to reduce the amount of information on the page when the user first reaches it. When the user chooses an option, we ask for any other details at that point rather than having all the questions on the page at once.

Screenshot from the current wills service showing an example of the 'nesting' described in the copy.

We’ve tested extensively with screen readers and had a number of people test with their own devices and assistive technology. We’ve found that nesting makes things less overwhelming. Here’s an example of an earlier iteration of the same page that didn’t test as well.

Screenshot of an earlier iteration of the service. Instead of 'nesting', the user sees all the questions at the same time including details about options that aren't relevant to them.

The new form elements will be included in the Co-op Design Manual and used across the Co-op businesses.

Test. Iterate. Test again

The only way to know if we were improving the service for people with accessibility needs was to test it with them.

Testing needn’t be expensive. We tested the service with people at the Co-op by asking them if we could watch them use the service on our iPad. We also put a call out for testers in the internal newsletter and got lots of responses including one from a colleague with a visual impairment.

We also tested with people from a wide range of backgrounds in a user testing lab. We asked them to bring their own personal devices to test the app to help us understand how it can be used with VoiceOver (Apple’s screenreading software) and a high contrast colour scheme on an iPad, as well as quite possibly the oldest Android tablet I’ve ever come across. We have a device library at Co-op but nothing compares to the insight you get when you see your service working on the actual devices people use everyday.

Testing the service with a cross section of people on all sorts of devices (including their own personal setups) made us both aware of accessibility restrictions and helped us solve them.

We also asked accessibility specialist Léonie Watson to test our service. She gave us some excellent feedback and of course some small changes to make – none of us are experts.

#winning (almost)

If we’d had more time we know there’s more we could have done to improve accessibility even further. At the moment, anyone who’d like a Co-op will has to speak to a will writer on the phone. This is a legal requirement to make sure people are alone when they write their will but this interaction is obviously problematic for anyone who is Deaf or hard of hearing.

The Co-op Digital team will soon hand over the service to the Co-op Legal Services team so their wills writers can use it. However, we think that we’ve documented the service well enough so that this issue could be picked up again in the future. We have ideas about how it could be fixed, including by using video to verify identity.

Becky Arrowsmith
Software engineer