摘要：未优化的图片最多可占页面总体量的 75%。压缩它们可以把加载时间减半，而不会带来可见的质量损失。
图片压缩是大多数网站能做的单项收益最高的优化。根据 HTTP Archive 的数据，图片占普通网页总字节数的 40% 以上。在电商店铺和作品集这类图片密集的网站上，这个比例会超过 75%。每一个不必要的千字节都在直接拖慢页面加载速度、损害核心网页指标得分，并把您的网站推向 Google 搜索结果的更后面。
自 2018 年起，Google 就把页面速度列为移动端的直接排名因素，2021 年又通过核心网页指标进一步强化。最大内容绘制（LCP）指标衡量主要内容的加载速度，它受图片文件体积的影响极大。LCP 低于 2.5 秒的网站，排名明显优于更慢的竞争对手。web.dev 的一项研究发现，降低图片体量是修复 LCP 不达标最常见的办法。
图片压缩的原理
图片压缩通过消除冗余数据来缩小文件体积。方式分为两种：有损与无损。
有损压缩会移除人眼不易察觉的数据。在 70% 到 85% 的质量区间，压缩图与原图几乎看不出差别，文件体积却能缩小 60% 到 80%。对于体积比像素级还原更重要的网页图片而言，这正是最佳区间。
无损压缩在不移除任何图像数据的前提下缩小体积。节省幅度较小，通常为 10% 到 30%，但图像与原图逐字节完全一致。这种方式适合每个细节都很重要的图像，例如技术图表、截图和医学影像。
我们的免费图片压缩工具采用先进的有损压缩算法，在保持视觉质量的同时实现最大程度的体积缩减。您可以通过质量滑块找到最适合自己的平衡点。
图片体积为何会影响 SEO 排名
Google 衡量三项核心网页指标：LCP、首次输入延迟（FID）与累积布局偏移（CLS）。大图片会直接损害 LCP，因为浏览器必须先下载完整的图片文件，才能将它渲染到屏幕上。一张未压缩的 3MB 主图，在移动网络下可能需要 5 到 10 秒才能加载完，把 LCP 推得远超 2.5 秒的阈值。
除 LCP 之外，过重的图片还会增加页面总体量，影响整体带宽消耗以及移动用户的流量成本。Google 的移动优先索引意味着移动端体验决定您的排名。如果您的移动页面因大图片而加载缓慢，桌面端排名也会受影响。
页面速度还会影响跳出率。Google 的研究显示，当页面加载时间从 1 秒增加到 3 秒，跳出的概率会上升 32%；从 1 秒增加到 5 秒，则高达 90%。您每压缩一张图片，都在直接降低访客尚未看到内容就离开的可能性。
选择合适的图片格式
WebP 是 2026 年大多数网页图片的推荐格式。在同等质量下，它比 JPEG 小 25% 到 35%，并且同时支持有损与无损压缩。所有现代浏览器都支持 WebP，包括 Chrome、Firefox、Safari 和 Edge。
JPEG 仍是照片和多色彩复杂图像的标准格式。它的压缩比非常出色，但不支持透明。当广泛兼容性至关重要，或您的受众中有使用极旧浏览器的用户时，请使用 JPEG。
PNG 适合需要透明、锐利边缘或精确色彩还原的图像。标志、图标和截图在 PNG 格式下压缩效果很好。不过对于照片类内容，PNG 文件通常比 JPEG 或 WebP 更大。
AVIF 是最新的格式，压缩效果甚至优于 WebP。它的支持度在不断提升，但尚未普及。可以把 AVIF 作为渐进增强，搭配 WebP 降级方案，以获得最大的体积节省。
大型网站的批量压缩
电商网站、博客与媒体平台往往拥有数百甚至数千张图片，逐张压缩并不现实。我们的工具支持批量处理，让您同时压缩多张图片，并打包成一个压缩包一次下载。
对于现有网站，请优先压缩流量最高页面上的图片。使用 Google PageSpeed Insights 找出图片相关性能得分最差的页面。即使只压缩前 20 个页面，也能带来明显的排名提升。
当您向网站添加新图片时，请把压缩纳入工作流程。发布前先把原图上传到我们的压缩工具。这能避免新内容不断积累未优化图片，导致性能随时间恶化。
图片压缩的最佳实践
压缩之前，始终先把图片缩放到实际显示尺寸。一张 4000x3000 像素的照片只以 800x600 显示，就把带宽浪费在了永远不会被看到的像素上。先缩放，再压缩，才能得到尽可能小的文件。
使用带 srcset 属性的响应式图片，在不同断点提供不同尺寸。这样移动用户下载的是较小的图片，而桌面用户仍能看到完整分辨率的版本。
对首屏以下的图片启用 loading="lazy" 延迟加载。这能避免浏览器下载尚未进入视野的图片，提升首次页面加载速度。
为所有图片设置明确的 width 与 height 属性，以防止布局偏移。这对应的是衡量页面加载时视觉稳定性的 CLS 核心网页指标。
最后，为图片文件设置较长的缓存头，充分利用浏览器缓存。访客一旦下载过压缩后的图片，浏览器就会将其保存在本地。后续访问时便会从缓存中立即加载，而不需要从您的服务器重新下载。
.webp){kind=small}
.webp){kind=small}
.svg)
.svg)
