Blog

Magento Image Optimization

When you are working with images in Magento you have to keep in mind that images take up space and can potentially slow down your website a lot due to their size. There are certain tools to make sure your images look good and are web ready. I will discuss a few here in this post.

Magento Image Optimization

There are many tools for Magento Image Optimization. Some tools are specifically made for Magento and are mostly Extensions running inside Magento. Others are just regular image compressions slash optimization tools. Let’s get started.

Image Optimization Command line tools

There are several command line tools for Magento Image Optimization in bulk they can be installed on your Mac, PC or Linux box with relative ease. These tools can be used for any CMS so will work for Magento, WordPress and so on. There is a Stack Exchange Magento thread on it here . I will cite some commands I have used and that are mentioned there:

 

  • PNG Images: Using OptiPNG: optipng -o7 -strip all media/catalog/product/*.png
  • JPEG Images: Using JPEGTran: find media/catalog/product/ -name "*.jpg" -type f -exec jpegtran -copy none -optimize -outfile {} {} \;
  • GIF Images: Using GIFSicle: gifsicle --batch --optimize=3 media/catalog/product/*.gif

As you can see OptiPNG, JPEGTran and GIFSicle are used. These can be installed on any operating system. There is also PNGCrush as an alternative for OPtiPNG. Have not used the one for gifs myself as most images I upload are either pngs or jpegs.

OSX & Windows Image Optimization

There are programs for your Mac to optimize images before you upload them to your Magento installation. ImageOptim is one of them. I could mention others, but this is a great free tool that deals with most common image types. Great option if you don’t want to deal with online tools, command lines tools or do not want to pay for a good extension.

As for Windows, RIOT pops up in my mind. Been an OSX user for a while but this tools is for free and runs on Windows. Should do the job well too.

Magento Free Extension Compress JPEG and PNG Images

This is a free extension and is fairly popular at Magento Commerce. More so then the commercial extension I will discuss hereafter. But also of course because it is a free extension. It uses the TinyPNG and TinyJPEG services in the background to compres the images for which you need an API key. Free usage is limited to roughly 100 products / product images. After that you will be needing to pay to keep on using the API.

Magento Commercial Extension Image Optimization

There is also a commercially available extension to compress images in Magento. It is called Image Optimization and can be bought for $79. This tool reduces the size of your image the way the command line tools does, but without the need for them or the knowledge to take care of it from the command line.or use a free extension like this one or $79 with this extension

Further Reading

Mashable has a decent list of online and offline tools to compress images which should help you with Magento Image Optimization. It mentions programs for Windows and Mac like JPEGmini as well as online tools like Smush.it (imageoptim). As for me I would go for the free program I mentioned or the command line tools.

NB If you want to change the dimensions of images I would use Photoshop, Affinity Photo (Mac only) or Gimp. The latter being a free Open Source tool, the first two commercial ones. And to be fair these tools do have options to save for the web as well. Though I personally think the open source command line tools do a better job and give more control.

Tagged in : Tagged in : , , , ,
Jasper Frumau

Jasper has been working with web frameworks and applications such as Laravel, Magento and his favorite CMS WordPress including Roots Trellis and Sage for more than a decade. He helps customers with web design and online marketing. Services provided are web design, ecommerce, SEO, content marketing. When Jasper is not coding, marketing a website, reading about the web or dreaming the internet of things he plays with his son, travels or run a few blocks.

Related Articles

Google's Mobile First Index

Google’s Mobile First Index To Be Launched within Months
Webpreneur in Bahrain

Webpreneur in Bahrain
Webmasters Sitelinks

How to show page links to secondary pages in search results of Google

4 comments

  1. Nihal
    /

    The commands you mentioned are not working. Do we have to specify the complete directory for running these commands like home/username/website/media/catalog/product or how to run them properly? Thank you very much

  2. Jasper
    /

    Well, try optipng -o7 *.png inside the directory for example then Nihal. That should work for certain and requires less precision. Will check all commands again as soon as I can. Should work though. Two, you do need to indicate the full path to the directory, yes. But it should work without starting with / as long as the path is correct from the location you are firing the command.Just run the compression on the files in {base}/media/catalog/product/*

    • Nihal
      /

      Thank you for the reply. It worked. Actually I tried the JPEGtran command you provided and after running the command it increased the image size instead of decreasing it. Do you have a full command where we can specify whether we want it more or less decreased like opting -o7. Thanks

      • Jasper
        /

        You could try find /the/image/path -name "*.jpg" -type f -exec jpegtran -copy none -optimize -outfile {} {} \;
         or jpegtran -copy none -optimize input_image.jpg > output_image.jpg. Just make sure you backup before you start as always. Also, once this is done running it again won’t make a difference. If no change is made you could crop the image still of course. From the man page:
        -crop WxH+X+Y
        Crop to a rectangular subarea of width W, height H starting at
        point X,Y.
        And no, I do not see any options to choose levels I’m afraid.

Comments are closed.