Are you already familiar with the term WebP? It is a new image format developed by Google that offers images of much lower weight, affecting the quality of the images very little or nothing.
We're your Core Web Vitals Developers!
We will fix the core web vitals issue on reported URL's then submit them until they are in the 'Green' section..
In this article, we will investigate a little more why and how to go from traditional formats (PNG, JPG, JPEG, etc.) to WebP as a way to optimize the loading time and performance of your website. Also, we will learn How to serve compressed WebP images to fix Largest Contentful Paint (LCP).
The birth of WebP Image Format
The purpose of WebP is precisely web performance. It is a format developed by Google to maintain the same (or almost) visual level and quality as that of traditional formats, but with much less weight.
WebP allows compression in both standards, both lossy and lossless, so you have the flexibility to choose between preserving more data and more quality and optimizing to the maximum even if it implies lower visual quality.
WebP vs. JPEG and PNG
According to a Google study comparing formats, the WebP format is, on average:
- A smaller 26% to PNG
- Between 25% and 34% smaller JPEG
In the WebP Gallery, you can see comparisons between formats such as JPEG vs. WebP.
Let’s dive into how you can serve WebP Images to Fix LCP issues.
How to Serve WebP Images in WordPress to fix LCP
I would like to tell you that it is as simple as creating images in WebP format and uploading them to your WordPress image gallery without further ado.
Unfortunately, at least to this date, WebP is not a default supported format in WordPress.
But fear not, as always, the flexibility of WordPress and the number of developers working on plugins, allows there to be alternatives.
WebP Express
WebP Express is a completely free plugin that works great too and is very simple. It’s a bit more basic in terms of functionality compared to Optimole, but it perfectly does what it promises; automatically convert images to WebP and serve them when the browser supports them. Just configure it.
Optimole
Optimole is a freemium image optimizer that is very cool. It optimizes the images automatically, allows to serve them through a CDN, and, of course, automatically converts the images to WebP if the user’s browser supports it.
This means that you can continue uploading images in other formats and, when possible, it will show the WebP format and, when not, it will show PNG or whatever you have uploaded.
So, as with Optimole, you can take advantage of WebP whenever possible and, for example in the case of Safari, still serve JPEG or PNG.
There are more alternatives and they will surely become more common, but surely with this, you can find good solutions.
We hope you find it useful.
Conclusion
As we can see, serving the WebP images can significantly fix LCP on our website. And will allow us to help have images of smaller size and better quality, helping us in this way that our website loads faster and offers a much more rewarding user experience.
If you think you can’t do it then don’t worry, Our professional developers are here for your help.
We have a development team that fixes CWV (Core Web Vitals) errors significantly for our clients. So drop us a message or see our Affordable Pricing if you’re struggling with Core Web Vitals stuff, and we’ll fix all Core Web Vitals errors for you.
If you enjoyed this article, Don’t forget to share it.
