Now and again something new and noteworthy pops up that is worth taking a look at. The latest hot topic is WebP image formatting. But what is WebP, can it replace JPEG’s, and will they make your website load faster?
WebP is one of the newest image formats and was created by Google in September 2010, and has since been upgrading and improving until its current state. However, it is only now gaining more traction thanks to recent improvements as well as developments that some browsers have made to now support and become compatible with WebP files. As of February 2021, the File type is supported by Chrome, Microsoft Edge, Firefox, Opera and most recently by newer versions of Safari in September 2020.
What WebP files do is combine the compression abilities of JPEG’s with the quality retention and transparency support of PNG’s. This allows you to make high quality, transparent (or non-transparent) images whilst also maintaining a very small file size in comparison.
In a nutshell, WebP images are typically smaller than their counterparts but have the same overall quality. Meaning that using WebP image types for your own site will (usually) make it run X milliseconds faster and at the same time decrease the amount of space used in your websites’ storage.
“How much smaller?” we hear you ask. Google reported that the compression rate of a lossless WebP image is smaller than PNG’s by 26%, and lossy images are 25-34% smaller than comparable JPEG images.
JPEG Image (Left/Top), 496KB — WebP Image (Right/Bottom), 152KB
On the image above which we chose to demonstrate the effects on a WebP image type you can see that the converted file size is in fact 70% smaller than the JPEG whilst still maintaining its quality. Can you see a difference?
For websites that rely heavily on images to grab their users’ attention, switching over may have a big impact and save valuable milliseconds of loading time, especially on mobile devices.
WebP’s transparency and animation capabilities make WebP sort of a one-stop-shop for whatever you might want. Before you’d need to use PNG files if you wanted to create a transparent image and a GIF for any sort of animation.
WebP is still taking the back seat for most when it comes to image formatting as some web browsers are still yet to begin supporting the file type. Internet Explorer being one of these browsers along with earlier versions of Safari and lesser knows browsers like KaiOS.
Some points to consider are – “Is your website very image-heavy?”, “From what browser do the majority of your users access your website?” and “Are there other ways to improve your website speed before thinking about switching to WebP?”
If you want to have a specialist to have a look over your website to see if there are other ways to speed your website up you can always get in touch with the Hushbots, based in Darlington, to have a look for you.