Safari should get the originals. If that does not work it is probably related to a CDN conflating caches. Try the “CDN friendly” mode.
See also:
https://ww.wp.xz.cn/support/topic/trying-to-load-webp-in-safari-and-404ing-images/
and
https://ww.wp.xz.cn/support/topic/webp-format-not-compatible-for-safari-osx/
And check out this test page, which uses the same techniques as WebP Express does:
http://toste.dk/rh.php
When visiting the test-page with Safari, you should see two images with the “JPG” label over them.
When visiting the test-page with a browser that supports webp, you should see two images with the “WEBP” label over them.
In case you do not see two images, there is something terribly wrong, and please report! No-one has yet reported that scenario.
And see https://ww.wp.xz.cn/support/topic/this-plugin-with-caching-plugin/ on how WebP Express sends the originals to browsers that doesn’t support webp.
Also, try to click the new “Live test” buttons (new in 0.15.0). These also examines how requests from browsers that does not support webp are handled – and complains if a webp is returned.
Thread Starter
GATHH
(@golfasian)
Thank you very much. I will test out those options.
Thread Starter
GATHH
(@golfasian)
I think switching to the CDN friendly option worked: https://www.golfasian.com/
I can see that you are in fact on a CDN.
I get see these response headers for images:
server: keycdn-engine
x-cache: HIT
Swithing to CDN friendly mode is the cure.
However, it doesn’t seem you have done so?
There seems to be no html altering. Or perhaps your HTML is cached?
And it seems the CDN has already gotten its cache conflated.
The following URL returns a webp – also in browsers not supporting webp:
https://duo.golfasian.com/wp-content/uploads/2016/10/bintan-gc-300×200.jpg
Once you got Alter HTML working, you must clear your CDN cache.
Alter HTML should convert “img” tags to “picture” tags. So in the source code, you should see a bunch of “picture” tags. I see none
Thread Starter
GATHH
(@golfasian)
Hi Rosell,
You are right, there are no picture tags, which is odd.
We are using WP Rocket + Imagify (with Webp also turned on), Sucuri and Key CDN. Perhaps I should use either Imagify OR WebP Express?
Thread Starter
GATHH
(@golfasian)
Note that I have also cleared WP Rocket cache, Sucuri cache, and purged the CDN cache. Still no picture tag.
And did you activate Alter HTML in WebP Express settings?
I did not know of Imagify. I’m checking it out now.
Thread Starter
GATHH
(@golfasian)
Yes I activated Alter HTML in WebP Express.
Here are our WebP Express settings: https://ibb.co/6PB7Hv5
And here are our Imagify settings: https://ibb.co/zf0JZ41
Thank you
Thread Starter
GATHH
(@golfasian)
Also clicking the live-test button returns all green results. Everything works fine there.
I do see picture-tags on this page:
view-source:https://www.golfasian.com/golf-holidays/japan/kansai/
But not all images have been converted to picture tags.
It is probably because the images are on a different subdomain.
Those on “uno.golfasian.com” does not get replaced.
Those on “edge.golfasian.com” does get replaced.
You could try to select “Use content filtering hooks” instead of Output buffering. I’m guessing that the plugin that changes image urls to point to uno.golfasian.com gets there before WebP Express does.
It is a planned feature to allow one to specify cdn domains so it will work even when WebP Express gets the CDN urls.
I see that you haven’t cleared the CDN cache yet. You should do that ASAP to avoid blank images in Safari
Oh, what do you know.
I see that KeyCDN actually supports varied image responses: https://www.keycdn.com/blog/webp-caching
You just need to enable it using the “Cache Key WebP” option:
https://www.keycdn.com/blog/webp-caching#enable-the-feature-for-your-zones
You do not need their “image processing” product.
