Useful internet software, websites and blogsites.: Compress Your Images To The Last Bytes With Smush It

Sent to you by Hemi via Google Reader:

Compress Your Images To The Last Bytes With Smush It

via MakeUseOf.com by Damien Oh on 3/20/09

smushit-logo If you have followed my posts previously, you will know that I am a fanatic in optimizing my site for the best performance. One of the thing that I do is to optimize and reduce the images to the smallest possible size without losing the visual quality.

If you are wondering why reducing the size of your images can help in the site's performance, basically the bigger the size of your images, the slower it takes for the server to load, and the higher probability that your server will crash when you experience a traffic spike (like reach Digg front page). In addition, if you are hosting your images on a third party site, like Amazon S3, having a smaller image also mean lesser cost as the charge is based on the bandwidth and storage space used.

Smush.it is a service developed by the Yahoo Exceptional Performance team, aimed to improve the performance of your site. What SmushIt does is to strip all the metadata from the images and compress them using an optimization algorithm that will not only reduce the size, but also preserve the visual quality. When I first used it, I were surprised to see a 30% reduction in the size of the image that I have optimized in Photoshop. Most of the time that I use Smushit, it is able to shave 10-50%, occasionally 80% off the image size.

There are several ways that you can utilize Smush it.

Upload your image

If you have some images in your computer that you want to optimize, you can easily upload your images to Smushit via the onsite uploader. There is no limit to the number of images that you can upload, but do bear in mind that the more you upload, the slower it is.

smushit-upload

Image URL

Instead of uploading, you can also point Smushit to a Web URL (for example, your site) and get it to analyze and optimize all the images in that URL.

smushit-url

Firefox extension

This is by far, my favorite way of using Smushit. If you are using Firefox browser, you can install the Smushit Firefox extension and have quick access to it anytime, anywhere. When you are on a web page (perhaps when you are previewing your post article in your site) and you want to optimize the images on that page, simply click on the SmushIt icon on the Status bar and it will analyze and optimize all the images on that page.

Alternative to the Firefox extension is the bookmarklet that you can place on your Bookmark bar.

The result

Once SmushIt has optimized your images, it will show a report of how many bytes it has shaved off the original images and provide you a link to the zipped files of all the compressed images.

smushit-result

WordPress Plugin

Another thing, if you are using WordPress, there is also a Smushit plugin that you can use. Once you have activated the plugin, all the images that you upload to your site will automatically run through SmushIt behind the scene. There is nothing extra that you need to do. Alternatively, you can go to your Media Library in WordPress and process your existing images with SmushIt.

smushit-medialib