High-resolution images look great, but they're also larger in terms of MB, which results in longer site page load times. If your site has even one large (MB) image, it will slow down your site in ways you can't imagine. In that waiting, you will lose visits without even realizing it.
There are even more ways to get around this problem by keeping the quality of the images and reducing their size by so-called compression.
Why is image optimization so important?
Simply, the bigger the images, the longer the page loads. Of course there are many reasons why your page may load slowly, but large images are the most common problem.
The slower the loading of the site, the more visitors will leave the site before loading, i.e. they will give up at the start. Users these days are very impatient when it comes to loading websites. If the user has to wait longer than 2 seconds for the site to load, the probability that he will leave the site is 50%.
Slow page loading also affects the ranking of the site itself on Google. Google has been using site loading speed as a ranking factor for several years now.
Images with a size of 200 KB are ok for the site itself, that is an upper limit, but images from over 500 kb to a couple of megabytes are simply unacceptable when it comes to websites.
TinyPNG
This tool allows you to optimize both PNG and JPEG images. Simply upload your images to https://tinypng.com/ and the tool will automatically compress them.
It allows up to 20 images to be optimized simultaneously with a maximum image size of 5MB each. After optimization, it is possible to download each image separately or download all images at once.
If you are a WordPress user, there is also a plugin https://wordpress.org/plugins/tiny-compress-images/ that enables this automatically with every uploaded image.
How much does TinyPNG actually improve loading:
- Loading before optimization: 0.789 seconds (1.7MB)
- Loading after optimization: 0.294 seconds (635KB)
So one simple image helped the page load even 62% better than before. Imagine if you had more pictures on one page, how much it would mean.
Optimizilla
Like the previous tool, this one supports PNG and JPEG files and can optimize multiple images at once. On the home page (http://optimizilla.com/) you simply upload images and then download them as you wish.
This tool allows you to view the original image as well as the optimized version side by side to compare the difference.
Let's see the results of how the test went with the default settings:
- Loading before optimization: 0.789 seconds (1.7MB)
- Loading after optimization: 0.418 seconds (902KB)
That's roughly around 46% compression and upload speed. Not as good as the first tool but if you play around with the settings a bit you'll be surprised how much it can make a difference.
Conclusion
Image optimization, as you can see, does not require a lot of work and will greatly affect the loading speed itself. This is one of the initial mistakes when it comes to creating a website. Image optimization is essential, and it helps with both loading speed and ranking, and prevents you from losing customers.
