Optimize PNG images for Google PageSpeed Insights

There is a Mobile Optimized version of this page (AMP). Open Mobile Version.

Recently I had a problem where Google PageSpeed Insights where it was giving me a huge list of PNG images that it said could be compressed, sometimes up to 90%! However I had already compressed the images using Photoshop.

Unfortunately Photoshop was not compressing the images as Google PageSpeed wanted, so I tried using the PHP GD library to compress the images. No matter how much or little I compressed the images with the GD Library Google PageSpeed was STILL GRUMBLING.

So third method I tried was ImageMagick, knowing the library was more extensive than GD I honestly concluded that this would work and fix my issues with Google PageSpeed… IT DID NOT!! I tried every technique possible but Google PageSpeed insisted I could still losslessly compress the images.

So now I was really pissed off, my boss was insisting we satisfy the criteria of PageSpeed but I could not get the thing to accept my image as compressed enough! After some more digging I discovered something cool!

 

OptiPNG

OptiPNG will cycle through many different combinations of compression to find the best lossless compression for each PNG, once it has found the best compression it will apply this to your PNG and continue to the next PNG – this way you will always get the smallest file size PNG with lossless compression.

 

Install OptiPNG on Centos 6

To install OptiPNG in Centos 6 all you need to do is run the following command in PuTTy as root:

 

yum install optipng

 

If you receive the error message “No package optipng available. Error: Nothing to do!” then you need to EPEL repo to your system by running:

 

yum install wget
dl.fedoraproject.org/pub/epel/5/x86_64/epel-release-5-4.noarch.rpm
rpm -ivh epel-release-5-4.noarch.rpm

 

Once installed you can run OptiPNG over single PNG files or multiple PNG files as you see fit, please see the example codes below.

To process all PNG files in a folder and all sub folders, CD to the folder you wish to process and then run the command below:

 

find . -iname "*.png" -print0 | xargs -0 optipng -o70 -keep -preserve

 

This command will do up to 70 different combinations to find the best compression, you can change “-o70” to any value higher or lower will change how long it will take to process each file.

Author: Dean Williams

I'm a Web Developer, Graphics Designer and Gamer, this is my personal site which provides PHP programming advice, hints and tips