如何解决使用 <picture> 在 IOS 14 Safari/Chrome 上加载 WebP 图像不起作用
我最近将客户端站点 (WordPress) 上的各种图像转换为 WebP 格式,并且我正在使用“图片”标签在下一代浏览器版本上显示它们,并带有可用的后备图像。
示例:
<picture>
<source srcset="my-folder/my-image.webp" type="image/webp">
<source srcset="my-folder/my-image.png" type="image/png">
<img src="my-folder/my-image.png" srcset="my-folder/my-image.png">
</picture>
在桌面上,WebP 格式似乎可以在支持 WebP 的浏览器上正确加载,而在不支持的浏览器上可以正确加载后备图像。
当使用 Browserstack.com 在 Android 设备上测试时,WebP 图像似乎也正确加载,我看到 webP 图像正在从开发工具的网络选项卡加载。
但是在 iPhone 12 Pro Max / iOS 14 上的 Safari 上测试时,它似乎正在加载后备图像。
当我尝试在自己的 iPhone 设备(iPhone 11 Pro Max/iOS 14.4)上打开 Chrome 或 Safari 上的图像时,它似乎也在打开后备图像。
根据 https://caniuse.com/webp WebP 似乎受 iOS Safari(从 14.4 起)和 Chrome 支持。
我做错了什么吗?我是否需要为 iOS 设备以不同方式显示它们?还是 Safari/Chrome IOS 仍然不完全支持 WebP 图像?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。