Accessible Images

A small retail business wanted to make some general improvements to their website and were keen to include more accessible content.

The Project

The business had noticed a decrease in visitors to their site and were no longer ranking as high in Google searches as they had been. They were hoping to make updates that would improve their Google ranking and give visitors to the site a better user experience.

The Action

The business wanted to focus on small changes that could make an immediate impact so they requested one area that they could prioritise. I advised them to improve their images as a Lighthouse audit was flagging up Largest Contentful Paint (LCP) and Cumulative Layout Shift (CLS) issues, two things that Google penalises sites for. LCP records the length of time it takes for the largest image, text block or video to load on a page when a user navigates to it. Layout shift is when something loads unexpectedly on the page and shifts other content on the page, cumulative layout shift measures the amount of layout shifts that happen on during the whole page load. Slow loading and layout shifts can both negatively impact user experience either by making the user wait to access content or causing them to accidentally interact with the wrong thing when it suddenly shifts to accommodate new content suddenly loading.

Both LCP and CLS can make sites difficult to use, particularly for people with certain learning disabilities or who rely on assistive aids that may not work as intended when shifts and late loading occur.

The site had multiple images without alt text and several which were much larger than necessary that were causing both CLS and LCP. By reducing the image sizes, the CLS and LCP were resolved to within acceptable standards. I advised the business on what types of images require alt text and why it was important to add, not only because screen readers rely on it to describe images to blind and low vision users, but also because it can load in place of images that fail to load, meaning the context will be retained for all users.

I provided examples and resources on how to write concise, but descriptive, alt text so that all users could understand visual content.

The Outcome

The business saw an increase in visitor traffic to the site again and were once again showing up in searches for retail businesses in their area. Additionally, they gained a better understanding of the importance of accessibility and began to look into other ways they could improve the user experience of their site.