图片格式详解：JPG、PNG、WebP、AVIF、GIF、BMP 和 ICO

作者 Jenna, 网页设计，Ikonik Digital · 最后更新 2026-10-03

每种图片格式都是在文件大小、画质、透明、动画和兼容性之间做取舍。选错了格式，要么文件臃肿，要么 Logo 模糊。这篇指南讲清楚每种格式擅长什么，并给出帮你做决定所需的数据。

两种压缩方式

无损压缩会精确保留每一个像素，只是找到一种更高效的方式来记录同样的数据，原理和 ZIP 类似。一张无损图片打开再保存一千次，也不会有任何变化。PNG、BMP、GIF 和无损 WebP 都属于这一类。

有损压缩会丢弃一部分信息，专挑人眼最不敏感的细节下手：细微纹理、微妙的色差、高频噪点。结果可能只有无损文件的十分之一大，肉眼却看不出区别，但每重新保存一次，就会再损失一点。JPG、有损 WebP 和 AVIF 都属于这一类。

由此得出第一条规则：照片充满了没人会在意的噪点和纹理，适合用有损格式；带有锐利边缘、纯色块和文字的图形，每个像素都很重要，适合用无损格式。

逐个格式看

JPG（JPEG）

从 1992 年起就是照片的标准格式。有损、8 位色彩、不支持透明、不支持动画，几乎所有设备和软件都能打开。画质参数从 0 到 100 控制取舍，日常使用 80 到 85 最合适。它的弱点是低画质下会出现明显的“马赛克色块”，锐利边缘周围会有振铃伪影，而且不支持透明。浏览器以外的场景都可以用它发照片：邮件、印刷、电商平台、老旧软件。

PNG

无损，最高 16 位色彩，支持完整的 Alpha 透明，不支持动画（APNG 虽然存在但很少见）。Logo、图标、截图、示意图、图表，以及任何需要透明背景的图片，都应该用 PNG。它的弱点是体积：同一张照片存成 PNG，可能是 JPG 的十倍大。网站上的照片千万不要用 PNG。

WebP

Google 推出的网页格式，现在所有主流浏览器都已支持。它同时有有损和无损两种模式，两种模式都支持透明，还支持动画。同等画质下，有损 WebP 比 JPG 小约 25% 到 35%，无损 WebP 比 PNG 小约 25%。凡是在浏览器里显示的图片，它都是最好的通用格式。它的弱点在于浏览器以外的兼容性：老旧的桌面软件、部分邮件客户端和很多上传表单仍然不接受它。

AVIF

更新的格式，基于 AV1 视频编码。同等画质下通常比 JPG 小 50%，比 WebP 小 20%，支持透明、动画和广色域。自 2024 年起所有主流浏览器都已支持。编码速度慢，在浏览器里尤其明显，浏览器以外的软件支持也还参差不齐。当文件大小至关重要、而且你能掌控显示环境时再用它，同时准备一份 WebP 或 JPG 作为备选。

GIF

诞生于 1987 年。每帧最多 256 种颜色，只支持单色透明，支持动画，而动画正是它至今随处可见的唯一原因。用来存照片效果很差，存简单图形还行，兼容性无可匹敌。如果是静态图片，PNG 能做 GIF 能做的一切，而且做得更好；如果是动画，MP4 或动态 WebP 的体积要小得多。

BMP

Windows 的未压缩位图。文件巨大，常见用法下不支持透明，也没有压缩。它能存活至今，只是因为读取起来极其简单，这一点对嵌入式设备和老旧软件很重要。网页和存储都不要用它。

ICO

Windows 图标和浏览器 favicon 的格式。一个文件里包含同一张图片的多个尺寸，这样标签页、书签或桌面快捷方式都能选到合适的那一个。可以用 PNG 转 ICO 工具从 PNG 生成。

对比表

不同用途该选哪种格式

• 网站上的照片：WebP，画质 75 到 85；如果必须兼容非常老的浏览器，再加一份 JPG 备选。想让页面尽可能小，就用 AVIF。
• 网站上的 Logo 和图标：有 SVG 就用 SVG，否则用 PNG 或无损 WebP。
• 截图：PNG。有损压缩会让文字发糊。
• 邮件附件：照片用 JPG，图形用 PNG。不要发 WebP，太多邮件客户端处理不好它。
• 印刷：画质 95 的 JPG，或 PNG/TIFF，按印刷尺寸每英寸 300 像素准备。
• 社交媒体：JPG 或 PNG。各平台上传时都会重新压缩，所以按正确尺寸、以高画质上传即可。
• 透明背景的产品抠图：追求最大兼容性用 PNG，用于网页就选 WebP。
• Favicon：ICO，再配一张 PNG 用于手机主屏幕。

格式之间的转换

本站所有转换都在你的浏览器里完成。最常用的几种是：用于网页的 PNG 转 WebP 和 JPG 转 WebP，为了兼容性的 WebP 转 JPG 和 WebP 转 PNG，以及用于缩小导出格式选错的照片的 PNG 转 JPG。图片压缩工具支持以上所有格式，还能批量处理。