What is WebP? Using WebP images in WordPress!
What is WebP?
This is an image format developed by Google in 2010 for lossy or lossless compressed images. The pictures can be static or animated, it does not matter. Although Google has been relying on its WebP format for images for a long time, the relatively new image format has not really gained acceptance yet. That will probably change now. We’ll tell you why and how you use WebP to catapult your site into a new speed league.
The highlight: WebP images are much smaller than comparable images in jpg format.
The pictures are partially reduced by 50 percent and more. There is no difference in quality.
The big advantage: smaller images are loaded faster, which makes the website much faster. And we all know: Google loves fast websites! So there are many reasons to bet on the new image format.
WebP is on the rise
Despite the benefits offered by the WebP format, it has not yet fully established itself. In Germany, only about half of Internet users should have a WebP-compatible browser, in the US it should be about three quarters of users. Of course, Google Chrome and Android phones display WebP images – both come from the house of Alphabet (the Google parent company). Microsoft Edge is only since the end of 2018 here. Firefox had previously refused to support the WebP format. Until now. The end of January 2019 published version Mozilla Firefox 65 now supports WebP. So it’s only a matter of time until almost all internet users can see WebP images.
Here are some of the pros and cons of WebP images and how to use WebP images on your WordPress site.
You want to know more about it? We’ll explain it to you here!
If you want to save images for use on the Internet, you can use different file types. The most used options are PNG, JPEG (or JPG) and GIF. While these formats are popular, each has its own advantages and disadvantages:
JPEGs can display highly detailed images with many colors, making them ideal for photos. At the same time, the files are often very large and are not always optimal in compression.
PNGs are ideal for images without large amounts of data such as logos or user interface screenshots. They keep the quality of compression excellent and support transparency, but do not work well for photos.
GIFs are great for animations but not for storing static images.
WebP Images is a Google image format that allows images on the web to be displayed in similar quality to existing image formats. The file size is much smaller.
To achieve this, WebP offers both lossy and lossless compression options. The latter stores more data, while the former, the resulting file sizes are even smaller.
Google found that the conversion to WebP went from a standard PNG to a 45% reduction in file size and still to 28% compared to already compressed PNG. Compared to JPEG it offers on average an amazing size saving of 25 to 34%
Advantages and Disadvantages of Using WebP Images on Your Website.
Benefits of WebP images:
Images are a major cause of page speed deceleration because they usually make up the bulk of page size, so each bit is helpful.
In the SEO country, we know that speed can have a direct impact on rankings and conversions. Therefore, using WebP makes perfect sense.
Image files take up storage space, no matter how they are stored. The more images and other media you add to your website, the higher the likelihood of delayed performance. It’s incredibly important for your pages to load quickly, as slow speeds keep visitors from seeing what you have to offer.
Compressing image files makes them smaller and more efficient, but usually results in a loss of quality. The more you compress a picture, the worse it looks. The type of file you use, however, has an impact on how extreme the effect is.
Images saved in a WebP format can be much smaller than JPEGs and PNGs at the same quality. Again, lossless WebP images work as a replacement for PNG files, and the files are about 26% smaller. On the other hand, lossy WebP images are 25-34% smaller than JPEGs.
It is also noteworthy that both types of WebP images support transparency. Transparent images are incredibly useful on the web. For example, you can use them for logos and other brands. JPEGs do not provide transparency as a function, but lossy WebP images.
Disadvantages of WebP Images
If WebP offers so many benefits, why is not it being used by more websites? The main drawback is that WebP images are currently not supported by all browsers, although more and more browsers have recently added support.
Due to limited browser support, you currently need an alternate version for each image.
Here is a comparison of the current browser support as of December 2018 along with each browser desktop and mobile market share:
Chrome – 67% Desktop / 53% Mobile
Firefox (desktop only) – 11%
Edge – 4% desktop
Opera – 2% Desktop / 4% Mobile
Samsung Internet – 6% mobile
No WebP support:
Safari – 5% Desktop / 22% Mobile
Internet Explorer – 7% Desktop
Firefox for Android – <1% mobile
UC Browser for Android – 9% mobile
While most web browsers now offer WebP support, there are still some browsers that do not support it (especially Safari).
As mentioned before, this does not really matter, as you can simply add PNG or JPEG images that are displayed to visitors with incompatible browsers. This only requires a little more work.
How to implement WebP in WordPress:
There are several options to set up WebP images on your WordPress site using plugins.
If you already use Jetpack, you have the option to use WebP in Jetpack. The plugin is free.
ShortPixel is a free option for image conversion to WebP format. However, if you want to process a large number of images in batches at the same time, this is subject to a charge.
EWWW IMAGE OPTIMIZER
EWWW Image Optimizer is a paid service.
Optimus HQ is a paid plugin that allows unlimited image optimization.
WebP is an image file type that has the potential to significantly speed up your website, much more than using compressed PNGs or JPEGs. WebP is available in both lossy and lossless variants and produces smaller file sizes with comparable quality.