JPG vs PNG vs WebP：该用哪种格式

照片用 JPG，图形以及任何需要透明的内容用 PNG，而当你既想要 JPG 那样更小的文件、又想要 PNG 那样的灵活性时就用 WebP——正因如此，WebP 是网页的最佳默认选择。如果你只记住一条规则：照片偏向 JPG 或 WebP，边缘锐利的图形和徽标偏向 PNG 或无损 WebP。

下面是完整的选择指南、一份快速的并列对比，以及如何在浏览器里私密地在各种格式之间相互转换。

三种格式速览

每种格式都是为不同的用途而设计的，而它们之间的差别归结为两点：是否会丢弃数据以节省空间，以及是否支持透明。

• JPG（JPEG）——有损。 它会丢弃那些你的眼睛大概率察觉不到的细节，从而生成较小的文件。它在照片以及其他充满渐变色彩和色调的图像上表现出色。它不支持透明。
• PNG——无损。 它会原封不动地保留每一个像素，所以文件更大，但质量完美，而且支持透明。它天生适合图形、徽标、截图和线条画。
• WebP——现代而灵活。 它既能有损压缩、也能无损压缩，并且支持透明。在视觉质量相近的情况下，WebP 文件通常比 JPG 小约 25%–35%，并且如今约 96% 在用的浏览器 都支持它。

快速对比

	JPG	PNG	WebP
压缩	有损	无损	有损和无损
透明	不支持	支持	支持
最适合	照片	图形、徽标、截图、线条画	几乎所有网页内容
文件大小	小	大	同等质量下最小
浏览器支持	通用	通用	约 96% 的浏览器

什么时候用 JPG

当你手里有一张照片——人物、风景、美食、产品图——并且图像在展示时不需要透明背景，那就选 JPG。

照片包含大量精细而渐变的细节：从一种蓝平滑过渡到另一种蓝的天空、柔和的阴影、微妙的肤色。JPG 的有损压缩正是为这类内容量身定制的。它会去除人类视觉系统往往不会注意到的信息，于是你得到一个小得多、却仍然看起来像原图的文件。

当一张图像绝对必须能在任何地方打开时——每一种浏览器、每一台设备、每一款古老的软件几十年来都支持它——JPG 是最稳妥的通用选择。它的取舍在于：

• 不支持透明。 JPG 永远带有一个实心的矩形背景，所以对于需要置于彩色页面上的徽标来说，它并不合适。
• 不适合锐利的边缘。 在文字、截图和线条画上，有损压缩会把清晰的边界抹糊，并留下淡淡的光晕。这些内容应该交给 PNG 或无损 WebP。

什么时候用 PNG

当你需要完美的无损质量或透明时，就选 PNG。这涵盖了大量日常的图形工作：

• 必须干净地置于任何背景之上的徽标和图标。
• 截图，其中清晰的文字和界面边缘很重要。
• 带有大片纯色和硬边缘的线条画、图表和插画。
• 任何你将要反复编辑、重新保存、重新导出的图像——因为无损意味着质量在多次保存中永不衰减。

这一切保真度的代价就是体积：一张照片存成 PNG，可能比同一张照片的 JPG 大上好几倍，却看不出任何好处。所以 PNG 是处理图形的合适工具，却是处理照片的错误工具。

那透明怎么办？

在许多情况下，透明才是决定性因素。如果你图像的一部分需要透出背景——徽标周围的区域、抠出来的产品、一个叠加层——那么 JPG 立刻就出局了。你的选择是 PNG 或无损 WebP。PNG 的兼容性最为广泛；而当现代浏览器的支持已经足够时，WebP 能用更小的文件提供同样的透明效果。

什么时候用 WebP

WebP 是现代的全能选手，而对于网站来说，它通常是最佳的默认选择。由于它既能处理有损压缩、也能处理无损压缩，还支持透明，因此它可以替代 JPG 或 PNG 中的任意一个，同时生成更小的文件。

实际的好处有：

• 页面更快。 在与 JPG 相近的质量下，WebP 文件通常小 25%–35%。对于一整页都是图片的情况，这意味着更快的加载和更少的带宽消耗。
• 一种格式，两种用途。 凡是你本会用 JPG 的地方，就用有损 WebP；凡是你本会用 PNG 的地方，就用无损 WebP——包括透明。
• 支持广泛。 约 96% 的浏览器都能处理 WebP，因此对大多数公开网站来说它是个稳妥的选择。

不用 WebP 的主要理由是覆盖面：如果你的图像必须能在较旧的软件里、或在某个你无法掌控的环境中打开，那么 JPG 或 PNG 那种通用兼容性就值得保留。而对于所有面向现代浏览器的内容来说，WebP 都很难被超越。

一份简单的选择指南

按顺序走一遍下面这几步，几乎每次你都能选对格式：

1. 它是照片吗？ → JPG（最大兼容性）或 WebP（更小，适合网页）。
2. 它需要透明吗？ → PNG，或者用无损 WebP 得到更小的文件。
3. 它是图形、徽标、截图还是线条画？ → PNG，或无损 WebP。
4. 它是用于网站、而且大多数访客使用现代浏览器吗？ → 无论内容是什么，都优先选 WebP 以求速度。
5. 它必须能在任何地方都打开吗？ → 照片用 JPG，图形用 PNG。

如何私密地在它们之间转换

选对格式往往意味着要转换一张你已有的图像——一张本该是 JPG 的 PNG 照片，或是一张你想换成更小 WebP 用于网站的 JPG。所有这些你都能在浏览器里用 图片转换工具 完成，无需上传任何东西。

大多数在线转换工具会把你的文件发送到远程服务器去处理，这不仅更慢，还意味着要把你的照片或截图交给一家你可能一无所知的公司。Andev 的工具则不同：转换完全在你自己的设备上完成，借助的是浏览器内置的 HTML Canvas。

• 什么都不上传。 你的图像从未离开你的设备。
• 什么都不存储。 关掉标签页，它就消失了。
• 即时完成。 不需要往返服务器。

一套典型的工作流：

1. 打开 图片转换工具，把文件拖进去。
2. 根据上面的选择指南挑选目标格式。
3. 还想让它更小？用 图片压缩工具 调整质量。
4. 要以固定尺寸展示？先调整大小——像素更少，无论什么格式文件都更小。

要点回顾

• JPG 是有损的，最适合照片，但不支持透明，并且会让锐利的边缘变模糊。
• PNG 是无损的并支持透明——是徽标、图形、截图和线条画的正确选择，代价是文件更大。
• WebP 既能有损也能无损，还支持透明，在质量相近时通常比 JPG 小 25%–35%，并被约 96% 的浏览器支持。
• 对网页而言，优先选 WebP 以求速度；当一张图像必须能在任何地方打开时，则保留 JPG 或 PNG。
• 私密地转换。 基于 Canvas 的浏览器内工具更换格式时不上传、不存储、没有限制。

准备好切换格式了吗？从 免费、私密的图片转换工具 开始——不上传、无需注册、没有限制——或者浏览整套 浏览器内图片工具。