HOW TO COMPRESS IMAGES ON YOUR SHOPIFY STORE WITHOUT LOSING QUALITY
Make your website stand out and load faster
USE HIGH-QUALITY IMAGES TO STAND OUT
Every Shopify store is really a media company. This is why you want to stand out with high-quality images to convey all the value of your products.
Conversely, high-quality images with large file sizes will cause slow-loading and poor user experience for your customers. If the quality of your images is not to your liking and if your page is not loading properly, taking control of the compression or media optimization of your website will help facilitate your brand’s growth.
Follow this guide, where you can determine the most effective way to optimize your Shopify store’s images for speed, while improving the visual quality. The image in this section shows how Hyperion Tiles displays their inventory.
SHOULD YOU USE LOSSLESS OR LOSSY COMPRESSION?
The problem with lossless compression is that it traditionally makes much larger files than lossy compression. Lossy compression degrades the quality of the image to make it smaller in file size and load faster. Since loading speed is so vital to retaining and converting visitors, most of the internet’s websites use lossy compression that sacrifices visual quality for speed.
HOW TO OPTIMIZE LOSSY AND LOSSLESS COMPRESSION MANUALLY
There are two ways to easily compress your images on Shopify. You can do it automatically with an app extension like crushpics, or choose an Enterprise-level compression tool. Our service, SpeedSize™, can outperform its best Enterprise-level competitor by a wide margin. However, as of now, it is a true enterprise solution only for brands with over 50,000 monthly visitors. If your website does not have a lot of traffic and images, it may make sense to compress manually with a compression tool like tinypng or Google Squoosh.
With tinypng, the images will be compressed with a single preset for PNG, JPEG and WebP files. The upside of tinypng is that it compresses the size of your files substantially with very little effort. All you have to do is drag and drop your images. The downside is that beyond being lossy, sometimes the compression is very noticeable.
You can Squoosh your images in next-gen formats. This is why for manual lossy compression, we recommend Google Squoosh, where you can choose the file size reduction to a level where you are comfortable with and reformat to the newest image formats AVIF and WEBP, which will significantly reduce your image size even with lossless compression. You can also resize your Shopify images here, so your media is not stretched or condensed to fit Shopify’s square image parameters.
AUTOMATE COMPRESSION AT SCALE
For sites with thousands to millions of images this compression and resizing requires significant labor, which is why scaling and Enterprise-level businesses need an automated solution to save thousands of man hours.
On the automated end of the spectrum, the consumer tool Crushpics will allow you to use 2 levels of compression. You can opt for conservative lossless compression with small image size reduction, or balanced, slightly lossy compression which will reduce your image size by ~50%. For a small brand on a tight budget, this an ideal compression solution that sacrifices very little visual quality. The downside is that if you have a lot of high quality images your website will still lag significantly. One of the clear ways to make a seismic shift in data usage is to limit the amount of data transferred. The average website’s weight consists of 90% media. Companies like Netflix have adopted smarter media formats to load faster and eliminate page weight without huge sacrifices in visual quality. However, a new technology has transformed the landscape of media optimization.
FORGET COMPRESSION, USE NEUROSCIENCE MEDIA OPTIMIZATION
Slow-loading and/or overcompressed media files will necessarily affect the conversion rate of your Shopify store. This stems from media being the 1 factor in determining page speed and customer expectations. Images and videos make up for about 90% of the average website’s size, making media optimization a vital part of any online business. By making your site weigh less, it will load much faster and you will lose less customers. So let’s address the elephant. How can you optimize your media to load significantly faster without sacrificing the visual quality of the products you are trying to sell
SpeedSize has developed an entirely new technology to solve the problem of loading speed vs. visual quality. With SpeedSize, you can reduce the file size of your media by up to 99% with perceptibly lossless visual quality. Developed by doctors, programmers and scientists, our algorithm is able to determine up to 100 factors that mirror human visual perception to scrape away the data in the file that is not visible to the human eye. The results are unprecedented. Along with images, we can also optimize video content to the size of an image. Cool, right?
AUTOMATICALLY IMPROVE YOUR IMAGE QUALITY
By using SpeedSize’s Shopify plugin you will automatically enhance the quality of your images, while reducing the size by ~50% from the already compressed Shopify images. Your files will load twice as fast and there will be no blurring or pixelation.
PLUGIN TO AI-OPTIMIZATION
The SpeedSize™️ Shopify plugin can be implemented, with one click after receiving your client ID from us. So all you need to do is install the plugin, make an appointment with our team to get started with the new standard in image optimization.
