WebP conversion and fallback support

I try to use WebP conversion and a fallback support.
How to achieve using PHP?
https://www.convertapi.com/doc/php-library

Important:
I need to use rewrite rules option for WebP display on your site. Both of these options will provide fallback support, so if a visitor is using a browser that doesn’t support WebP images, the optimized JPG or PNG versions will be served instead.

An example:

 // Code snippet is using the ConvertAPI PHP Client: https://github.com/ConvertAPI/convertapi-php

    ConvertApi::setApiSecret('XXX');
    $result = ConvertApi::convert('webp', [
            'File' => '/path/to/my_file.png',
        ], 'png'
    );
    $result->saveFiles('/path/to/result/dir');

What exactly is your question? Are you having issues with that code? The code you show there should work just fine and give you a PNG file.

Be advised that HTML5’s <picture> element supports fallback support for users from webp to png/gif etc.

<picture>
    <source srcset="image.webp" type="image/webp">
    <img src="image.png" alt="Description of the image">
</picture>

If this isn’t answering the question, please clarify.

2 Likes

Yes, this is an issue. How to detect browser support for a fallback?
HTML5’s <picture> element supports fallback support for users from WebP to PNG/JPG etc.

How to solve using PHP that each current image (JPG/WebP) will be detected if we transform into WebP due to browser support?
This is HTML:

<picture>
    <source srcset="image.webp" type="image/webp">
    <img src="image.png" alt="Description of the image">
</picture>

How to solve WordPress execution using PHP as each URL should be rewritten?

1 Like

Let me see if I understand what you are really asking… If a user has a browser that does not support webp and wants to view the image, you want to detect that and send a request to the server to have PHP convert that webp image to a png/jpg so that it can serve that instead? Rather than generating both to start and letting the browser just fallback to whichever it can view?

If that is the case, I would say you have a couple options:

  1. Generate the fallback image when the initial webp image is first uploaded and keep both copies. Letting the browser do the fallback itself.
  2. If the browser doesn’t support webp it is going to request the png/jpg. At that point you can say “Oh we don’t have that generated yet, and generate it at that point, serving it back to the user.”

Ideally you would just keep both copies and let the browser decide which it wants to load.

But as @sibertius points out, both the picture and webp is pretty well supported in modern browsers. I think only old IE doesn’t support either. Which I don’t think anyone should be trying to support anyways.

Thank you for the message!