谷歌的页面速度测试认为我应该优化我的图像超过目前的图像大小

Question

我真的很困惑这个，因为它似乎无法做到。

当通过GTMetrix运行我的网站时，我通过了很好的但是通过谷歌页面速度见解它坚持我的图像可以更多地进行优化，例如：

压缩和调整大小mysite.com/...ets/img/homepage/my_image.jpg可以节省78.5KiB（减少94％）。

有问题的图片是65KiB，所以谷歌认为我可以剃掉另一个78.5，我不知道。

我使用jquery unveil并使用视网膜功能也可能是问题所在？

此外，我还尝试将Google提供的图片作为压缩版本下载，但这些图片的尺寸已经改变，如果我将它们按照预期尺寸放置，看起来会很糟糕。

真的很困惑，任何帮助都会受到赞赏。

由于

Answer 1

在继续优化Google Page Speed图像之前，您需要先区分几件事。

1. 针对不同平台（桌面和移动设备）优化图片
2. 图片针对实际尺寸进行了优化。
3. 图像报告只能是“压缩和调整大小”和“压缩”。压缩意味着你需要做一个压缩部分，另一方面压缩和调整大小意味着你需要为适当的平台使用适当大小的图像。

根据您正在查看的报告（桌面或移动设备），您的项目“压缩和调整大小mysite.com/...ets/img/homepage/my_image.jpg可以节省78.5KiB（减少94％）。”需要减小尺寸和压缩尺寸或减小尺寸。使用CSS调整图像大小的边距约为20％，因此如果您获得100x100px图像，则可以使用CSS将其调整为大约120x120px，而无需获取该项目的报告（即如果您还在物理上对其进行了优化）。要在Chrome中进行检查，请检查图像并选中元素选择器中的“自然”大小。

您可以通过以下几种方式解决这个问题：

1. 媒体查询（请注意，在这种情况下您必须使用背景图片）
2. Srssets
3. JS

Answer 2

根据您使用的图像压缩包，您可能会得到不同的压缩结果。我注意到有时谷歌的Page Speed能够比我能够进一步优化图像（有时候不是！）

您的网页是否有实时网址？甚至是图像？它有助于能够看到它并进行比较！