Sort your images out

Oct 20, 2020 | Marketing

A good campaign is a fast campaign

When discussing client marketing, website performance is regularly on the agenda. And in the very next breath, page load speed is usually mentioned. The current website has been up for a while and it’s getting sloooooooooowwww.

Slow loading is bad. No-one likes to wait. Studies from Google have shown that if a page takes more than 3 seconds to load over mobile then more than half the visitors won’t wait and will abandon the session.

Losing half your chances of getting conversion is not great

But it gets worse! If a site has poor page load speed, it’s doing the brand damage even before a visitor goes through the pain of waiting for the page to arrive on screen. The problems start long before people even get to your site.

The big G has confirmed that load speed has been a ranking factor since all the way back in 2010. Your slow loading site may not even appear in the search results. This is important when around 9 out of 10 of all searches come via Google. 

Your hard work is going nowhere

The slow loading means that all of that beautiful copy and carefully crafted call to actions are not getting the limelight they deserve. Think about how much of the cake you are losing out on if the majority of searches go elsewhere and then the majority of those who do find you, bail out before they get going. You end up relying on a small slice as your potential customers. We all want more cake.

As part of a wider discussion over campaign performance or the specifics of a set of lead generation metrics, the answer to the question of how to ‘fix’ stuff and improve conversion can be complex. A designer friend of mine (the very talented Mark Jones) recently described it to me as this: 

Think of each page as having a quota. There are going to be some pages which have a lot of tasks to fulfil beyond just looking pretty. How much of the quota for that page do you want to give over to the hero image at the top? 

When it comes to load speed, there’s a quick win here. 

The good news is that now is not a time to give up. In almost every case one culprit rears it head really early on. Fixing that alone can bring real improvement.

Unoptimised images are the enemy of the fast loading page.

It makes sense that this is a common issue. A good web developer or agency will likely do their bit. They get to launch day, the site goes live and all is well. As time goes by it’s the client user who is normally the person who adds and removes images. They do so often unaware of the consequences for page load speed. 

 

The ugly truth

Back in my old, old job I spent a lot of time speaking with professional services businesses about their digital marketing. As part of that, I regularly looked at current website performance and created a report. In the follow up report, the ‘unoptimsed images’ slide was preloaded in the template because it came up every single time.

This is such an easy fix and it can make a massive difference.

Before
After
Before
After

Take the example above which are before and after results. This site wasn’t ‘slow’ but given it was a fairly simple WordPress site, it really shouldn’t be down at nearly 3 seconds to load the homepage. It certainly shouldn’t be running a page size of 11MB. Just think of the pain of trying to download an 11MB attachment while out and about on your phone on 3G or worse. (The mobile performance of this website was horrific).

Just by looking at the images and optimising file size for web and the difference was substantial. 

For the unnamed site above after the two tests were ran further work was done to improve performance, including minimising unnecessary scripts. It got down to under 1 second without having to resort to fancy CDNs and the like. Further improvements are possible but it begins to be a law of diminishing returns.

Are my images guilty?

There are free tools to tell you this straight away. The result above was using Pingdom Speed test and as part of the report it gives an overview of what % is down to images and even waterfall of individual components. (For the unnamed site above images were contributing to over 85% total page size)

If Pingdom isn’t your cup of tea then GT Metrix does similar. Another tool which I’ve recently started getting to grips with is the ‘Lighthouse’ chrome extension and so far so good.

Get the scale right

As a first stop, getting the scale right is important. If an image is 300*250 pixels on screen but the image files is 2000*2000 then you’re asking a lot of the browser. What you are effectively doing is loading many times the size that will actually be rendered and then asking the browser to scale it down to fit. 

A next step is to scale images by device so that mobile browsers are not having to resize desktop images.

Scaling is not the panacea to all ills. There are two potential issues. Firstly, it can lead to quality loss and secondly what if the site already has a tonne of images in the CMS, no-one wants to go through each one and manually sort it out. 

Compression can be your friend

This is where file compression can help. There are plenty of free tools out there to help every step of the way. Probably the hardest bit is navigating through the myriad of options out there.

A useful tool is Pixlr which includes options to resave images for web as png, jpeg etc. Photoshop express is also good go-to for those who don’t have a full Adobe creative cloud subscription. Other quick options include Tinypng and Bulkresizephotos. 

If you have a WordPress site there are plugins that can do the job. This is especially useful if you have an existing site with a lot of images that all need the love. Want to compress 400 images already in your media library? Certainly, step this way and into a world of bulk optimisation.

The two I have used most are reSmush.it and EWWW image optimiser. The former is free, the latter works best with premium credits – it’s only a few dollars for several thousand at time.

 

Will this help? 

As a quick win, yes definitely. It’s just one piece of the page load speed jigsaw puzzle but a really important one.

And the good news is it can be done in probably less time than it took to write this blog.

If you’ve enjoyed this, see more of my thinking over here, stories from the world of BD