WordPress

How to add AVIF and WebP images to your site

Published on 13. April, 2021

How to add AVIF and WebP images to your site

We have already written about how important are WebP images, and how the new AVIF format file is going to be better than WebP. But the most important question remains: how do I add AVIF images to my site? How do I add WebP images to my site?

The answer is ShortPixel.

How to serve WebP or AVIF from WordPress

If you have a WordPress site, and you probably do as more than 40% of all websites use WordPress, you have multiple ways to serve WebP or AVIF files.

ShortPixel Image Optimizer

ShortPixel Image Optimizer (SPIO) is a plugin that optimizes your physical image files on your server. It only works locally, so it compresses physically the images that you upload to your site. To learn more about how SPIO works, click here.

SPIO allows to generate WebP files, but that’s not enough, because you have to serve them to your visitors. Luckily, ShortPixel IO has two WebP delivery methods. You can read all about them here: How to create and serve WebP files using ShortPixel Image Optimizer
Also, very soon, SPIO will add support for AVIF images as well.

ShortPixel Adaptive Images

SPAI logo

ShortPixel Adaptive Images (SPAI) downloads your images, resizes them, optimizes them, stores them on ShortPixel’s CDN, and it replaces the image URLs when your front pages load, on the fly. It doesn’t edit any of your original image files. To learn more about how SPAI works, click here.

SPAI also allows to generate and serve WebP files, but in a much easier way. Just enable a setting and that’s it! Here you have the step-by-step guide to install and use ShortPixel Adaptive Images (SPAI).
Oh, and also very soon, SPAI, just as SPIO will have AVIF support too.

Autoptimize

How to add AVIF and WebP images to your site Ursus Minor

One of the best and most popular WordPress optimization plugins is Autoptimize. We almost always recommend it when we assess the performance of your website.

Among its useful features, it has an image optimization component that is an alternative to ShortPixel Adaptive Images, as is powered by ShortPixel. To know more about the differences, check our article ShortPixel Adaptive Images vs. Autoptimize’s “Optimize images” option.

Autoptimize allows to serve not only WebP, but also AVIF to every supported browser. This means that it will serve AVIF images to the few browsers that support it, WebP to almost all the rest of browsers, and the original format to those browsers that don’t support neither WebP nor AVIF.

Download here Autoptimize.

How to serve WebP or AVIF from non-WordPress sites

But what if you don’t have WordPress? We also got your back with many tools for many purposes, all of them using our powerful image optimization API.

ShortPixel Website Optimizer

How to add AVIF and WebP images to your site Ursus Minor

ShortPixel Website Optimizer offers a straightforward web interface that you can have available on any PHP website (Magento, Joomla, Drupal, etc.). You can optimize your images and create WebP and AVIF files on demand. Check it out here: ShortPixel Website Optimizer

ShortPixel Command Line Tool

How to add AVIF and WebP images to your site Ursus Minor

If a web interface is not what you want, you can also operate the optimization from command line, and create AVIF and WebP, as long as you have PHP installed. That means you can configure cron jobs or other task schedulers to run ShortPixel. Check the ShortPixel Command Line Tool here.

Reducer and Post-Reducer API

How to add AVIF and WebP images to your site Ursus Minor

Our services can be accessed through a powerful and easy-to-use Reducer API that covers all optimizing needs with just one method call. It allows you to shrink an image based on the URL of the image. The image has to be available online in order to be shrunk via this API, and you can call it from any programming language that allows you to send an HTTP POST request.

If your image is not accessible online, you can upload it to our servers via a POST HTTP call, and again, you can call it from any programming language that allows you to send an HTTP POST request.

For more information, and to see all the parameters you need to use to get WebP and AVIF, please consult the Developer API documentation.

ShortPixel PHP Client Library

How to add AVIF and WebP images to your site Ursus Minor

Our PHP Client Library features quick configuration and an easy fluent syntax for accessing our services, thus greatly reducing your implementation time. Just integrate it with your site so your images are also generated in WebP format, and you’ll be good to go!

Here’s the official PHP Client Library documentation.


WordPress or non-WordPress, serving WebP or AVIF files is very easy with ShortPixel! Here’s a list of all the tools you can use. Feel free to try them out! ShortPixel Developer API and Tools Documentation

Original article Published here >

How to add AVIF and WebP images to your site

* Optimise WP Website Images with ShortPixel – Super Fast Website, Optimised SEO, WordPress Plugin (Referral Ad)