If you have a website or work for one, you know how important it is for images to be small in size. Page loading times, which can sometimes even influence a visitor’s decision to stay on the page, can depend on how well images are optimized.
Fortunately, there are some pretty good tools which allow you to easily optimize your images, without losing quality. You just have to know where to look.
Not making compromises in terms of quality is of the utmost importance because showing your visitors images which don’t look good could also cause you to lose them.
The following websites will help you achieve both these things in a simple and easy-to-use way. So, without further ado, let’s see what these sites can do (there are, of course, some good desktop tools too, like RIOT).
In order to get a better idea about the power of these websites, I’ve decided to use two files – a JPG and a PNG (the same image in different formats). Depending on the file formats the respective website can work with, I’ve used them both or just one of them. The JPG was 255 kilobytes in size, while the PNG is 2.54 megabytes.
Resolution for both files was 1920 x 1040.
Also on Guiding Tech
A personal favorite of mine and a site that does its job very well. As its name says, it’s just for PNG files.
TinyPNG uses smart compression to make PNG files smaller, without much visible loss in quality. Personally, I’m not sure if I could tell the difference between the source image and resulting one most of the times.
To use it, you can just drop your PNG on the dedicated space on the website or you can click that space and upload them. Once uploaded, the site works its magic and you can download the end result.
In my case, the 2.7 megabytes file has turned into a 984.5 kilobytes one. I’ve tried comparing the two images, but I couldn’t find much of a difference.
This tool supports GIF, JPG and PNG files. It does the same thing – it uses lossy algorithms to decrease your image size.
Start by clicking Resize Photos Now and you’ll find that it can provide a little more. You can crop images, make them sharper, add a border, or even add tint, exposure or contrast.
You can also decide the amount of quality loss you’re comfortable with (in the case of JPG images).
Cool Tip: Remember that Web Resizer will also resize your image, but you can type in its width in order to avoid that.
In the case of my PNG file, it didn’t do much, as you can see in the image above. However, it has made my JPG file 8% smaller, from 255 kilobytes to 233.
Even so, it deserves an honorable mention for the options it offers. If you want more comprehensive web image editing, try the Google+ Image Editor, which can also add HDR effects.
3. CompressJPEG.com / CompressPNG.com
CompressJPEG and CompressPNG are sister-sites, with exactly the same interface. Each one of them will allow you to process a queue of up to 20 files at a time. They can be dropped or you can click the Select Files button.
CompressJPEG can also compress BMP and PNG files, but they’re converted to JPEG first. Its sister site also supports BMP, ICO, GIF and JPG files, but converts them to its favorite format first.
Once you’ve clicked Upload queue and your files have finished uploading, click the thumbnail of the image you want to adjust and you’ll be able to compare the original and the compressed image and decide the amount of compression you’re ok with. After that, click Compress (you can even zoom in and out to see the effects).
I went with 80, since that was the default value. My 255 KB JPEG file has been compressed to 189 KB, while the 2,5 megabytes PNG will now load much faster, at just 959 KB. No decrease in quality here, either.
Owned by the good people at Yahoo!, Smush.it claims to remove unnecessary bytes from images, without damaging them. According to its FAQ page, it can work with JPG, PNG and GIF images.
The interface is nothing to write home about, but it gets the job done. In the Uploader tab, choose the images you want, then click Smush.
Once you do, your images will be uploaded and, after processing’s done, you’ll get a results screen (just like the one below) with details underneath it.
You’ll be able to download your optimized images as an archive, or you can click the link in the details table. Smush.it has reduced my 255 KB JPG image to 233 KB, but told me it didn’t find savings for the PNG. I’ve tried another PNG, which was 938 kilobytes in size and it has managed to reduce it to 469. I guess its algorithms only work in certain situations.
There you have it. If you need to optimize or resize images for use on a website, there are enough good ways to do so.