2026 年网页图片压缩完全指南（不损失画质）

图片压缩是绝大多数网站性价比最高的优化项，也是最常做错的一项。目标不是把文件压到最小，而是压到「在它真实显示的尺寸下仍然正确」的最小。这两者差别很大。

有损和无损不是「坏」和「好」

有损压缩会丢掉人眼基本察觉不到的细节，所以能把照片压掉 70% 甚至更多。无损压缩只是用更高效的方式重写文件，不丢任何内容，通常省 10-30%。照片基本都该用有损；文字截图、线条图、标志和图表该用无损——有损压缩会在锐利边缘产生肉眼可见的糊边。

先缩放，再压缩

压缩是减少图片内部的细节，缩放是直接去掉本来就不会被显示的像素。缩放几乎总是更划算。页面只显示 800 像素宽，却发 3000 像素的原图，大约 90% 的像素是白传的。实用起点：全宽主图 1920 像素，正文插图 1200 像素，卡片图 800 像素，缩略图 400 像素。

2026 年怎么选格式

• WebP：照片、截图和多数图形的默认选择。全平台支持，同画质下通常比 JPEG 小 25-35%。
• JPEG：需要兼容老客户端、部分邮件模板和旧后台上传字段时仍然有用。
• PNG：保留给透明背景、锐利文字和精确像素还原。不要拿它存照片。
• SVG：用于标志、图标和任何需要在所有尺寸下保持锐利的扁平插画。无损缩放，通常只有几 KB。
• AVIF：压缩率很好，但编码慢，部分老客户端仍不支持。把它当作渐进增强，而不是唯一来源。

正确看懂压缩结果

真正要看的不是「省了百分之几」，而是「最终发出去的文件有多大」。给导出结果定个预算：正文标准插图 100-200 KB，全宽主图 250-400 KB，列表或卡片里的图 100 KB 以内。如果远超预算，先检查像素尺寸，而不是继续拉低画质——问题通常是分辨率，不是压缩率。

一套五分钟流程，能避免大部分问题

1. 从原图开始，绝不用已经导出过的文件。
2. 裁剪缩放到实际显示尺寸，再留一点给高清屏的余量。
3. 照片选 WebP，锐利图形选 PNG 或 SVG。
4. 压缩后，把结果和原图并排 100% 对比查看。
5. 上传前，用上面的预算对照导出的文件大小。