图片压缩的核心结论是：照片类图片优先用有损压缩的 JPEG 或 WebP，图标和截图类图片用无损压缩的 PNG 或 SVG；网页用图通常把宽度控制在 1920px 左右就够，压缩前保留一份原图备份。掌握有损与无损的区别、格式的适用场景，以及分辨率、质量参数的含义，你就能在体积和画质之间找到平衡。
图片压缩为什么值得做
图片通常是网页体积中占比最大的资源类型，一张未经压缩的高清照片可能达到 5-10MB。经过合理压缩后，它可以在几乎不损失画质的情况下缩小到 500KB 以内。这个差距直接影响页面加载速度、服务器带宽成本，同时对 SEO 也有积极影响。所以压缩不是可选项，而是发布图片前的常规步骤。
有损压缩与无损压缩的区别
图片压缩分为两种类型：有损压缩和无损压缩。
有损压缩会删除一些人眼不易察觉的图像信息来减小文件大小，适合照片和复杂图像。常见的 JPEG 格式就使用有损压缩。它的特点是压缩率高，但每次保存都会累积损失，反复编辑同一张有损图会导致画质持续下降。
无损压缩保留所有原始数据，只是通过更高效的编码方式来减小体积。PNG 格式是典型的无损压缩格式，适合图标、截图等需要保持清晰边缘的图片。它的体积通常大于同等内容的有损压缩结果，但画质完全不变，适合需要反复编辑或要求像素精确的场景。
选择哪一种，取决于图片内容和用途：色彩连续、细节丰富的照片用有损；线条清晰、色块单一的图形用无损。
常见格式怎么选
不同格式对应不同的压缩方式和适用场景，你可以按下面的对应关系选择：
- JPEG：有损压缩，适合照片和复杂图像，兼容性最好。
- PNG：无损压缩，适合图标、截图、需要透明背景的图片。
- WebP：同时支持有损和无损两种模式，适合网页用图，能在同等画质下得到更小的体积。
- SVG：矢量格式，适合图标和简单图形，缩放不损失清晰度。
照片用 JPEG 或 WebP，图标用 PNG 或 SVG，是通用且稳妥的搭配。
在线压缩与本地软件的区别
很多人习惯用本地图像处理软件压缩图片，但在线工具有几个明显优势：
- 无需安装：打开浏览器就能用，不占用本地存储空间。
- 跨平台：Windows、Mac、Linux、甚至手机都能用。
- 批量处理：一次上传多张图片，自动压缩。
- 实时预览：压缩前后对比，效果一目了然。
如果你的需求只是压缩体积而不做精细修图，在线工具通常更快。如果需要精细控制图层、色彩和局部处理，本地软件更合适。
分步操作：压缩一张图片
以下是通用的压缩流程，适用于大多数在线压缩工具和本地软件。
第一步，判断图片类型。问自己这张图是照片还是图形。色彩连续、有渐变和噪点的属于照片；线条清晰、色块单一的属于图形或截图。这一步决定你后面选有损还是无损。
第二步，确定目标格式。照片选 JPEG 或 WebP；图标、截图、需要透明背景的选 PNG；图标类还可以考虑 SVG。
第三步，调整分辨率。网页用图通常把宽度控制在 1920px 左右就足够了。分辨率是压缩中最容易被忽略但收益最大的一环：把一张 4000px 宽的图缩到 1920px，体积下降往往比单纯调质量参数更明显。
第四步，设置压缩质量。质量参数一般是一个百分比或 0-100 的数值，数值越高画质越好、体积越大。对照片来说，从最高质量逐步往下调，边调边看预览，找到画质还能接受的那个点即可。不同工具对同一数值的处理并不完全一致，所以以预览效果为准，不要迷信某个固定数字。
第五步，对比预览。利用压缩前后的对比功能检查细节，重点看边缘、文字和暗部，这些地方最容易暴露压缩痕迹。
第六步，导出并保留原图。压缩前留一份原始文件，压缩后的版本用于发布。这样后续需要重新压缩或换格式时，不会从已经损失过的版本二次损失。
压缩时的常见错误
- 对同一张 JPEG 反复保存：每次保存都会累积损失，应从原图重新导出。
- 用 PNG 存照片：无损压缩对照片的体积收益很小，文件会明显偏大。
- 只调质量不调分辨率：分辨率往往是体积的主要来源。
- 忽略透明通道：需要透明背景时用 JPEG 会丢失透明信息，应改用 PNG 或 WebP。
- 压缩后不检查：文字和细线在压缩后容易出现模糊或色边，导出前务必看预览。
适用与不适用的场景
适合压缩的场景：网页配图、社交媒体发布、邮件附件、移动端应用资源、需要控制带宽成本的任何场合。
需要谨慎的场景：需要反复编辑的素材，应保留无损版本；印刷用途对分辨率要求高，压缩目标与网页不同；需要精确像素和清晰边缘的界面素材，优先无损或矢量格式。
常见问题
问：有损压缩和无损压缩能混用吗？
答：可以。你可以先对照片做有损压缩得到小体积版本，同时保留一份无损或原始版本用于后续编辑。关键是不要让有损版本成为唯一副本。
问：JPEG 和 WebP 该选哪个？
答：两者都支持有损压缩。WebP 通常能在同等画质下得到更小的体积，适合网页用图；JPEG 兼容性最广，适合需要被各种软件和平台读取的场合。如果目标环境支持 WebP，优先考虑它。
问：压缩后画质变差怎么办？
答：先确认是否从原图重新导出，而不是在已压缩版本上二次压缩。然后适当提高质量参数，或改用无损格式。如果图片本身分辨率远高于展示需求，先降分辨率往往比提高质量更有效。
问：为什么 PNG 压缩后体积还是很大？
答：PNG 是无损压缩，保留全部原始数据，对照片这类色彩连续的图像收益有限。如果图片是照片且不需要透明背景，改用 JPEG 或 WebP 会有明显改善。
问：网页图片分辨率设多少合适？
答：网页用图通常把宽度控制在 1920px 左右就足够了。具体还要看页面实际展示尺寸和是否需要适配高分辨率屏幕，按实际展示需求设定即可。
用好图片压缩，既能提升网站加载速度，也能节省服务器带宽成本，对 SEO 也有积极影响。