On average, images account for half the weight of a website page. Until now, developers and site owners could compress images and optimize them to reduce their size. And thus increase the performance of their website pages. But with the WebP format, they can now use richer, smaller, and more performant images!
What is the WebP format?
WebP is an image format that is still little used and widespread on the Web. It was created by Google teams, and it aims to replace the old image formats that we know under the names: GIF, PNG, JPEG... All this, while supporting animations, transparency, and compression. WebP aims to be more efficient, and seeks to preserve the quality of images while reducing their weight.
This image format was first presented by Google in 2010 as a new standard. According to its creators, it can replace the JPEG format while being smaller and of comparable quality. Subsequently, Google announced support for lossless and transparent images in 2012, making the WebP image format a preferred alternative to the PNG format.
This lossy compression is based on the use of predictive coding, which is the same as that used for image compression in VP8 videos. However, we do not notice any difference between JPEG images and WebP images. Except that the latter are considerably smaller! We will come back to the figures.
WebP support in browsers
WebP has therefore existed for nine years now. So why is it still so little used? Why do PNG and JPEG remain the most common formats, despite the advantages of WebP? Like many technologies, WebP is struggling to find its footing and not all browsers support this image format. Thus, WebP is supported in Google Chrome, Opera Mini, Opera, Chrome for Android, and the Android browser. Other major browsers such as Safari, Mozilla, and Edge have announced support for the format, but no availability is yet offered. Apple has preferred to opt for HEIF, to the detriment of WebP. As for the others, they should integrate WebP into their compatibilities very soon.
Should you still use the WebP format?
The fact that some web browsers do not yet offer compatibility with WebP does not mean that you should not use this image format for your website! Thanks to specific solutions, it is entirely possible to offer WebP files to Internet users who use compatible web browsers, while continuing to provide JPEG and PNG images to users of other browsers, and in particular Safari.
Opting for a tailor-made solution makes it possible to avoid offering images to only one part of Internet users. All visitors will thus be able to access your images, regardless of their browser. And those who use compatible browsers will simply be able to enjoy a faster and more efficient experience than others. You don't have to lose visitors to use this format, by opting for an adapted solution.
What to do before using the WebP format?
Before starting, it should be recalled that Google Chrome is the most widespread and used browser in the world. Indeed, a total of 64% of internet users use it daily to perform searches and navigate the Web. Therefore, one should not give up on the WebP format on the pretext that other internet users do not have access to it. It is also highly likely that most of your site's visitors will be able to enjoy the benefits of the WebP format!
On the other hand, you can also use Google Analytics to know the browsers used by your site visitors. And thus, know if it is really interesting to use this image format with an alternative display solution for your visitors. If all users and visitors of your website use Google Chrome or a browser compatible with the WebP format, then it may not be necessary to offer an alternative solution. If you opt for this solution, consult Google Analytics regularly to ensure you do not lose visitors. So, what does Google Analytics say?
How to use WebP in WordPress?
The use of WebP encounters another major obstacle: it is not supported by WordPress, which is still the most used CMS in the world. The latter supports the most common image formats, such as PNG, JPEG, ICO, and GIF. However, it has not yet integrated the WebP format. As a result, if you try to upload a WebP image to your WordPress media library, the CMS will display an error message. Fortunately, solutions are already available for WordPress users who wish to use the WebP format to optimize their site's performance.
Use a free plugin
Thus, there is a solution to remedy this problem: the plug-in. There are free plug-ins such as the WebP Express plug-in which allows you to use images in WebP format, in Internet browsers that support them. This is while continuing to offer images in standard formats in other browsers (like Safari). This functionality is compatible with all images on the site, particularly those from themes, galleries, and the media library.
Use Jetpack's Site Accelerator
Furthermore, Jetpack's Site Accelerator function, previously named "Photon", can also convert classic image formats to WebP. This is done on internet browsers that support the WebP format. For others, they will remain in classic formats: JPEG, PNG...
Use the CDN for automatic conversion
Furthermore, users can also use their CDN. Indeed, those who use Cloudflare on paid plans can access the CDN's "Polish" feature, which allows the site to automatically convert images to WebP format. Just like in other cases, Polish works on PNG and JPEG images and integrates WebP versions for all browsers that support this format.
Use WP Rocket
Website owners who use WP Rocket do not have any specific manipulation to perform. Indeed, WebP will be supported in the next version of the tool: WP Rocket 3.3. The same applies to the image optimization plugin "Imagify", which should also integrate the WebP image format as soon as its next update.
Comparisons between WebP and other formats
Google's Web team focuses primarily on performance to offer effective solutions to users. With WebP, it promises lossless images, but also 25 to 34% smaller than JPEG images, and up to 26% smaller than PNG images.
JPEG vs WebP
On average, converting to WebP reduces the size of a JPEG image by 50%. However, it is worth remembering here that there are also compression solutions for JPEG images, such as free online tools (OpimiZilla is one). This allows for a considerable reduction in photo size. Without altering its quality, and even before converting it to WebP. So don't forget to use one of these online tools before converting your images.
On some images, you may notice slight quality differences between compressed JPEG formats and WebP. It's up to you to decide what compromises you want to make between site performance and image quality. However, it should be noted that the quality of WebP images remains excellent, even after conversion.
PNG vs WebP
On average, converting a PNG image to WebP allows for a 52% reduction in its size. Here, everything essentially depends on the quality of the image, its size, and its level of detail. For the performance of your website, it is still interesting to convert your files to the WebP format. Especially if a large portion of your visitors use Google Chrome to visit your site.
What you need to remember
Little by little, the WebP format is becoming more widespread and gaining support. It offers many advantages to those who choose to use it, especially on WordPress. While it can replace standard formats (PNG, JPEG, and GIF), it also allows for the use of smaller files of similar quality. On a site with many images, this can make a real difference.
Currently, only WebP allows you to obtain such small images for optimal quality. It is very likely that WordPress and Apple will end up integrating this image format into their catalog. This is in order to offer the same level of performance to all Internet users, regardless of their web browser.
