What is the WebP Image Format (And Why Does It Matter)?

Tanay Pant
Share

The WebP format is a new image format from Google which employs both lossy (a trade-off between quality and size) as well as lossless (reduction in size with no compromise in quality) compression techniques.

Google is developing both the format and WebP related software under the BSD license. It was initially released on 30 September 2010 and is an open format. It uses the file extension is .webp.

WebP: A new image format for the web

Basic Mechanism of WebP Compression

The lossy WebP algorithm uses predictive encoding to predict the values of colors of it's neighboring pixels. It then only encodes the difference between the actual values and predictions. Out of these encoded or residual values, many are null or zero and this phenomenon contributes in further decreasing the size of the WebP image.

Hence, the WEBP lossy compression — like JPEG — is based on block prediction.

Support and Usage

Google Chrome and Opera both natively support WebP. Amongst graphics softwares, Picasa, PhotoLine, Pixelmator, ImageMagick, Konvertor, XnView, IrfanView and GDAL all natively support WebP.

Facebook has begun using WebP to lower its network costs and speed up its web site. Even relatively small efficiency wins start to add up at Facebook's scale. When people upload JPEG/JPG images, Facebook automatically makes copies in WebP format. They've now apparently begun delivering those images to people using Chrome and Opera.

Telegram too has started using WebP for it's popular stickers. The Instant Previews feature of Google Search uses WebP internally to reduce disk space used by previews.

The major problems arise when a person wants to view the image in software other than a web browser or make edits to it as majority of the most popular graphics applications — including Window's or OS X's image viewer and Photoshop — can't natively handle WebP.

In October 2013, Josh Aas from Mozilla Research published a comprehensive study of current lossy encoding techniques and wasn't able to conclude that WebP outperformed JPEG by any significant margin.

However, Telegraphics has released a free plug-in that enables WebP support in Adobe Photoshop, GIMP and Paint.NET support WebP via plugins. Google has also released a plug-in for Windows that enables WebP support in Windows Photo Viewer, Microsoft Office 2010 and any other application that makes use of Windows Imaging Component.

Benefits and Statistics

Google's WebP documentation claims:

WebP lossless images are 26% smaller in size compared to PNGs. WebP lossy images are 25-34% smaller in size compared to JPEG images at equivalent SSIM index. WebP supports lossless transparency (also known as alpha channel) with just 22% additional bytes. Transparency is also supported with lossy compression and typically provides 3x smaller file sizes compared to PNG when lossy compression is acceptable for the red/green/blue color channels.

Conversion to WebP

WebP's documentation provides access to a pre-compiled software for converting PNG and JPEG images to a WebP image. You can read more about it and download it from here. Here is the link to an online converter which accomplishes the task without downloading any software.

Making WebP Stickers For Telegram

We have talk about WebP enough. Let's bring our knowledge of WebP to some constructive and creative use. We will look at how to make stickers for Telegram from a JPEG image and convert it to a .webp file. We're going to make our sticker from the following image.

Original JPEG Image

We would be making use of Photoshop to make the image background transparent. We would do that by choosing 'Background Eraser Tool'. We would also crop the image since it is quite big!

Cropped and Transparent Image

Next we will select the current layer and apply Blending Options (stroke) on it and select white color. Also, ew need to select Drop Shadow to create a subtle shadow effect and I save it in PNG format.

Stroked with White Outline and Drop Shadow

Finally we will use the online converter to convert the image to .webp format and our sticker is ready!

Sticker in Telegram

You can make many other stickers in a similar fashion for distribution amongst your friends on Telegram.

Conclusion

WebP is an emerging image compression format and being backed by Google, Facebook, Opera and Telegram has certainly boosted its popularity. It's a format that already has a healthy collection of fans along with as detractors.

However, being able to pack the goodness of GIF and PNG into one format with a reduced image size will continue to tempt web developers to create smaller and richer images.

And if that helps make the whole web faster, we all win.