iOS设备上未显示背景图像的问题

Question

这是我网站的链接：http://oanceacezarfotograf.com

在iOS设备上显示图像时出现问题。在所有其他设备上完全没有问题时，从任何iOS设备（尝试使用我的iPhone 6和朋友iPhone 6尝试通过iOS设备访问我的网站）时，网站上都不会显示任何图像。

该网站仅使用HTML进行编码，因此所有代码均已存在。我已经尝试过这篇文章中显示的解决方案： 2017 Answer to "How to make background image fixed on iPhone6"

但是随后一切都变了，如http://oanceacezarfotograf.com/test所示。

我根本不知道如何解决这个问题或导致问题的原因。任何帮助将不胜感激。

谢谢。

Answer 1

iOS（和其他几种浏览器）不支持webP图像格式：https://caniuse.com/#feat=webp

使用受支持的图像格式（例如jpg）或使用picture标签来同时支持这两种格式：

<picture>
  <source srcset="img/awesomeWebPImage.webp" type="image/webp">
  <source srcset="img/creakyOldJPEG.jpg" type="image/jpeg"> 
  <img src="img/creakyOldJPEG.jpg" alt="Alt Text!">
</picture>

来源：https://css-tricks.com/using-webp-images/

侧面注意：还应考虑缩小图像的尺寸，它们很大（6000x4000px），即使以较高的速度连接也要花一些时间来加载。