Product Images – How to Decrease Download Size of a Product Image

I told you how to do this the other day yet another question gets opened!

It is best to keep your source images at the higher resolution - they might be useful when everyone has 4K screens. That might not be too far in the future. Therefore the approach I suggested to you last time is pretty good.

If you must resize all your images en-mass, take a look at this answer:

https://stackoverflow.com/questions/10802606/how-to-batch-resize-images-in-ubuntu-recursively-within-the-terminal

Use imagemagick, for which you will need to give 5 minutes to install and read the options available.

Magento can create images with the same dimensions. But: if image A has 20px whitespace as default and image B 2px, A is 300x200px and B is 1200x1800px there is no way to process this totally programmatically.

You can create the images with same dimensions on the fly like this in your app/design/frontend/[theme]/[name]/catalog/product/list.phtml where is defined the image:

$imageSource = $this->helper('catalog/image')
    ->init($_product, 'image')
    ->constrainOnly(true)
    ->keepAspectRatio(true)
    ->keepFrame(true)
    ->keepTransparency(true)
    ->backgroundColor(array(255,255,255))
    ->quality(75) // as option
    ->resize([imagewidth], [imageheight]); // set width and height

Go to the image-tag and set for the src-attribute <?php echo $imageSource; ?>

Hope this helps a little bit.