Users want to find the information they are searching for fast.
According to the studies carried out by Google, if a page loads more than 3 seconds, the user is most likely to give it up and move on to the next website in the search results.
The study showed some sad statistics: 70% of the websites tested loaded the above the fold content longer than 5 seconds on mobile devices.
At times, images weighed as much as 16 Mb!
The results are more or less similar across the industries, with the slowers websites in Travel and Technology sector.
In the same report, Google suggests the most obvious way to make the website load faster – optimise and compress images, which can save from 250Kb to 1Mb of the page size.
Taking into account the image-heavy design trend that appeared a few years ago (and is likely to stay), keeping the page loading time low has been a number one priority for website owners.
Why Image Optimization Is Important
Designers and illustrators aren’t the only ones using a lot of graphic in their portfolio.
Online stores, travel and hospitality websites focus on images and tend to make them big so the customer can see all the tiny details.
While visually-driven design brings huge advantages and impacts conversion rates, you should be careful and make sure your web page is not only beautiful but lightweight.
Otherwise, the users who wait too long will simply leave your site without even looking at your crafted content.
The sad truth:
- Almost half of your visitors expect your site to load under 2 seconds.
- More than half of visitors say the page speed is essential to their loyalty.
- About 45% of customers are likely to share their negative online experience.
With Amazon and other retail giants getting more powerful and omnipresent every day, it’s vital to keep up with competitors.
And it’s not only your brand that should run faster.
Today, there are lots of tools that can help you excel your website performance: CDN, cloud hosting, and advanced caching.
However, before you go and shell out on third-party services, we recommend checking what can be improved on site. And let me assure you – it’s not rocket science at all:
- minimise HTTP requests;
- optimise images.
If you decide to skip these steps and upgrade your server instead, you might end up wasting a lot of money which you could invest into something else, like marketing or a new feature.
How Google Handles Images
Here’s what the Google image optimisation checklist recommends:
- Use vector images as they don’t depend on scale and resolution.
- Choose optimal quality settings.
- Get rid of unrelated image data like camera information or geo-data.
- Resize images if they are too big.
- Use automated tools for image optimisation.
Image Optimization Tools for WordPress – overview and comparison
We talk about WordPress because one-third of all websites on the Internet run on WordPress.
The problem of image optimisation is not new, and the WordPress community already has plugins that help optimise graphic content. But are they as good as they advertise?
The test subject in our case is Wais Studio. It’s a neat, modern website we’ve recently built and it’s packed with graphics and imagery to showcase the designer’s work – just what we need for our testing.
To speed up testing, we only used one page that showcases a project with lots of images:
It’s responsive to all possible and impossible devices; for every picture, we created a respective image with proper resolution and repeated it for retina displays, too. Thus, there are up 55 image sizes for every original image.
A headache? Not really, if you use Just Responsive Images.
But let’s get back to image optimisation.
Then we ran the site through Google Page Speed Insights to see what Google would suggest doing (though it was quite obvious). Below are the results and suggestions for desktop and mobile, respectively.
Google told us that we need to reduce images by 5.9 Mb on desktop and by 2.8 Mb on mobile. Ok, Google – let’s get busy.
1. WP Smush
This is one of the most popular WordPress plugins for image compression and optimisation, and the story tells it was once owned by Yahoo.
Smush is available in two variants – a free WP Smush and a paid one, WP Smush Pro (30 days free, then $49/month).
The plugin carries out the actual optimisation on an external server and promises to optimise all the images in your WordPress.
On WordPress, it has more than 3,200 five-star reviews and over 1 million active installations.
WP Smush – we’re jealous!
On the other hand, there are negative reviews and complaints as well.
There we go – we installed a PRO version of the plugin hoping it would work miracles. But no miracle happened.
Here’s a shot from the WP admin where you can see that the first image (cut into 55 sizes) was optimised by just 2.0%. This is somewhat sad.
Now let’s see what the almighty Google will say.
Wait, if the optimisation score is just 2%, does it make sense to test it further?
An attempt to optimise the second image didn’t go through. Perhaps, there are just too many resized images to process, and the request failed.
But 3K+ positive reviews… I couldn’t help but wonder.
Adam Preiser of WP Crafter doesn’t have good reviews on it either.
Anyway, we have another candidate to try.
EWWW Image Optimizer has more than 600,000 active installations and almost 300 happy customers with positive reviews. And around 50 customers who said it didn’t work as expected.
We pulled up our sleeves and got to work installing EWWW on our graphics rich website.
Here’s a WP admin shot with the results of optimisation. The numbers are a bit higher than with WP Smush, but still quite low – 3% to 5% of reduction.
The Pingdom test confirmed that images still comprise 93.8% of the page size (we started with 93.9% as you remember).
Not a big difference at all.
Google Page Speed Insights pointed out that we should take care of our images: on this specific page, they were 5.6 Mb and 2.5 Mb as compared to the original 5.9 Mb and 2.8 Mb.
Unfortunately, these are not the results we had initially expected from such a plugin. No offense to the developers, but it could have performed better.
We’re left with one more competitor we shortlisted.
I really like the name 🙂
The plugin is free but only until you reach 100 Mb, which is a matter of several minutes if your website has good quality photography.
Over 100 Mb, the pricing depends on the size of images to optimise per month.
Kraken works on their servers and has a sophisticated image optimisation API.
It’s a service that operates its own admin backend which connects to your WP installation.
There is a free Web Interface and ability to drag a ZIP archive with all your images into it.
Let’s go, Kraken!
Below you see image optimisation stats – well, we’re impressed.
65% of size reduction deserves hats off, and the only drawback is that it’s not a free solution.
Pingdom confirms the stats Kraken gave us.
The page has become almost 3.7 Mb lighter.
Google Page Speed Insights still suggests to compress a few images, but other than that – the plugin totally did its job.
Mobile results are perfect!
We were quite delighted with Kraken and this is a good option for your image optimisation.
Now it’s our turn.
We developed this plugin because we wanted to have a solution that actually worked and which we could use on the websites we build for our clients.
Then we thought – why not share with the community.
We cannot boast thousands of installations and reviews yet, but I’m sure we’ll get there.
JIO is the best image optimisation plugin, and we say so not only because it’s our creation.
It saved us 71.28% with the same image where WP Smush it only saved 2%.
Pingdom reported the images take up 78.2% which is slightly better than with Kraken.
PageSpeed Insights tell us we did a good job with image optimisation – there are no images left to optimise, as you can see on the screenshots below:
It’s expected that in this article we praise the module we created – and hell we do.
On the other hand, we see that Kraken.io performed great as well and there’s no need to tell you that you should consider using it.
Just Image Optimizer scored the best results with both Pingdom and Google PageSpeed Test, and if you decide to try it we promise that you won’t be disappointed. And hey, it’s free!
All in all, our test can’t be the ultimate truth because we carried it out with a small number of websites, but it does show some insights.
Let’s also give it to WP Smush and EWWW as they work much better with PNG images because they use open source libraries that optimise images of such format really well. However, it’s not the same story with JPG graphics – our tests show almost no change in image size.
Feel free to share your thoughts with us in the comments and don’t hesitate to contact us if there’s anything you’d like to ask. Cheers 🙂