Product Images – How to Optimize Images to the Fullest

product-images

I'm looking to upload my products into my Magento 2 store. However, before hand I want to make sure the images are correct.

I've resized my images to 600px in width (height depends on ratio), and compressed my images to around 20/30 KB each.

Are these images good to be uploaded onto my store?

I plan to use the same image for the variations of reasons per product? Shall I do this or resize images for each varietion (thumbnail, base, product page etc)?

Thanks

Best Answer

Instead of optimizing before uploading image consider the alternative to optimize each image request to the server.

It has several advantages:

  1. Aware of the user context : e.g. users on mobile, indicating preferences for reduced data usage
  2. Aware of the delivery context : e.g. size of image being used is 50 x 50 px, no need to deliver something else.
  3. Can be applied on existing web pages.

mod_pagespeed is an extension to apache or nginx that will do this. It acts a an intermediate and will serve different images depending on configuration, size, user media etc.

By using mod_pagespeed, there is no need to be an expert in image compression, someone else has done the thinking. Just set the filters (/ settings) and get a tremendously more optimized web shop.

Read more about mod_pagespeed image optimization.

mod_pagespeed can be used for other optimization besides image optimization. The optimization is turned on through config files through something referred to as filters. Some filters may break your web page, so do proper testing. Read about how you can configure pagespeed filters.

Related Topic