How WebP images can speed up your (WordPress) site

Share this Tweet about this on TwitterShare on Google+Share on FacebookShare on RedditDigg thisEmail this to someone

 

So you’ve been a brave admin of your website, minified and compacted the javascript and CSS, optimized all your images in order to make them as light as possible, took proper care to have properly sized images or thumbnails loaded everywhere. If you have a WordPress site, using some plugins like Autoptimize or ShortPixel Image Optimizer saved you a lot of hassle in doing that. Now that’s great but what can you do next?WebP Images Logo

Enter WebP – a modern image format created by Google, that provides superior lossless and lossy compression for images on the web.

According to Google, WebP lossless images are 26% smaller in size compared to PNGs. WebP lossy images are 25-34% smaller than comparable JPEG images at equivalent SSIM quality index. Lossless WebP supports transparency (also known as alpha channel) at a cost of just 22% additional bytes. For cases when lossy RGB compression is acceptable, lossy WebP also supports transparency, typically providing 3 times smaller file sizes compared to PNG – that’s a huge improvement.

Now, how can you leverage this new format to improve the performance of your website? Please note that you currently can’t just replace the JPGs, GIFs or PNGs with their WebP counterparts as not all the browsers support it yet. But if you have a WordPress website, you are lucky, there is a simple solution:

Starting with our new 4.1 version of the ShortPixel Image Optimization plugin, we’ve added the possibility to also create a WebP image alongside the existing images, free of charge, when optimizing your images with our service. Just enable the option in the Advanced tab of the ShortPixel settings, in your site’s admin and the WebP images will be created too when optimizing images.

SortPixel Advanced Settings tab contains the generate WebP images option

 

In order to be able to deliver the WebP images only for the browsers that support this format, you will also need a cache plugin that is WebP aware. We’ve tested the Cache Enabler plugin and it works out of the box with ShortPixel in delivering the WebP images. You just need to install and activate it, then go to  Settings -> Cache Enabler and check the “Create an additional cached version for WebP image support” option.

cache-enabler-webp

That’s all, you can now enjoy a faster site that smartly uses WebP images!

Share this Tweet about this on TwitterShare on Google+Share on FacebookShare on RedditDigg thisEmail this to someone