Lossless Image Compression with WP Smush

Share Button

Image compression is an important part of any website’s loading speed and subsequent SEO performance. Google (and Bing) give prefer fast loading websites. If you are running WordPress, then the WP Smush plugin can optimize your images. This tutorial will cover how to use WP Smush.

WP Smush

WP Smush is a WordPress plugin with one goal, lossless compression of your images. And the best part being there is no configuration needed.

What is lossless compression?

Well, without getting into the technical details, lossless compression┬átakes an existing image and finds bits of data that aren’t really needed. It then eliminates these unneeded bits. The end result is the image looks the same, but takes up less space.

On the other hand lossy compression makes the image smaller, but reduces the image quality.

WP Smush used to use the Yahoo Smush.it service for compression, however that service has shut down. It’s now maintained by the wonderful folks over at WPMU who have set up their own system for smushing, which quite frankly is a lot more reliable than the old Yahoo service was.

Once the plugin is installed and activated, all new images added to your WordPress site will automatically be smushed into a smaller file size.

Note: Since Smush.it runs compression on each image upload, image uploading does take a couple seconds longer per image.

Shrinking Existing Images

This all sounds great for new uploads, but what about your existing images? Well, that is pretty easy. Just go to your WordPress dashboard and click on Media and then Bulk Smush.

media_smush.it

Once there you will see a screen with “Run all my images through WP Smush right now” as a button at the bottom. Just above that will be the total of how many images you have in your library and an estimate on how long it will take to run.

Once you click Run, leave your browser window alone for however long they estimated you need (you can use other browser windows, just not the one running Smush.it). Probably a good time to have lunch. If you are running gzip compression (like W3 Total Cache), you will not see all progress updates until it is done. Leave the window alone. Don’t even scroll.

smush.it_instructions

Once you have waited the allotted time, scroll to the end of the page and you should see a completed message. If you don’t see the message but just see status updates on images, you need to wait longer. Remember, it was only an estimate.

smush.it_batch_done

Limitations

I would be remiss without covering the limitations of this wonderful plugin.

First, your images need to be less than 1MB. If you have larger media files — well you’d better be running a photography gallery site where clients can download original high res images, then you can upgrade to a paid WPMU membership and get access to their Pro version of the plugin.

Note: If you have images larger than 1MB because someone was uploading giant images to your site, you can use a plugin like Imsanity to reduce the dimensions of it (and therefore the size).

As a general guideline you shouldn’t be uploading images that are greater than 100KB to websites. Larger than that and your page loading speed will take a hit. Also, you shouldn’t be uploading images any larger than the space they will go into. So, if you have 600 pixels of width for your blog post area, your images shouldn’t be any greater than 600 pixels in width (unless of course you are going for retina, in which case you should have more than a basic knowledge of images).

Second, the images must be both publicly accessible and on the local server. This is so that the service can actually access and manipulate them.

Conclusion

There you have it, a simple solution to the common problem of needing smaller images. WP Smush will help with your page loading times which in turn will help your SEO. Did this tutorial help you? Leave us a note in the comments.

Share Button

Leave a Reply

Your email address will not be published. Required fields are marked *