PNG vs JPG：该用哪种格式

两种格式的核心区别

PNG（Portable Network Graphics）使用无损压缩——所有原始像素数据都被完整保留，解压后与原始图像完全相同。JPG（Joint Photographic Experts Group）使用有损压缩——通过丢弃人眼不太敏感的高频细节来减小文件大小，这个过程是不可逆的。这一根本区别决定了两种格式各自的优势和劣势。

PNG 还支持 Alpha 通道（透明度），每个像素可以有独立的透明度值（0–255），这使得 PNG 成为需要透明背景的图形的唯一合适的光栅格式选择（在 JPG 和 PNG 之间选择时）。JPG 完全不支持透明度，透明区域会被填充为不透明颜色。

文件大小对比

对于典型的照片内容（丰富的颜色渐变、自然纹理），JPG 的压缩优势非常明显：一张 2000×1500 像素的风景照，PNG 格式约为 3–8MB，JPG 85质量约为 500KB–1.5MB，差距在 3–10 倍之间。这也是为什么数码相机默认保存 JPG 而非 PNG——JPG 可以在存储卡上存更多照片。

但对于图形类内容（大量纯色区域、锐利边缘、文字、图表），PNG 可能反而比 JPG 更小，因为 PNG 的 DEFLATE 压缩对规律性强的内容非常高效，而 JPG 处理这类内容会产生明显伪影。例如，一个 800×600 的简单图表，PNG 可能只有 20KB，而 JPG 为了避免明显伪影需要较高质量设置，可能达到 50–80KB。

画质表现对比

在相同文件大小下，对于照片类图片，JPG 的视觉质量通常比 PNG 更好（因为 PNG 为了达到同等大小需要牺牲很多颜色精度，即使在 PNG 的有损模式下）。但对于含有锐利边缘、纯色区域和文字的图形，PNG 的画质远优于 JPG——JPG 在颜色边界会产生"振铃效应"（ringing artifacts）和"块状效应"（blocking artifacts）。

JPG 对颜色的处理有一个重要特点：它将 RGB 颜色空间转换为 YCbCr 空间，然后对色度（Cb、Cr）通道进行更强的子采样（4:2:0 或 4:2:2）。这意味着 JPG 对亮度（Y）变化很敏感，但对颜色细节（饱和度、色相的细微变化）不那么精确。对于颜色准确性要求高的专业应用（如印刷、医学影像），这是 JPG 的重大缺陷。

哪种格式适合哪种场景

应该使用 PNG 的场景：网站 Logo 和图标（特别是带透明背景的）；屏幕截图和 UI 设计稿；包含文字的图形；简单的图表和信息图；需要透明背景的图片元素；用于后续编辑的中间文件；要求像素级精确的技术图纸。

应该使用 JPG 的场景：风景摄影、人像、产品照片；社交媒体的内容照片；博客和文章的配图；具有丰富颜色渐变的图像；需要在存储空间或带宽受限环境中使用的图片；数码相机和手机拍摄的照片的分享版本。

多次编辑后的质量影响

JPG 是有损格式，每次保存都会造成质量损失（即使不做任何改变，只是"打开-另存为"也会损失一定质量）。这被称为"代际损失"（generation loss）。经过 5 次以上的 JPG 重新保存，画质损失会变得肉眼可见，特别是在复杂纹理区域和高频细节处。

对于需要多次修改的图片，正确的工作流程是：保留 PNG（或 PSD、TIFF 等无损格式）作为"主文件"，每次需要发布时从主文件重新导出 JPG。这样可以确保每个发布版本的 JPG 质量都来自无损的源文件，而非从上一次的 JPG 再次压缩。

PNG 的两种颜色模式

PNG 支持多种颜色模式。PNG-24（或 PNG true color）支持每通道 8 位，共 16.7 万色，加上可选的 Alpha 通道（RGBA）。PNG-8 使用 256 色调色板，文件更小，适合颜色简单的图形，不支持完整的 Alpha 通道（只有二值透明，要么完全透明要么完全不透明）。对于需要半透明效果（如阴影、渐变透明）的图片，必须使用 PNG-24 的 RGBA 模式。

未来展望：WebP 和 AVIF

在现代 Web 开发中，WebP 和 AVIF 正在逐渐取代 PNG 和 JPG 的地位。WebP 同时支持有损和无损压缩，以及透明度，其有损压缩比 JPG 小约 30%，无损压缩比 PNG 小约 25%。AVIF 更进一步，比 WebP 还要小 20–30%，并支持 HDR 和更宽的色域。

然而，PNG 和 JPG 因其极高的兼容性（所有设备、所有软件都支持）而不会很快消失。对于公开分享的图片、电子邮件附件、打印文件，PNG 和 JPG 仍然是最安全的选择。WebP 和 AVIF 主要是网站优化的选择。