How to Optimise Images for the Magento Platform

How to Optimise Images for the Magento Platform

Liam Firth

Any websites running on the Magento platform are usually rich in images.  This is primarily to showcase the products you are selling on your website.  However, whilst these images are great for promoting your product and are essential to showcasing to the customer the different products on offer, these images also have a negative impact on the page speed of your site.

We all know that the time it takes for your website to load has a significant impact on the overall user experience.   Many online users will give up on a site that takes an age to load.  A slow Magento website can also negatively affect your ranking on search engines as well.  It’s important that you take the time to optimise images for the Magento platform so that your images (along with the pages they are on) continue to load quickly and efficiently.  When it comes to optimising images, there are usually the main areas to focus on.

Image Format

One of the first steps you need to complete when it comes to optimising the images on your Magento site is to save each image in the right format.  In most cases, this mostly involves saving your images as a JPEG file for the smallest file size. Also, you can use PNG images for higher-quality or transparent images.  GIF can also be used, but this is usually only for animation.

Image Resolution

If you are unfamiliar with the term ‘resolution’, this essentially refers to the size of an image.  The size of your chosen image should ideally match the size that is shown on your Magento platform website.  As is often the case, the higher the resolution of an image, the larger the file will be.  This is why it isn’t a good idea to save a high-resolution image but only showcase it as a tiny thumbnail image.  It is often a good idea to create a number of different resolutions of the same image, particularly if you have a website that scales images according to the size of the screen you are viewing it on.

Image Compression

More often than not, images will be compressed to help reduce the file size.  This usually results in sacrificing some of the image quality as well.  This means you need to find a balance between the quality of an image and the size of the file.  There are a number of lossless compression options.  These will slightly reduce the size of your image by stripping away unnecessary metadata, without compromising the quality of the image.

Optimisation on the Magento Platform

Whilst it is possible to use the three options we discussed above when saving your images, the Magento platform also offers a number of free and paid extensions you can use.  Most of these extensions will be able to compress your images to reduce their file size.  Also, others can adjust the format and resolution of your images as well.  If you are dealing with images in bulk, it may be more convenient to use an extension to handle your workload.

Do you use any Magento extensions to optimise the images on your site?  Let us know in the comments below.

Liam Firth

Author Liam Firth

Liam is a Technical Lead with eight-years’ experience in Magento and WordPress development, as well as engineering AWS and DevOps. He likes sourcing new and shiny tech solutions for real-world problems. He is a Magento Professional Certified Developer.

More posts by Liam Firth