Optimise Your Images For Faster Page Loading

smush.it optimizes images by removing unnecessary parts

Aside from it being good practice to load your site as quickly as possible to lower your bounce rate, a slow-loading site may also hinder your search engine rankings. That’s why it’s extremely important to put these good practices into action when building and maintaining your site to make your site as quick as possible (you might be interested in tracking your page load speed).

One of the largest bandwidth components of sites these days is images. And too often, people upload the largest possible image they can and just display the size they need to, not thinking about why it might be a good idea to make the image fit the use. On top of that, you can also work with images that have been saved at very high qualities, when really, medium quality photos tend to do the job for the web. That could save you a lot of bandwidth and a lot of seconds off your load time.


Let me introduce smush.it. Smush.it is a free service that is provided by Yahoo!. Like Google, Yahoo! have a vested interest in making the internet faster; the faster the internet is, the more pageviews that are logged, the more ads that are served and the more advertising revenue that they see.

Smush.it uses a variety of technologies (such as ImageMagick, pngcrush and jpegtran) to squish every last unnecessary byte out of your images. These technologies are completely lossless, meaning that you lose no image quality at all; the picture will look the same when you download it as when you uploaded it.

How to use it in WordPress

If you just want to use smush.it on a single picture, you can always head over to the website, upload a picture and download the resultant image. Job done.

Smush.it in action in the Media Library

However, the chances are that you’ll want to use it on every single image you’ve ever uploaded and every one that you upload in future. And that’s where the WP Smush.it plugin comes in.

Once you install this plugin, you can go to your Media Library and smush every image that you’ve uploaded to date. Unfortunately, there is no batch tool to smush all the images in one go; you’ll have to go through one by one and do it. It’s just a one-time exercise though and it’s worth the small amount of time it’ll take.

There is now a bulk tool, for going through your entire library and compresses all old images.

So long as you leave the plugin installed and activated, every time you upload a picture, it will automatically send it to smush.it and bring back the optimised image. It does this when the image says it is “Crunching…”, so don’t cancel the operation if it appears to hang, because there is no notice that WordPress is actually optimising your image through smush.it.

Now your site should be loading just a little bit quicker, and you can even check by measuring your site load speed.

Have you seen a noticeable change in your loading speed? Does your data in Google Analytics show a noticeable difference?

20 thoughts on “Optimise Your Images For Faster Page Loading”

  1. Sally Brown says:

    Hi Dave,
    I was glad to find this info on Smush-it & downloaded on my blog. However, when I went into media and library, I got an error after pushing the “smush-it now”. Do you have any idea what I might have done wrong? Hoping you can help. Thanks, Sally

    1. Hi Sally,

      What kind of an error are you receiving? Did you just push the button once and let it run, or did you press it a few times?

      1. Sally Brown says:

        I only pressed it once. Here is a copy of the error:

        Smush.it error: Could not get the image while processing http://www.speakingoflove.net/wp-content/uploads/2011/06/Photo-by-Michele-Walters-publicdomainpictures.net2_.jpg (/home/users/web/b1045/ipg.speakingoflovenet//wp-content/uploads/2011/06/Photo-by-Michele-Walters-publicdomainpictures.net2_.jpg)

        1. Well, something is awry in your media library, because I just tried opening that image and it doesn’t exist. Maybe try a different image that is definitely in place and better yet, live on your blog

          1. Sally Brown says:

            Ok, thanks for the help. I’ll see what I can do.

  2. Bjorn says:

    Well, for me this looks like a nobrainer. I just have to get this plugin, because I use a lot of images on my blog.
    Thanks for the tip.

    1. Hi Bjorn,

      Absolutely – it’s not one of those plugins that you have to fret about installing and slowing down your site, because the only activities it carries out are done while uploading photos. It makes a big difference too.

  3. Smush.it is a very good service,Earlier my site loading time was about 7 seconds ,now it has got reduced to 5 seconds,not bad !!

    1. That’s great. 5 seconds isn’t a bad time at all. Do you use a caching plugin like W3 Total Cache? Or a CDN? You could halve that 5 seconds if not. I’ve got tutorials coming up on both those topics to make your site way quicker

  4. It’s worth mentioning that Smushit is now integrated withYSlow for Firebug.

    Turn on Firebug then reload the page and go to the YSlow option and you have the choice of creating and downloading an archive of all the page’s images, optimised with Smushit.

    Pretty good, huh?

    1. That is quite a neat trick. I started wondering whether it would be easier to visit a few pages and do that, then upload the compressed images and overwrite the images in wp-content/uploads/, but I think that would be equally as tedious. Great tip though, especially for non-WP users.

  5. david says:

    if people just upload the proper image size and it doesn’t need to be re-sized while the browser is rendering, they will be fine.

    1. Well, that isn’t true for a couple of reasons. First of all, most themes use several image sizes, so WordPress needs to create multiple size images from the original. Secondly, Smush.it compresses the images, which reduces the file size, something that wouldn’t be done by merely resizing the image.

  6. Jasmine says:

    That’s a great plugin and Smush.it is a great service as they take away the fat and make the images slim! Anyway, for me, I usually optimize my images in Photoshop first before I upload.

    1. Indeed. In an ideal world, I’d do the optimisation myself too, but it’s just one more thing to do, and when this plugin does it better than I probably could (and certainly quicker), it’s a no-brainer for me. Still, everyone’s circumstances are different. Thanks for all your comments. Really appreciate them

  7. I’ve been using this plugin for awhile but i still get an error on google page speed saying that i have to compress my images.. anyone know why?

    1. Well, this may be a stupid question, but have you compressed your images? Bear in mind, you don’t have to do anything that it says. They’re just recommendations for ways that you can speed up your site. Given that your site is a photography site, you want to make sure that if you compress your images, you do so in a lossless fashion, so that the quality remains.

      1. Muskegon says:

        Yeah, I always compress them. I usually just compress them to jpeg with a quality of 8 to reduce my server stress and website load times :) My higher resolution images are linked from Smugmug or Fine Art America.

  8. Miles says:

    I keep getting this error….can you help?

    Smush.it error: Image size exceed 1MB limit while processing http://www.phillyrehabdeals.com/blog/wp-content/uploads/2012/10/IMG_0006.JPG (/home2/phillyre/public_html/blog/wp-content/uploads/2012/10/IMG_0006.JPG)

    1. That’s because the limit for smush.it is 1MB. You can either reduce the size of the file before you upload it (resize it to your biggest image size), or use an alternative like EWWW Image Optimizer, which I prefer.

Leave a Reply