This is a guest post about Co-op Insurance and their website, co-opinsurance.co.uk. The author is Paul Braddock, a user experience designer who works on it.
In the summer, we blogged about how and why we asked AbilityNet to carry out an accessibility audit on the Co-op Insurance website. The post explained the content, design and technical improvements we made off the back of it. To continue our work around better accessibility, the Insurance design team recently did usability testing with visually impaired users.
In this post we share what we learnt from the testing and how we’re making improvements.
What we tested
The Insurance team is responsible for co-opinsurance.co.uk. This includes managing the product information and financial promotions for each type of insurance. Buying journeys begin on our site but once a user chooses ‘Get a quote’, their online journey passes over to a partner’s site.
We can’t necessarily fix the accessibility issues we identify on a partner sites, but we can influence them. We’re actually in the process of creating a set of accessibility guidelines that cover our expectations of our partners.
Catherine Malpass from the Co-op Digital team and Louisa Robinson from Insurance ran the usability sessions. We focussed the testing on the travel section of the website including the buying journey. We wanted to look at how easily visually impaired users could:
- navigate the journey
- understand information – particularly in tables
- interact with a pop up
We kept what we’d learnt from the audit in mind when we were considering what to test.
Positive things that came out of the testing
During the testing, we heard positive feedback about:
- the in-page navigation and clear labelling which helped users read and identify content quickly. One participant said it’s “fairly easy to find your way around and there’s a decent menu I can use to navigate to other insurance products.”
- the colours on the homepage because – along with icons – they help users differentiate between the 2 products. “I like that the colours for car and home insurance are different,” said one participant. “I like having the icons next to the product names because they make it obvious and easier to navigate.”
- the consistency of the page layout. A participant said that “the pages are similar all the way through so you can memorise where things like the next and back button are.”
Areas that need more work
However, the testing also showed us that some features weren’t compatible with screen readers. We noted them along with recommendations for how to improve them.
Things we’ve iterated on already include:
- How a screen reader reads out the prices in tables. We’ve changed the aria labels so that monetary values are read out how we’d naturally say them, for example, “thirty-three pounds eighty-four” instead of “pound symbol three three full stop eight four”. We don’t feel we should be asking people with visual impairments to work harder to use our service and we think that making this change will reduce some of the cognitive load.
- How well we use alternative text (alt text). Testing threw up instances where images were tagged with the type of product or policy they were there to support. We’ve changed them so they fulfil their role of describing the content of the image. This makes the service more inclusive.
- Making images clickable. The screen grab of our travel product page below shows 3 insurance products (multi-trip annual, single trip and backpacker). Each has an image, the name of the product with a link that takes them to a more detailed product page, and a line of copy to help the user decide if it’s suitable for their needs. Testing showed us that when the user zooms in on the page (common for someone who is visually impaired), or if they’re using a screen reader, the link is difficult to navigate to and then difficult to access. There was an expectation that images should be clickable, so we’ve now made each image clickable which makes the information quicker to find.
Things in the backlog we hope to complete before Christmas include:
- How a screen reader reads icons in tables. At the moment it reads “tick” or “cross” but we’ve added aria labels so tick symbols will read as “included”, and crosses as “not included” on our next release.
- Test alternatives to the pop up. We saw the screen reader struggle and the participants become confused with a pop up on the single trip online journey, shown in the screen grab below. We’ll be looking at how we can give users the same information in a more accessible way. For example, we may embed the content at different points in the journey instead.
Things we’re encouraging our third-party partners to look into include:
- The live chat feature. This feature wasn’t compatible with screen readers so thinking about how to improve it or even considering alternative ways to communicate with users instantly is one of our recommendations. At the moment, the feature also covers up content on the page so we recommend looking into how to help the user feel more in control – this might mean giving an option to remove / minimise /block the live chat.
- How we present information. In the testing we saw users become a bit overwhelmed when comparing information. We recommend a review of how we display content when comparing price and cover in insurance tiers.
- The postcode finder. Right now, when a user starts to type in a postcode, the screen reader repeats “there are zero results for this postcode” until the field is complete. This makes it difficult for users to hear – and check – which letter or number they’ve just typed. We recommend looking into how this can be improved.
Carrying on testing, iterating, improving and influencing
Accessibility should be a consideration right from the start when we design products and services. At Co-op Insurance there’s a lot linked to our site that we cannot control but we can influence. We’ll continue to test with people with access needs and we’ll keep trying to improve the experience for everyone so it’s as inclusive as possible.
We’ll also share our research findings, audit feedback and blog posts with our external insurance partners to help raise awareness of the importance of accessibility.
Paul Braddock
UX Designer from Co-op Insurance