There’s a tech war going on right under our noses. Not the robot-skeletons kind, but the most-accepted format kind, in the vein of Playstation vs Xbox or Betamax vs VHS. This particular format war involves us all, and chances are you’ve seen its combatants without even knowing. We’re talking about the next generation of web image format, and at the moment WebP is pulling ahead. But that only raises more questions, namely “what is WebP?” and “what’s wrong with JPEGs?”

What you need to know about the new google image format WebP
Illustration by OrangeCrush

Thanks to its owner Google, the WebP image format has become a hot topic recently. It’s becoming accepted on more and more devices—much to the chagrin of competitors JPEG 2000 and JPEG XR—and is on track to be the new default web image format. And despite all the convoluted technical details, for anyone who posts pictures online, WebP is a big deal.

So in this guide, we explain everything you need to know, what it is, how to use it and why you should care. We’ll explain the WebP pros and cons and then show you how to convert your other image formats.

What is WebP?

Disregarding all the recent buzz, WebP (colloquially pronounced “weppy”) is actually quite old. It was first announced back in 2010, and has since been upgrading and improving until its current state. It’s become a popular topic lately as it pulled ahead in the next-gen image format wars: as of this writing, it’s supported on Chrome, Microsoft Edge, Firefox, Opera and most recently Safari.

WebP logo

To truly understand what makes WebP unique, it helps to first understand all the image file formats and their differences. But to speed things along in this article, we’ll jump straight to WebP’s main selling point, compression.

If you’re unfamiliar with the term, compression refers to encoding the file’s data into fewer bits, or digital data pieces, than the original. There are two main types of compression: lossless (the image quality stays the same as the data size goes down) and lossy (the image quality goes down slightly as the data size goes down significantly). If you want to know the “magic” of how you can reduce a file’s size without affecting the quality, this guide explains it well.

To put it simply, WebP images are usually smaller than their counterparts, but with the same quality, thanks to their superior compression. That means using WebP images for your own site will (usually) make it run faster and reduce your data storage at the same time.

Sample of JPEG to compare against WebP image format
JPEG version, 562 KB. 3D design by EFL.
Sample of WebP image format to compare against JPEG
WebP version, 416 KB—that’s 25% smaller. Can you tell the difference?

How much smaller? According to Google’s own data, WebP lossless compression is 26% smaller than PNGs and its lossy compression is 25-34% smaller than JPEGs. For sites that use a lot of images, switching over could make a significant impact and shave valuable milliseconds of loading time, especially on mobile.

The other main advantage of WebP is its versatility—it incorporates both transparency and animation. That’s a big deal because typically you don’t find those features in the same format: before WebP, you’d have to use PNG for transparent backgrounds and GIF for animations, and nothing supported both at the same time.

That stellar performance, combined with the vote of confidence from Google, really paves the way for WebP becoming the new default web file format.

WebP pros and cons

Impressive as it is, WebP isn’t quite ready to be “the one.” For now, take a look at the WebP pros and cons and see if it’s right for you and your needs.

Pros

  • Faster loading times—Due to the smaller file sizes, pages with WebP images load faster. That’s a huge boost to site enjoyment: according to Website Builder Expert, every second delay in loading reduces visitor satisfaction by 16% and one in four visitors will abandon you completely if it’s not loaded in 4 seconds.
  • Less media storage—WebP’s enhanced compression also means less storage space. This is crucial for sites that host a large amount of images, and could even save you money on your web hosting.
  • Transparency and animation—As we mentioned above, WebP is the only image format that supports the transparent backgrounds of PNG and the animation capabilities of GIF, not to mention it outshines JPEG’s compression.
Chart comparing WebP image format quality to its competitors
Graph comparing image format file sizes to quality, measured as structural similarity (SSIM). Via Johannes Siipola.

Cons

  • Not supported by all browsers—Although WebP has the lion’s share of browsers, there are still some that don’t support it (Internet Explorer is slow to adopt it, which is on brand for Internet Explorer). There is a workaround that involves creating a fallback image in HTML, but creating a whole other file as a backup sometimes negates all the extra storage space you save using WebP in the first place.
  • Quality is still reduced—Not so much a disadvantage of WebP as a disadvantage to all lossy compression, the quality of your image is still reduced. For most people, the amount is negligible, but for visual sites like photography or graphic design portfolios you want your visual quality at maximum.

How do you convert to WebP image format?

If you’re already sold on the smaller file sizes, naturally you’ll need a WebP image converter to change all your images. A lot of software supports WebP so you can create them straight from the source (Adobe Photoshop and Sketch, to name a few) but if you have preexisting images or they come from a place that doesn’t support WebP, you’ll need an image converter.

There’s plenty to choose from, and in fact most succeed at the basic task of converting a file to WebP. One example is XnConvert.

Screenshot of XnConvert.
Via XnConvert.

XnConvert works for Windows, Mac and Linux. It’s also free for personal use, although you have to buy a license for company use. In addition to WebP, it supports JPEG, JPEG 2000, PNG, TIFF, GIF, OpenEXR, raw camera data and hundreds of others. There’s plenty more features as well: batch conversions, rotating, adding watermarks, adding text and light image adjustments like tweaking shadows and brightness.

Of course, you can always go with an even simpler option if you just want to convert a handful of images. Ezgif is a free online WebP converter, the operative words being free and online. You won’t find the more advanced features of XnConvert, but if your concerns are speed and convenience, it has you covered.

Conclusion: WebP trails

Considering the great effect on loading times, virtually any site or social media can benefit from WebP format. As we mentioned in the WebP pros and cons, the one glaring red flag is that not all browsers use it—be sure to double-check with your usage analytics to see which browsers your visitors prefer and whether switching to WebP will affect them.

If you ‘re still unsure which image format is right for you, you can always hire a professional web designer to handle it for you. Just mention that site speed and loading times are a high priority and they’ll take it from there.

Want to find a designer who can create all the right file types?
Our designers can do that!