The process of making your website mobile responsive is one that involves various optimisations. From making your images mobile responsive to building websites with a ‘mobile first’ approach.
Every area that is focused on mobile optimisation is going to help increase engagement, traffic and ultimately conversions.
In order to increase the speed of your website, there are a range of areas that can be drilled down into such as minifying CSS or using CDNs.
However, one basic process is to ensure that each image that is being uploaded to your Magento website is being compressed to reduce its file size and therefore the load time for the end user.
According to a Google report, “53% of mobile site visits leave a page that takes longer than three seconds to load.”. Not only does this show the priority that should be given to speed, it’s even more important once you see what percentage of your traffic visitors are using mobile devices.
The report continues: “while more than half of overall web traffic comes from mobile, mobile conversion rates are lower than desktop. In short, speed equals revenue.”
With this in mind, every time we think about speed we can consider how to pick off the low hanging fruit. What images could you replace with a lighter image size without dramatically reducing its quality?
In short, there are analysis tools you can use in order to discover the best opportunities available to improve. As you might expect, Google has an analysis tool, which will quickly identify image compression opportunities.
You can use the Google Page Speed Insights:
Other options include Lighthouse, a Google chrome app which is an automated tool for improving the performance, quality, and correctness of your web apps.
The natural step from here is: how can you make these changes? There are different tools and processes you can make in order to improve your image weight. To start off with, here are some suggestions for image optimisation CDNs:
As for the image itself, here are a few image optimisation APIs, although some of these allow for manual upload and automated compression of your images such as TinyPNG or Imagify.
It’s worth keeping in mind users who are on higher resolution screens.
It is a minority of web traffic that uses 4K screens, Retina' and 'HiDPI, but if you have a high resolution screen yourself, then it will help you get a better understanding of how much the image compression will impact the quality of your images.
Magento Open Source and Adobe Commerce also include their own compression algorithm - you need to check the final size and quality of the images with each of the tools to find the optimum solution.
Remember that site performance is only one area that will help improve your site conversion and user experience. As a Magento development agency and Adobe Commerce development agency with a whole team of Magento experts, we at magic42 would be glad to help you identify other areas that will help your site's performance.
We’ve completed speed and ecommerce audit reviews for a range of clients and would love to do the same for you.
Iterative eCommerce Growth
Magento integrations
International eCommerce