现在一整天都试图解决这个问题,但我似乎不再进步了。我已经缩小了所有资源,将它们移到了底层,异步加载的javascript,压缩图像......但桌面得分仍然只有83/100而且这都是因为图像。
使用相同图片时,移动网页得分为100/100。我的网站上的图像使用ImageOptim(适用于Mac)进行优化,我已连接Kraken.io以使用其工具优化所有图像。 Kraken.io提供了最好的结果(保存了大部分kb),但桌面不会从83/100上升。
获得分数的唯一方法是选择10%的质量(93/100)或在主页上使用较少的图像(85/100)。
我的选项已用完了......如果有人想查看结果,我正在谈论的页面是https://pendo.nl。
提前致谢。
答案 0 :(得分:0)
你在标题中回答了你的问题 - 关键部分是“相同的图像”。以this图片为例。您在桌面版本中使用320x270px,而原始图像为800x600px(通过CSS调整大小)。
Google Page Insights认为无需加载额外的字节,并且建议改进报告(除了物理优化图像)。基本上你应该做的是使用~320x270原始图像用于桌面版。
有一个CSS调整大小余量,GPI允许,我认为保证金约为20%(我从未测试过它,但它通常适用于我,如果你有100px宽度的原始图像,你可以用CSS上/下调整大小宽度为120 / 80px)。这就是为什么当你做报告时警告是“压缩和调整大小”而不仅仅是“压缩”。
有几种方法可以解决这个问题。