Reduce Image size with WebP in Blogger for faster page speed and less data consumption

The speed at which a site displays affects search ranking results, so reducing the weight of images is very important for SEO. A larger image will slow down the display speed of the site by itself.

Page speed insights recommends to Serve images in next-gen formats, WebP. The good news is that Blogger allows you to display images in webp format by simply rewriting the image url. So, be sure to convert the image to WebP format.

You can get the maximum effect by compressing the image size first and then converting it to webp. I'm going to teach you how to do that.

reduce image size

There are two ways to reduce image size.

Reduce image size at Image compress site

There is no need to install new software to compress image sizes. That's because there are websites that compress your images. Such as this site : iLoveIMG

Images can be lightened by more than 60% without losing sharpness.

Reduce image size by editing image url

When you upload image your image url would be something like this

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJF70ZTKirOvC04vKY9zqvLQDs0bxrnG5SyMWqQg3TtzYcZNHpUy3P2b1ngTB3bylRFfj1iMCVS8NvyAwX7SunztEoiOmlx6NTSAJC_iELIdP_GmHhiUE8ZrAiBT-JHI4vqi1vkTPEo9DyBJ1PRX32e9-9W1l5lvXa-Bm601xjDkF_ozQPHb3Iew/s1600/webp-format.jpg

now we can resize this image and also make into webp format by rewritting specific part of this url. here is how.

the last part "/s1600/webp-format.jpg" is showing the file name and the file size. you can change the size by rewriting the part s1600 to s400. Write any size you want. s300 s320 s1000. If you write s0 An image of the original size is displayed.

So after you upload image change this number to smaller so your displayed image size gets smaller.

Conver to WebP format

now to change it to webp image all you have to do is simply add "-rw" after the number of the size you just rewrote. That's it.

so the rewrite part would be something like this "/s400-rw/webp-format.jpg" and entire url looks like this.

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJF70ZTKirOvC04vKY9zqvLQDs0bxrnG5SyMWqQg3TtzYcZNHpUy3P2b1ngTB3bylRFfj1iMCVS8NvyAwX7SunztEoiOmlx6NTSAJC_iELIdP_GmHhiUE8ZrAiBT-JHI4vqi1vkTPEo9DyBJ1PRX32e9-9W1l5lvXa-Bm601xjDkF_ozQPHb3Iew/s400-rw/webp-format.jpg">

Now it's complete. How much size can be reduced by WebP is a case-by-case basis, but sometimes the size is less than half. In Blogger, webp conversion is so easy that there is no reason not to use it.