图片格式

WebP 转 PNG:保留透明背景,先检查这几个地方

把静态 WebP 素材转成便于编辑和交付的 PNG,正确检查透明区域、边缘、像素尺寸与文件大小。

WebP 和 PNG 中相同的半透明图形,周围以棋盘格表示透明区域

网站上的 WebP 图标显示正常,下一步使用的软件却要求 PNG。对于静态素材,可以转换格式并保留原有透明区域。Google 的 WebP 文档说明,WebP 在有损和无损图像压缩下都可以支持透明。

真正需要确认的是接收方要求。PNG 适合需要透明边缘的静态素材交付,但换成 PNG 并不意味着原图自动升级了。

先确认为什么需要 PNG

需要把图标放到彩色幻灯片上、把抠图素材放到新背景上,或导入明确要求 PNG 的编辑器时,可以选择 PNG。没有必要仅仅因为不熟悉 WebP 后缀,就把所有 WebP 都转一遍。

只需要一张不透明照片来提交表单时,WebP 转 JPG可能更合适。如果接收方已经支持当前 WebP,保留它可以少一次导出,文件也可能更小。

还要观察素材是否在动。本文针对静态图片。本站图片转换工具输出静态文件,不会把 WebP 动画完整保留成动态 PNG。

使用素材文件,不要对预览截图

能下载原始素材时,优先下载原文件。对着白色网页上的图标截图,会把白色网页一起截进去,这样得到的图片可能根本没有透明区域。

有些预览图还会把棋盘格直接画进图片。只有查看器把棋盘格绘制在透明像素后面时,它才是透明指示。把素材放到别的背景上后,格子仍跟着图片一起出现,就要检查它是否已经成了画面内容。

转换前,先确认文件能作为图片正常打开。把保存的网页重命名为图片后缀,不会让它变成有效 WebP。下载入口区分缩略图和原图时,选择原图。

静态 WebP 转 PNG 的步骤

  1. 打开 WebP 转 PNG 工具,选择静态 WebP 文件。
  2. 把输出格式设为 PNG。
  3. 确认识别出的像素尺寸,再开始转换。
  4. 下载结果,在接收素材的软件中打开。
  5. 分别放到浅色和深色背景上,检查透明区域及边缘像素。

当前格式转换工具保持解码后的源图尺寸,并为 PNG 使用支持透明的画布。它不会自动移除已有背景,也不提供动画导出流程。

WebP 与 PNG 中透明区域的示意图,用棋盘格标识图形周围的透明部分
透明原理示意:源文件本来具有透明像素,转换时才有透明信息可保留。

在两种背景上检查透明效果

仅看白色预览,无法判断背景究竟是白色还是透明。可以在编辑器中,把下载的 PNG 放到深色矩形上,预期透明的位置应该能透出下面的颜色。

再换浅色背景检查边缘,观察头发、标志轮廓或柔和投影附近有没有浅色边。如果白边在原图中已经存在,转换后仍可能留下;选择 PNG 不会自动重新生成干净的抠图边缘。

使用原始静态文件、在深浅背景上检查边缘、核对目标软件中的尺寸与体积的清单
请在真正接收素材的软件里检查下载的 PNG。

同时需要白底副本时,把透明原件单独保存。PNG 转 JPG 指南解释了不透明交付副本与透明原件的区别。

怎样理解体积与画质变化

PNG 可能比源 WebP 大。表单限制上传体积时,要比较实际字节数,而不只看后缀。如果必须使用 PNG,但文件超限,应回到源素材,确认目标位置是否确实需要这么大的像素尺寸。

转换不会增加像素,也不会找回有损源图已经丢掉的细节。浏览器重新导出时,也不应默认所有色彩配置文件和元数据都会保留。项目有色彩管理要求时,留下原文件并单独检查最终素材。

需要放大图片时,应另行评估放大流程。例如,截图放大指南说明了为什么小字的检查标准,与装饰图标不同。

常见问题

转成 PNG 可以去掉白底吗?

不能。真实的白色背景属于图片内容。转换可以保留已有透明,但创建透明区域需要编辑操作。

动态 WebP 为什么不动了?

本站转换器导出静态图片。需要保留帧序列、播放时间和循环方式时,应使用支持动画的工作流程,并保存动画源文件。

PNG 一定比 WebP 清晰吗?

不一定。源文件与导出过程决定结果。换格式不能替代更好的原图,输出文件更大也不能单独证明画质改善。