你压缩图片来减小文件大小，但打开结果时却发现图片看起来模糊、柔和或有色块。这是关于图片压缩最常见的抱怨之一 — 而且几乎总有可修复的根本原因。好的压缩目标是：文件只有原来的一小部分大小，但看起来与原图相同。以下是五个出问题的原因，以及各自的修复方法。
JPEG 和 WebP 压缩的工作方式是丢弃算法认为最不明显的视觉信息。质量设置过低（低于 70%）时，算法丢弃了太多信息 — 你会看到模糊、涂抹感，或在边缘和天空/渐变区域出现 8×8 像素的色块瑕疵。
修复方法：网页照片使用 75–85% 质量。80% 是可靠的默认值，可将文件大小减少 60–80%，同时几乎没有可感知的质量损失。低于 70% 只能额外节省 5–10% 的文件大小，但会明显降低图片质量。
每次保存有损压缩的图片（JPEG、WebP），算法都会丢弃更多细节。如果你打开一张 JPEG，稍作修改，再另存为 JPEG，你已经对同一张图片运行了两次有损算法。视觉劣化会叠加 — 第一次压缩产生的瑕疵被当作图像数据处理，在第二次压缩中进一步失真。
修复方法：始终以无损格式（PNG、TIFF 或相机 RAW 文件）保存原始文件。只在最终导出步骤才压缩为 JPEG，且只压缩一次。如果你收到一张 JPEG 需要编辑，尽量减少重新保存次数 — 或接受每次重新保存都会轻微降低质量的现实。
JPEG 是为具有渐变色彩过渡的照片设计的。它对尖锐边缘、文字和纯色区域处理很差 — 将截图或 UI 设计稿压缩为 JPEG 会产生模糊的文字和图标、按钮周围的色块瑕疵。这不是质量设置问题；这是算法与内容类型之间的根本不匹配。
修复方法：截图、UI 设计和带文字的图片使用 PNG 或 WebP 无损格式。JPEG 或 WebP 有损格式只用于照片。经验法则：如果你的图片有硬边缘或纯色区域，使用 PNG。
如果你压缩一张 800×600 px 的图片，却以 1600×1200 px 显示（或在需要 2× 分辨率的 Retina/HiDPI 显示器上显示），浏览器必须放大图片。放大总会模糊 — 像素在原本不存在的地方被创造出来。这是显示问题，不是压缩问题，但它经常被归咎于压缩。
修复方法：以实际显示分辨率导出，并考虑设备像素比。对于 Retina 显示器，以 CSS 像素尺寸的 2 倍导出。CSS 中 400px 宽的卡片应使用 800px 宽的图片。压缩后不要放大。
社交媒体平台、邮件客户端和 CMS 在你上传后通常会在其服务器上对图片进行二次压缩。如果你的原始上传已经被大幅压缩，平台的二次压缩会放大已有瑕疵并添加新的模糊。Instagram、LinkedIn 和 Gmail 以激进的二次压缩著称。
修复方法：向会二次压缩的平台上传尽可能高质量的版本。反直觉地，上传更大、更高质量的文件反而能获得更好的最终效果 — 让平台执行唯一一次压缩。如果要上传到会二次压缩的平台，不要预先过度压缩。
| 使用场景 | 格式 | 质量 | 预期大小 |
|---|---|---|---|
| 网页照片（博客、作品集） | JPEG 或 WebP | 80–85% | 50–200 KB |
| 电商产品图 | JPEG | 80–85% | 150–500 KB |
| 社交媒体上传 | JPEG | 90–95%（高质量） | 500 KB–2 MB |
| 邮件附件 | JPEG | 75–80% | 50–150 KB |
| 截图 / UI 界面 | PNG | 无损 | 100–500 KB |
| 打印（300 DPI） | JPEG 或 TIFF | 90–95% | 1–5 MB |
网页使用时，75–85% 质量是最佳平衡点 — 感知上接近无损，但文件小 60–80%。打印用 90–95%。邮件附件用 70–80%。低于 70% 会在大多数照片上产生可见的色块和模糊瑕疵。
JPEG 和 WebP 是有损格式。每次保存有损压缩图片，算法都会丢弃更多细节。对已压缩的 JPEG 再次压缩会放大已有瑕疵并产生新瑕疵 — 视觉劣化会叠加。始终保留原始文件，每次需要更小版本时都从原图重新压缩。
截图包含硬边缘、文字和纯色区域 — 这正是 JPEG 的 DCT 压缩算法处理最差的内容。JPEG 会模糊尖锐边缘，在纯色区域产生 8×8 像素色块瑕疵。截图和 UI 设计稿始终保存为 PNG 或 WebP 无损格式。JPEG 是为照片设计的，不是为图形。