Image 是否有适合全屏缩放背景的最佳图像大小（宽度x高度|文件大小）？

我正在建立一个公文包网站，它依赖于在浏览器窗口中以全尺寸显示美丽、高质量的照片

我使用的是CSS3背景大小：封面标签和这个小片段的组合，它们可以在更高分辨率的图像中替代更高分辨率的设备：

根据那篇文章，我需要至少三个版本的图像，一个是1x，一个是1.5x，一个是2x，但这些都有可能变得绝对庞大

是否有一个最佳大小的图像，它将规模足够大的屏幕上，但没有一个巨大的文件大小和下载时间

我是否应该考虑用户在页面上停留的时间越长，质量越高？因此，首先加载低质量/分辨率的图像，然后替换为高质量的图像？

根据这张1800 x 1080的图像，如果您想安全起见，我认为它的尺寸是合理的。也许你的目标受众使用更大的屏幕，如果可以的话，你应该找到答案

我不会像你描述的那样做渐进式增强。每个用户都必须下载图像3次

相反，您可以使用媒体查询来检查用户屏幕大小，如图所示。因此，用户正在下载对他们来说意味着什么

---

编辑：这也是一个有趣的方法。

您将需要一些强大的主机！您是否考虑过将图像切割成不同分辨率的瓷砖？您可以先显示低分辨率，然后允许用户根据需要切换到高分辨率，或者放大部分图像（因此您只加载要显示的平铺，而不是整个图像）。有一种特定的图像类型，在最初加载时，它的质量很低，但用户在页面上的时间越长，质量就越高。现在好像没怎么用了，不过我看看能不能帮你找到一个链接。给你。这种技术被称为“交错”，需要应用到图像本身：我最近对我的上一个个人网站（）也有同样的反应。因为我想触摸所有我能触摸到的设备，所以我最终得到了一个独特的背景，它的宽度是2000px，并且被压缩了很多。