SofanMax - Blogger, or Blogspot, transforms into a modern platform that emphasizes mobile-friendliness. It is actively modernizing its core to create a powerful content management system.
Consequently, users may notice a major update in image URL format. You may also see that your images, including WebP, will be served in JPG format by default.
Previously, the old Blogger did allow you to directly upload WebP to the server. Furthermore, images will be displayed according to the original format. If you upload PNG and WebP, the server will serve the images in those formats. Nowadays, Blogger will automatically convert your images to JPG.
You can still serve images in WebP format in Blogger. There is a hidden option that allows you to do it by tweaking the image URL a little bit. However, before we delve deeper into that, you need to see the URL difference first.
Read also:
- Fletro Pro v6.1 Blogger Theme With Great Core Web Vitals
- My Essay on The Reality of Blogspot and AdSense Monetization
Difference Between Old and New Blogger Image URL
In the old Blogger, your image is stored using the following URL structure:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXY2GdWtgSzhBpXLL8bn6Hnowmwze_h0uEFLPlYPzpPoLt_Un5oLE2c1o0GIBtnh4ZRsS7y4mO91lWPM__aqTzGuAjMYKtxcY2-18Cwf-hJM-zgGIBPxLAo1B6kf5STYcD9kFVFFe6ayTx/s1920/how-to-solve-site-behavior-navigation.png
Meanwhile, the new Blogger will serve your photo using the following URL structure:
https://blogger.googleusercontent.com/img/a/AVvXsEiA0iT7b3CjFAfZ1FuZbrb5-GKQkrBUw0sYAYvhj0dgK84nwDaI_jROYBqJTTDxRM6r6oekcVywqTTqK1XPrSivbZVpsGVGZx2zsHUFUOZlNGLrTQgsxZ6f3npRZv8T7LUhyu_fRvgd2ZazwlrMj_D9_cPhf8in3Sz2DLxdNSq2wgczghA3GK1zXTga1A=s1280
Your URL may look slightly different, depending on your image. However, you can still clearly see the difference. The old Blogger uses https://1.bp.blogspot.com, while the newer version uses https://blogger.googleusercontent.com/img/.
The old Blogger URL shows your image extension clearly. The example above, it comes in PNG format.
For the new Blogger image URL, you may notice that it lacks the format extension. It does not clearly show what type of image it is. It will be served under the JPG format by default if you open it.
The picture above shows you that the images in the new Blogger are served in JPG format. You may initially upload the image in PNG or WebP. But, the server will still forcefully serve it in JPG.
As a result, your blog may not be optimized for speed! After all, you want to display a clear image in the smallest size possible.
Fortunately, there is a method to get around this problem. We can serve images in WebP format through the following process!
Read also:
- How to Solve AdSense Policy Violation "Site Behavior: Navigation
- How to Index Blogger Post Using Google Search Console Tool - Basic Search Engine Optimization
How to Display WebP Image in New Blogger URL Format!
To serve WebP in the new Blogger, you must manually alter your image URL. It is a bit tedious, but it is very simple. You just need to locate the image URL in your post, then put -rw at the end of the URL
For example, the following URL is serving image in WebP!
https://blogger.googleusercontent.com/img/a/AVvXsEiA0iT7b3CjFAfZ1FuZbrb5-GKQkrBUw0sYAYvhj0dgK84nwDaI_jROYBqJTTDxRM6r6oekcVywqTTqK1XPrSivbZVpsGVGZx2zsHUFUOZlNGLrTQgsxZ6f3npRZv8T7LUhyu_fRvgd2ZazwlrMj_D9_cPhf8in3Sz2DLxdNSq2wgczghA3GK1zXTga1A=s1280-rw
You will notice that I simply put -rw at the end of the URL after the image size. It is simple as that!
You can try it yourself, download the image or check it in PageSpeed Insight. Putting -rw at the end of the new Blogger image URL will automatically convert it into WebP.
Furthermore, you may upload the initial image in any format. If you want to convert it to WebP, all you need to do is add -rw at the end of the URL.
If you are new to Blogger, you can locate your image URLs using the HTML view from the text editor. The button is located on the top left side.
After entering the HTML view mode, you can automatically tidy it up using the Format HTML button. The button looks like three horizontal stripes. This feature will not affect your non-HTML formatting at all, so you can use it liberally.
Tidying up the HTML code will help you quickly locate your image URL.
Every time you upload an image in Blogger, it will provide you with two URLs. The first URL store your picture in 1600px size. The second URL displays the thumbnail.
Like the example above, you can add -rw to both of those URLs.
I would like to mention that the WebP format and new Blogger image URL may not be perfectly compatible with some themes. You may notice a little bug. It is unfortunate, but we hope that theme developers can update their creations to be more compatible with the new Blogger.
Why do bloggers need to serve their images in WebP format?
If you are new to blogging, you may wonder why image format matters. The answer is related to speed performance. You want to deliver your content as fast as possible to your visitors. Your readers prefer websites that load fast.
Images are assets in a web page that usually loads slower because of their sizes. So, you need to provide compressed images optimized for the web. That format is called the WebP. This format features high compression. As a result, visitors can see the image clearly in its smallest size.
According to the official definition, WebP is a modern image format that provides superior lossless and lossy compression! Using WebP, you can create smaller, richer images that make your blog faster.
Before I end this article, I'd like to thank John, a Google staff and Blogger.com developer who helped me to point out this solution. If you guys have an unresolved issue with Blogger, I suggest you visit the official forum.
Leave a comment below if you have any questions regarding WebP image conversion in Blogger or Blogspot!
Read also: