Google is at the top of the food chain on the Internet. Society influences (or dictates) a lot of what happens online. And their new image format, WebP, continues this trend. With the speed of page loading becoming more and more important (mainly because of Google Page Rank), developers and designers see image compression as the easiest way to reduce load times. Google WebP images are approximately 30% smaller than regular JPG or PNG images and maintain equivalent quality. Best of all, you don't have to worry about manually converting your images to WebP.

In this article, we'll show you how to use this new image format with WordPress, even though it's not yet supported by default.

Use Optimole to serve WebP files on WordPress

WebP, as an image format, is not supported by default in WordPress. You can upload a .webp image, but as with an SVG file, you may receive error messages. And again, as for the use of SVG files with WordPress , there is a simple workaround via plug-in.

Among the WebP services tested, Optimole stands out from the crowd. It can indeed operate with a minimum of configuration. We therefore want to explain to you how to configure it and make your WordPress installation compatible with the WebP format as easily as possible.

First, you will obviously want download and install the plugin itself . It's on the WP.org directory, and it's completely free. Since the API based service that powers it on (up to a point). While it is possible to convert traditional images to WebP on the fly using PHP, not all web hosts grant this permission to your server. If you have this permission, you can also view the plug-in WebP Express. You get a lot of control with that , but it is a system that requires more configuration to be able to run smoothly.

Once Optimole is installed and activated on your Website WordPress, you will find a new menu option on Media - Optimole .

Your Optimole API Key

Before you can access settings or configurations, you must have an Optimole account. If you have already configured one, you can click on the button I already have an API key . If not, save and send the API key by email . The basic API key account is free and you get around 5 hits on this level. If you need more than that, there are pricing tiers available.

Optimole defines a visit as " anyone who visits your if you once [. . .] Each user is counted only once. It doesn't matter what they do on your site, how many images they download or how many pages they visit; it's just a user. If they leave your site and come back the same day, they're still just a user. "

Once the measured visits are exhausted, only the WebP images stop serving. Your images themselves don't. You will find the API key in your Optimole dashboard at the very top.

Just paste it into your WordPress dashboard, and you'll be ready to start spreading WebP images with WordPress.

Your Optimole WordPress dashboards

In your WordPress dashboard, you get basic information about your WebP optimization. This allows you to troubleshoot and assess the success of this acceleration. In this way, you can change various settings.

First, you see the account associated with the API, then at the bottom of the screen, the plugin shows the latest optimized images. You can see how much smaller the WebP images served are than the original ones you uploaded to WordPress.

Then there is the tab Problems possible on top. No one likes to see the highlighted tab, but we also all need to see what conflicts might arise.

The main issue we faced is with other image compression and delivery plugins. As you can see in the image above, the Jetpack plugin works similarly to Optimole via Photon APIT , so they can bump their heads. For us, this manifested itself in the fact that no images were transmitted to the visitor. We haven't had any issues with other compression services like TinyPNG or Smush.

Using dashboards

If you want more detailed information about how your site works with WebP, the Optimole External Dashboard contains this information for you.

Instead of just 9,5 times smaller, you can see the actual size of the files being served. As well as the files themselves over a 30 day period.

You can also set watermarks in the Optimole (or WP) dashboard so that anyone who receives a WebP from your WordPress site will automatically receive your logo blazon. It's a simple process, and you get control over opacity, location, and more.

You can basically do the same from both dashboards. Either under the tab Settings of WordPress, or by visiting the dashboard external to Optimole. It all depends on what you are most comfortable with, as well as the level of data what you need at any given time.

In addition, you will be able to control the compression level, lazy loading and when / if certain images are streamed as WebP based on file names. You will find all this in the tab Settings de Media - Optimole .

pack

The best part about using WebP with WordPress websites is that you don't have to work with the files manually. No extra downloads, no extra compression time, nothing. Due to how APIs work, all processes and calculations are performed on the fly in real time. Google has really made the internet faster by using WebP rather than JPG or PNG. The main advantage, however, is that the images retain the same quality, even if their size is reduced considerably. It might be interesting of you that Google forces you to use their format to speed up your site so that it can rank you higher and the end user experience is better as well. And that's what matters in the end.