"这张图到底存 JPG 还是 PNG？听说 WebP 更小但兼容性不好？AVIF 又是什么？SVG 和位图有什么区别？"——每次导出图片都在格式选择上浪费时间。
本速查表按"一句话决策"逻辑帮你秒选格式：照片→JPG，透明图→PNG，网站图→WebP，动图→GIF/WebP，图标→SVG，追求极致小→AVIF。掌握这个口诀，90% 的场景不再纠结。
01 六大主流格式一句话定位
JPG（JPEG）：有损压缩之王。最适合照片和色彩丰富的图像。支持 1600 万色，不支持透明度。文件小、兼容性最好（100% 浏览器和设备支持）。缩写 .jpg 和 .jpeg 完全相同。
PNG：无损压缩标准。最适合需要透明背景的图像、截图、文字图、图标。支持 Alpha 通道（半透明）。文件比 JPG 大 3-8 倍。PNG-8（256色）和 PNG-24（1600万色）两种模式。
WebP：Google 开发的现代格式。同时支持有损和无损压缩、透明度、动画。比 JPG 小 25-35%，比 PNG 小 26%。所有现代浏览器已完整支持（IE 除外）。2024 年起可放心用于 Web。
GIF：只支持 256 色的古老格式，但支持帧动画。适合简单动画、表情包。不适合照片（色彩严重不足）。文件大。正在被 WebP 和 APNG 取代。
SVG：矢量图格式，本质是 XML 代码。无限缩放不模糊。最适合图标、Logo、插图、数据可视化。不适合照片。文件极小（通常 <10KB）。可以用 CSS/JS 控制。
AVIF：AV1 视频编码衍生的图片格式。压缩率最高——比 WebP 再小 20%+。支持 HDR、广色域、透明度。浏览器支持率已超 90%（2024）。缺点是编码速度慢。
02 按场景速查：什么场景用什么格式？
产品照片/人像→JPG（文件小、色彩好）。如果追求极致小→WebP。网站英雄图/横幅→WebP（现代浏览器性能最优），回退 JPG。
Logo/图标→SVG（缩放无损），低版本回退 PNG。截图/文字图/UI 设计稿→PNG（文字边缘锐利、无压缩噪点）。
透明背景产品图→PNG-24（标准选择）或 WebP（更小文件）。电商详情页→JPG 质量 80-85%（在清晰度和加载速度间取最优平衡）。
表情包/简单动画→GIF（兼容性最好）或 WebP 动图（文件更小）。高品质动图→APNG。社交媒体分享→JPG（最广泛支持、最少被二次压缩劣化）。
技术文档中的流程图/架构图→SVG（可缩放看细节），或 PNG（通用性好）。邮件中的图片→JPG / PNG（邮件客户端对新格式支持差）。
如果你实在不知道选什么：照片类 → JPG，其他一切 → PNG。这个简单规则能覆盖 80% 的场景，剩下 20% 再按需优化。
03 格式转换的常见误区
误区一：把 JPG 转成 PNG 就能提高画质。完全错误——JPG 的有损压缩已经永久丢失了信息，转成 PNG 只是用无损编码保存了已经损失的数据，文件反而变大数倍但画质没有任何提升。
误区二：WebP 兼容性不行不能用。2024 年所有主流浏览器（Chrome、Firefox、Safari、Edge）都已完整支持 WebP。唯一不支持的 IE 浏览器已于 2022 年停止服务。Web 场景可以放心使用。
误区三：SVG 要无限放大所以万物皆可 SVG。SVG 只适合图形类内容（线条、形状、文字）。照片不能转 SVG——强制转换要么文件几十 MB，要么完全失真。
误区四：AVIF 是最好的所以应该全站用 AVIF。AVIF 编码速度慢（比 WebP 慢 10 倍+），不适合实时压缩场景。而且部分老设备解码也慢。用作静态资产预编码是最佳实践。
常见问题
WebP 和 AVIF 我应该选哪个？
2024 年建议 WebP 作为默认选择——兼容性好、编码快、生态成熟。AVIF 在追求极致文件大小时使用（如大型网站的图片 CDN）。如果你不是在做大规模图片优化，WebP 完全够用。
iPhone 拍的 HEIC 照片需要转格式吗？
上传到 Web 时需要。HEIC 是苹果专有格式，浏览器支持有限。建议转成 JPG（保持最大兼容性）或 WebP（最小文件大小）。Apple 设备在分享时通常会自动转成 JPG。
PNG-8 和 PNG-24 有什么区别？
PNG-8 最多 256 色，文件很小，适合简单图标和色块。PNG-24 支持 1600 万色 + 完整 Alpha 通道，文件较大，适合需要透明的照片级图像。Photoshop 导出时可选择。
动图应该用 GIF 还是 WebP？
WebP 动图通常比同等质量的 GIF 小 30-50%。但 GIF 兼容性更广（邮件、老系统）。社交平台分享→GIF（更通用），网站嵌入→WebP 动图（更小更快）。
矢量图 SVG 和位图有什么根本区别？
位图（JPG/PNG 等）由像素点阵组成，放大会模糊。SVG 由数学公式描述形状，任意缩放都清晰。但 SVG 只能表达几何形状和文字，不能表达自然照片——二者适用范围完全不重叠。
立即使用工具
本速查表按"一句话决策"逻辑帮你秒选格式：照片→JPG，透明图→PNG，网站图→WebP，动图→GIF/WebP，图标→SVG，追求极致小→AVIF。掌握这个口诀，90% 的场景不再纠结。