Hi, have you ever woundered from time to time if all those gigabyte of images on your hard drive really need to be all that big?!

Normally, if you compress images, you lose quality. If you want to keep optimal quality you will normally end up with big files. So you either have to sacrifice quality or file size. If you are interested on how to get both, read on!

Using the Google Tool Page Insights for optimizing this blog, I found there are several tools with which you can optimize the filesizes of images without any loss of quality.

I will show you now how to optimize all images on a specified directory (JPEGs and PNGs). I will download all the images from my blog, optimize them and upload all of them back to the website as an example. I want to make the web a faster (better) place :)

1. First, when you want to optimize your images, you have to copy them all into a specific directory e.g. „images“. I have downloaded the „wordpress/wp-content/uploads“ to process all images in it.

2. After you have setup your images folder, you need to install OptiPng (http://optipng.sourceforge.net) and Jpegoptim (http://freecode.com/projects/jpegoptim). If you are using a Debian derived Linux flavour (like Ubuntu which I use) you can simply type:


sudo apt-get install jpegoptim optipng


 

3. After you have installed these tools, you can now go into the root of your images directory.


cd tmp/uploads


NOTE: Please make sure you have a backup of your images directory in case anything goes wrong! You might loose your images if you don’t make a backup!

 

4. Now, lets first process ALL JPEG FILES within the image folder and it’s subfolders with the following command


find . -iname "*.jpg" | xargs jpegoptim --strip-all


Note: „–strip all“ strips all meta information from your images. This is fine if you want to post them somewhere in the web but you should keep meta information on your personal images.

 

5. Now, we aim at ALL PNG FILES within the image folder and it’s subfolders. This will take longer since we want to use some good optimization to get good compression results. If you want to create a new folder with all optimized PNG images in then you can simply type:


find . -iname "*.png" | xargs optipng -o5 -quiet -keep -preserve -dir optimized -log optipng.log


In my case, I want to overwite the old pictures with the new ones but keep a backup in the same folder (for comparison).


find . -iname "*.png" | xargs optipng -o5 -quiet -keep -preserve -log optipng.log


 

6. After having made sure the new PNG files have flawlessly been compressed, you can delete the backup files as well:


find . -iname "*.png.bak" -exec rm -rf {} \;


 

Now, all your images have been optimized to close to perfect file size without loosing quality.

Hope the trick will improve your websites load time and save you some disk space. Any comments are highly appreciated! :)

Maurice