WebP images and how Blogger handle them

WebP images are highly recommended to improve the performance of any website. Even PageSpeedInsights have a warning for this:

What are WebP images?

Google said:

WebP is a modern image format that provides superior lossless and lossy compression for images on the web. [...] WebP lossless images are 26% smaller in size compared to PNGs.
An image format for the Web | WebP | Google Developers

So using webP images will impact positively your site's performance and also your PageSpeedInsights score.

How Blogger upload webP images

Basically, if we have this jpg image with 998px wide, 1000px heigth and 629KB of size:

Then we use a compressing tool like Squoosh.app to convert it to webp format, we will get the same dimensions but with 34.3KB of size, a huge improvement!

But once we upload that webp image to Blogger, it is now served as JPG, even if we see the webP extension at the end of the image URL:

URL of this image

How can we know what kind of image it really is?

Opening that image in a new tab, and trying to download it, the system will show us the dialog to save the image and the format it really has:

So Blogger can not work with webp images?

Yes, Blogger can and also it encodes for us webp images. So basically there is no need to use any app or tool, but it requires editing the image URL to add a small parameter -rw.

How transform any image uploaded in Blogger into webP

1. Upload as always an image file to your post.
2. Change your editor to HTML mode
3. Locate that image and find the src attribute, it contains the URL of your image
4. Edit the URL area for size, like /s16000/or any similar value between the slashes, to add -rw just before the last /

Now your image is converted and served in webP format. PageSpeedInsight will not show any warning for that image if you test the post URL and if you try to download it again, now it will be saved as webP.

Check the article Same image, different sizes for more information about how to edit image URLs

What about my homepage or any other index page?

Unfortunately, Blogger language is not prepared at this moment to offer us webP images as thumbnails. The first image of your post will be PNG or JPG but no webP even if you did the mentioned URL transformation.

I highly recommend to everyone using Blogger and concerned about the performance to do feedback about how useful could be having to have webP images served directly by Blogger in the data:post.featuredImage feature.

Sources

• An image format for the Web | WebP | Google Developers