How To Compress Images For Your Site

Probably one of the easiest but often overlooked methods for increasing page speed and reducing bandwidth is image optimization, compression to be specific. If done right, it won't affect the quality of the images. It's becoming the norm, so thankfully, it's easy to do with free online services and plugins.

Compressing Images

Here are few tools that can help with image compression:

• ReSmush.it - An online tool also available as a WordPress plugin that optimizes images
• TinyPNG - Free online tool for optimizing images available as a WordPress plugin and a Photoshop plugin. It can even compress animated PNG files (APNG)
• Compressor - Easy, free online tool (pictured below… showing this tool being used for the image, too! You can see that this image's size was reduced by 72%)
• ImageOptim - Another online tool that optimizes your images while giving you total control. It can also optimize high def retina images. However, this one is not free, as pricing starts at $9 for 1000 optimizations per month.

This image was compressed by over 70%

If you're using WordPress, it's straightforward to optimize your images through plugins. Besides the services above that offer a plugin, here are a few more:

• ShortPixel
• Ewww Image Optimizer

What is the WebP image format?

In addition to compressing images, you may also want to consider using the WebP image format. It's been shown to reduce image size by over 80% in some cases and is supported by all major browsers, including Chrome, Firefox, Microsoft Edge, and Safari.

But when you use WebP, it doesn't replace your existing JPEG or PNG files. So if visitors are using a browser that doesn't support WebP, they'll be shown the other version. Yes, this means you have more images on your site, but if most are displaying the WebP version, it can still dramatically decrease the size and weight of your site, making it run faster.

And there are several WordPress plugins that will do all the heavy lifting for you - Optimus, Smush, and Optimole are a few worth considering.

Even for unsupported browsers, WebP support can be added through the use of the WebPJS library.