我正在建立一个投资组合网站，它依赖于在浏览器窗口中以全尺寸显示美丽，高质量的照片。
我正在使用CSS3的background-size: cover标签和这个小片段的组合，可以在更高分辨率的设备上替换更高分辨率的图像:
http://www.bdoran.co.uk/2012/08/28/detecting-and-delivering-images-to-retina-displays/根据那篇文章，我至少需要三个版本的图像，一个是1倍的，一个是1.5倍的，一个是2x的，但这些都有可能变得绝对庞大。
是否有一个最佳大小的图像，它将缩放足够大的屏幕，但没有巨大的文件大小和下载时间?
我是否应该考虑用户在页面上停留的时间越长，质量就越高?所以低质量/分辨率的图像首先加载，然后被替换为更高的图像?
根据这个浏览器统计1800 x 1080对我来说似乎是一个合理的大小，如果你想要安全的一面。也许你的目标受众使用更大的屏幕，如果可以的话，你应该找出这一点。
我不会像你描述的那样做渐进增强。每个用户都必须下载图像3次。
相反，您可以使用媒体查询来检查用户的屏幕大小，如下所示。所以用户下载的只是对他们有意义的东西。
编辑:这也是一个有趣的方法。