How optimising your images can boost your SEO.

The load size of webpages is growing. With the increase of internet speeds, and the introduction of 4K and retina screens, one reason for this is the quantity, and size, of the images being used on them.

And while this is visually improving websites, it isn’t a good thing for load speed and performance. It’s well known that users are likely to leave a site that takes longer than 3 seconds to load, but even before a user gets to your site, they have to find it.

Google has been looking more and more closely at page performance when serving results to users, implementing it’s Web Vitals into search results earlier this year. Looking for a quick speed index, it ranks these sites more favourably than sites of a similar relevance to the user.

Modern Image Formats

Whilst we’re all familiar with the JPG and PNG formats, there are a couple of newer image formats that can serve images of just high quality at much smaller file sizes.

WebP has been around since 2010, created by Google, but has taken time to go fully mainstream as other browsers caught up to support the new format.

AVIF is a newer format, with a higher optimisation level than WebP even, but is still not fully supported by browsers, it shouldn’t be too long before it gets there.

But both of these formats can be used on websites now, by putting fallbacks in place to load a JPG or PNG if the site detects the user is using an older browser that doesn’t support them, and keep the load size of your website down.

Comparison Test

To demonstrate the saving using modern formats can have, we ran a quick comparison of a few images through conversion to 80% quality WebP to compare, a JPEG, a PNG and a PNG with transparency, and the savings in file sizes.

Original -> WebP

JPEG
64kb -> 37kb (43% saving)

PNG
280kb -> 94kb (66.4% saving)

PNG with transparency
901kb -> 126kb (86% saving)

As you can see, a large saving when you consider that most pages have 10 or so images on, optimising these can take your load speed from average to optimal.

In implementing WebP images across the Torpedo site we found an average saving of 70% on image file sizes.

So the importance of optimising your images, to both the SEO and User Experience of you website, should be a high priority, especially with so much of the web viewed via mobile devices, it’s essential to optimise images in order to give your users the best experience possible, the quicker the site loads the quicker they get to your content.

Incorporating Modern Image Formats Into Your Site

Depending on how your site is built and managed, there are various ways to generate images as WebP or AVIF files.

Firstly, to convert your images on your computer so you can place them into your site, you can download the ‘cwebp’ conversion tool, that runs on your computer’s command line and has a range of configuration options and a bulk conversion process.

If you are running a CMS you can make use of one of a number of different plugins that will automate the process for you. When you upload a JPG or PNG, it will convert them to a modern format and output those to the screen should the browser support them, without any edits required to your code.

If you have a slightly different set up, or don’t wish to install a plugin, you can incorporate a similar automated process directly into your site’s code to do the conversion for you.

Or finally, you can find plenty of websites offering online conversion of your images if you upload them directly. Our favourite is Squoosh, as you can see a comparison of the original image to the optimised file. Have a quick test for yourself using one of their default images and compare the quality and size differences you can have.

For more information on WebP and detailed code examples on how to use it in your site, see Google’s WebP documentation,