- Nico Bistolfi
WebP is an image format developed by Google in 2010. Although it's not very common or famous, WebP is truly an innovative and efficient image format. Why? Because when you compress an image, you aim to keep the sharpness of the original image and WebP accomplishes that reducing the size file almost 35% in comparison to JPEG and 50 % to PNG.
How does it works?
This format can work in two different ways: lossy or lossless. When you choose lossy, it uses predictive coding to encode that image. Meanwhile, lossless reconstructs new pixels exactly as they were in the original image, no information is lost. No human eyes can appreciate the difference in both ways:
Webp vs JPG performance and weight
At WebP format, the colors are the same and it's still a high-quality file. The big difference is the weight: WebP is lighter than other common formats.
How to convert image files into WebP format?
There are many free tools that can help you to change your image format into WebP, like resizeimages.com
It's very simple to use:
1. Load your photo (you can upload as many as you need and convert them at once!)
2.You can crop or resize, if you don'y want it, just press Done.
3.You will see the potentials of the images, but you must click into the advanced options button.
4.You can choose lossy or lossless compression and the most important thing, convert it to WebP.
Why after converting into WebP you can't visualize the image file?
Now that you have your images converted into WebP, how can you visualize it? The easiest way is to drag and drop it into a browser compatible with it. Chrome, Firefox, Opera, Microsoft Edge. Only Safari and Internet Explorer still have some trouble reading them.
But you can also open it in Adobe Photoshop, Gimp, Image Magick, and IrfanView.
Two final tips!
- There are still some browsers that don’t support WebP format > Chrome, Edge, Firefox, and Opera are compatible, but Safari and Internet Explorer aren’t.
- Since WebP is not native in platforms such as WordPress, you may need a plugin to use this format in your website, here is the Plugin for Wordpress. If your website is made with React, Angular, Vue or HTML it will take a little more time... But, don't worry, by using Piio you can achieve everything at once and with any technology!
- Try to improve the entire Digital Experience and deliver an unforgettable experience to your users.
Piio reduces your image data transfer (converting all your images at the best format and size for each user) up to 95% and increases the delivery of your images more than 10x faster! Start your free trial (it's free forever!) and test this awesome technology on your website.
Hope this article was helpful! Continue learning more about web performance and how to improve it.