WordPress is shifting from PNG & JPEG to WebP and you should too!

Steve Miller
5 min readApr 8, 2022
WebP Logo
WebP Logo

Since version 5.8 WordPress supports the image format WebP which is on average about 30% smaller than JPEG & PNG at the same quality, supports transparent backgrounds, and also allows animation like GIF files.

And with WordPress 6.0 the integration will be extended even further.

In the future, JPEG images will be automatically converted to WebP images. But first, let’s talk about what WebP is and where we are today.

Now what is WebP at all and why should I use it?

WebP was co-developed by Google and was first introduced in 2010. It is an image format that can be compressed in both lossy and lossless modes. Using mixed compression formats to create images allows you to create richer images with smaller file sizes than other formats.

WebP essentially combines the characteristics of other image formats (JPEG, PNG, and GIF) in a surprisingly seamless manner. WebP offers file sizes that are roughly 30% smaller than JPEG without sacrificing quality. It also has transparency, similar to PNG, and the ability to animate images, similar to GIF.

Speed comparison of WebP, JPEG & PNG
Smashing Magazine’s “The WebP Manual” by Jeremy Wagner

You’ve probably seen WebP images before. When you open YouTube, you’ll notice that all of the thumbnails are WebP thumbnails. If you were to open the Facebook app, the same applies.

According to the file name extension directory Dot What?, WebP is pronounced “ weppy “ as in English.

At present, WebP is becoming the next-gen image format. Load times have become increasingly important in recent years. As we all know, Google penalizes websites with poor load times. Here WebP can help you to reduce the loading time by the smaller file size.

Moreover, you won’t have to deal with different image formats in the future. WebP combines all the advantages of the existing formats.

WebP vs PNG vs JPEG vs GIF
WebP vs JPEG vs PNG vs GIF by author

So in a nutshell, here are the main benefits of using WebP over JPEG or PNG:

  • Better user experience due to smaller loading times
  • Better ranking since Google and other search engines do consider site speed as a ranking factor
  • Less bandwidth consumption which is especially interesting for visitors from countries with slow and costly connections
  • and yea, don’t forget about the environment — smaller file sizes and less traffic will reduce CO2 emissions

How to use WebP in WordPress?

Since WordPress 5.8, the WebP format is natively supported by WordPress. This means that you can upload and insert WebP images in the media library as usual. If you still have older versions of WordPress in use, then plugins can help you. Since WordPress currently only officially supports version 5.9+, an update would be advisable anyway.

With the next major release of WordPress 6, the integration of WebP is now to be expanded once again.

Essentially, two major changes are to be introduced:

  • WebP images should be generated automatically when you upload a JPEG to the media library. The newly generated image will then be saved next to the original JPEG image.
  • Based on this, WebP images will be displayed by default in the frontend.

So if you upload a JPEG image, it will be automatically saved in WebP and displayed in the frontend as well.

What about my current media library?

Currently, there is no automatic conversion from the existing media library foreseen. If you still want to convert your existing JPEG, GIF, and PNG images to the WebP format, there are various plugins for this, as for almost everything in WordPress.

One that we have tested and used for our existing websites is WebO Converter for Media. This plugin converts all JPEG, PNG, and GIF images to WebP format on demand. You simply define the format to convert, the output quality, and exclude certain directories if desired. Then the plugin does the rest. Over 100 000 installations and more than 500 5 star ratings speak for themselves.

Are there also downsides using WebP in WordPress?

No advantage without a disadvantage, right?
Although WebP was released back in 2010, some browser vendors waited a long time to implement it. WebP was not even supported in some of the most popular browsers until 2017. Since then, everyone has jumped on the bandwagon, but there are still many old browser installations floating around.
According to CanIuse.com, about 93.21% of all browsers worldwide are currently compatible with WebP.

Browser by versions that support WebP
Browser by versions that support WebP by CaniUse.com

A little more than 6.5 percent may sound a lot at first, but if you look at the browsers, it seems less bad. Mainly affected are users of Internet Explorer and old iOS versions with a corresponding Safari version. The visitors behind them should not be of interest to most modern websites anyway.

In summary

If you use WordPress, then you probably can’t get around WebP from version 6.0 onwards. And that’s a good thing. WebP seems to be the new standard for images on websites. The smaller file size and the associated faster loading times as well as the possibility to have transparent and animated images even lossless in one format makes things easier.

Already today nothing speaks against WebP and with the mentioned plugins a WordPress site and its existing media library can be converted to WebP quickly and easily. So go for it!

Originally published at https://sandbox.page on April 8, 2022.

--

--

Steve Miller

In love with Technology since childhood. Meanwhile father of two future nerds. Believer in the revolutionary power of technology in all aspects of our lives.