图像的尺寸、分辨率和质量推荐

Question

我正在寻找有关网页图像分辨率、大小和质量的好文章，尤其是关于这对当前网站的影响。

我正在为客户开发一个网站，作为艺术和设计专业的荣誉毕业生，客户坚持认为她的 7mb - 10mb 图像足以容纳她的网站，总计近 400mb。我曾尝试争论带宽限制和性能，但这些都站不住脚。

图像的标准是 72dpi，不大于您的标准屏幕分辨率 (1024x768) 和 1mb 以上（在我看来这已经太大了）。我的论点是，在页面加载时将 7mb+ 文件加载到图库中将严重阻碍用户体验，如果他们必须等待很长时间才能在页面加载之前首先将 7-10 个图像流式传输到缓存中，甚至对此进行测试使用延迟加载插件（我们不想使用闪存）和延迟加载会降低性能。

这里有人对图像大小、分辨率和质量有什么建议吗？当用户浏览图库时，我们不想失去图像的高清质量（显然我们必须先对它们进行缩略图）？

Answer 1

我之前已经阅读过指南（当我们仍然使用 1Mbps 或更少的连接时）并且到目前为止一直遵循这些指南：

• 高分辨率图像不应大于 1.5 - 2MB。让它这么大就像比网页内容本身还大。尝试检查http://deviantart.com，了解他们如何在其网站中放置大照片，并使用 EXIF 检查图像属性（如果有）
• 尺寸应该足以在浏览器中查看（并避免滚动）
• 压缩率有待测试。这是根据具体情况而定的，没有适合每个人的设置都是相同的。高质量、高压缩而没有明显的质量损失是网页设计的一种实践。
• JPEG 最适合图像，PNG 最适合布局，GIF 最适合图标。
• 尝试在浏览器空闲时使用 JavaScript 在后台加载图像。这样，它们就会在用户知道之前就已存在于缓存中。
• 更多关于网页设计，避免在网站本身上使用大量图形，使网站速度更快，所以我们只等待图像。