While everyone so desperately tries to make their way up to the top of SERP and improve Magento SEO they pay little or no attention to one of the main things page speed could be improved with - Image Optimization.
If you test your website speed, you will notice that images take a lot of your website loading time.
So, in order to get more traffic, you need to take care of plenty of things including images.
Many websites use outdated unoptimized images which definitely are not contributing to the website speed improvement since they take some time to load. It's been said that if the page takes longer than 3 seconds to load the majority of people are going to leave.
In case you really want to attract more customers with a fast-performing website you need to optimize your images.
We've prepared the top 3 tips for Magento 2 Image Optimization.
Tip 1 - WebP Images
PNG and JPG image formats are outdated and big in size. It makes them load longer and slow down your website performance correspondingly. Fortunately, Google developed the WebP — next-generation file format generally accepted by the majority of browsers.
Check this complete guide to learn more about the WebP images in Magento 2, their difference with PNG and JPG formats, benefits and reasons to use them in your store.
For your website image optimization, you can choose the Magento 2 WebP Images extension that helps you to automatically convert all current and future images on your website into WebP format.
This Magento image optimization extension allows you to reduce the size of images up to 50% and save their quality at the same time. It's really hard to spot the difference.
⇓
If you were attentive enough reading this you are probably wondering what will happen if someone enters your Magento 2 website from the old browser that doesn't support new WebP format.
It's taken care of since this Magento 2 image optimization extension doesn't replace your PNG and JPG images with the WEBP ones. It just makes their copy. So, people from those browsers that haven't yet integrated with WebP will see your original images in PNG and JPG formats.
Pro Tip: Why would you need the Magento 2 WebP Images extension if you could just convert your images into WebP with some online converter and upload them to your website?
The thing is not all browsers support WebP (which you have probably understood by now). If you upload already converted images people coming from "non-webp" browsers will see broken images. This image optimization tool helps you to not only satisfy all of your customers with the fast-performing website but show all of them high-quality pictures regardless of the browser.
Tip 2 - Manual Image Optimization
It's probably the easiest and the most common way to optimize images on your website. Optimizilla - is a completely free online image optimizer that helps you reduce the size of your images to the minimum possible size.
All you need to do is to upload up to 20 images and wait a few seconds for the image optimizer to compress them. Then you will be able to download each image separately or the whole package of images.
What Optimizilla also allows you to do is to regulate the colors and compare the quality of the original and compressed images.
We strongly recommend you to compress your images with Optimizilla before uploading them to WYSIWYG editor to reduce the page size and loading time as much as possible.
Tip 3 - Images Lazy Load
Your website performance should improve significantly once you try the Magento 2 image optimization tool mentioned above. However, there is one more way for you to ensure the fast webpage loading — lazy loading.
When someone enters a page with a lot of pictures they all usually start to load at once. That is why the loading is slowed down a bit. You can use the Magento 2 Image Lazy Load extension with the help of which images will be loaded when scrolling down.
Image Lazy Load module is fully compatible with Magento 2 WebP Images extension. So, except for reducing your image size, you can improve your website performance loading images gradually.
To sum up, Magento 2 image optimization is actually one of the first things you need to start optimizing your website speed with. No matter how awesome your products are or what stunning content you create. People aren't going to find out about it if your website takes a lot of time to load.
It wouldn't be right to say that images are the only reason for your website to load longer than it should. Image optimization is a necessity for those Magento 2 stores that want to be on top.
However, it is only one of many steps you need to take to speed up Magento 2. Check them out too to make your store lightning-fast.
