图片格式 WebP、JPEG、PNG、SVG 及转换

图片格式 WebP、JPEG、PNG、SVG 及转换

在当今数字时代，图像在网页设计和应用中扮演着至关重要的角色；选择适当的图像格式直接影响着网站的加载速度、用户体验和整体性能。

WebP、JPG、PNG 和 SVG 等作为常见的图像格式，各具特色，对于不同的需求提供了多样化的解决方案。

1. 图片格式

1.1 WebP

维基百科：https://zh.wikipedia.org/wiki/WebP

WebP（发音：weppy）是一种同时提供了有损压缩与无损压缩（可逆压缩）的图片文件格式。

由 Google 于 2010 年 9 月发布，旨在减少文件大小的同时，达到和 JPEG、PNG、GIF 格式相同的图片质量，并希望借此能够减少图片档在网络上的发送时间。

WebP 支持的像素最大数量是 $16383\times 16383$。有损压缩的 WebP 仅支持 8-bit 的 YUV 4:2:0 格式；而无损压缩（可逆压缩）的 WebP 支持 VP8L 编码与 8-bit 之 RGBA 色彩空间；而无论是有损或无损压缩皆支持 Alpha 透明通道、ICC 色彩配置、XMP 诠释资料。

1.2 JPEG

维基百科：https://zh.wikipedia.org/wiki/JPEG

JPEG 或称 JPG，是一种针对照片影像而广泛使用的有损压缩标准方法，由联合图像专家小组（Joint Photographic Experts Group）开发。

使用 JPEG 格式压缩的图片文件一般也称为 JPEG Files，最普遍使用的扩展名格式为 .jpg，其他常用的还包括 .JPEG、.jpe、.jfif 以及 .jif。该格式的资料也能受嵌进其他类型的文件格式中，像是TIFF 类型的文件格式。

JPEG 是万维网上最普遍的用来存储和传输照片的格式，它并不适合于线条绘图（drawing）和其他文字或图标（iconic）的图形，因为它的压缩方法用在这些类型的图形上，得到的结果并不好。

1.3 PNG

维基百科：https://zh.wikipedia.org/wiki/PNG

PNG（Portable Network Graphics：便携式网络图形）是一种支持无损压缩的位图图形格式，支持索引、灰度、RGB 三种颜色方案以及 Alpha 通道等特性。PNG 的开发目标是改善并取代 GIF 作为适合网络传输的格式而不需专利许可，所以受广泛应用于互联网及其他方面上。

其另一个非正式的名称来源为递归缩写：“PNG is Not GIF”。

PNG 图片大多数都使用 PNG 作为扩展名，其 互联网媒体类型为 image/png。PNG于 1997 年 3 月作为知识性 RFC 2083 发布，于 2004 年作为 ISO/IEC 标准发布。

1.4 SVG

维基百科：https://zh.wikipedia.org/wiki/svg

SVG（Scalable Vector Graphics：可缩放矢量图形）是一种基于可扩展标记语言（XML），用于描述二维矢量图形的图形格式。

SVG由 W3C 制定，是一个开放标准。由于 SVG 是基于矢量的，所以在放大图片时是不会出现任何降低或丢失保真度的情况；这使得它非常适合多语境场景，例如响应式 Web 设计。

1.5 …

WebP、JPEG、PNG 总比较：

	WebP	JPEG	PNG
图片大小	最小	较小	较大
载入速度	最快	快	较慢
支持透明背景	是	否	是
支持动画	是	否	否
浏览器、软体支持	较老的浏览器、软体不支持	几乎都支持	几乎都支持

上述几种图片格式作者会经常接触，还有其他几种（GIF、BMP、TIFF 等）不会过多涉及，仅提供超链接（均来源于维基百科）：

GIF： https://zh.wikipedia.org/wiki/GIF

BMP：https://zh.wikipedia.org/wiki/BMP

TIFF：https://zh.wikipedia.org/wiki/TIFF

2. 格式转换

综上，WebP 格式的图片压缩效率更为出色，目前互联网的流量中有约 65% 为图片，这意味如果将 .jpeg、.png 等转换为 .webp 格式的话，浏览网页的速度将大幅提升。

以下，给大家带来几种转换为 WebP 格式的方法或工具。

2.1 Python 批量转 WebP

要批量将不同格式的图片（.png、.jpg、.jpeg、.tiff 等）转换为 .webp 格式，可以使用 Python 的 Pillow 库（PIL）来处理图像。

首先，需要确保已经安装 Pillow。如果还没有安装，可以使用以下命令安装：

pip install Pillow

然后，可以使用以下 Python 代码批量转换图片格式：

import os
from PIL import Image


def convert_to_webp(input_path, output_path):
    try:
        image = Image.open(input_path)
        image.save(output_path, 'WEBP')
        print(f"Converted {input_path} to {output_path}")
    except Exception as e:
        print(f"Error converting {input_path}: {str(e)}")


def batch_convert_to_webp(input_folder, output_folder):
    if not os.path.exists(output_folder):
        os.makedirs(output_folder)

    supported_formats = ['.png', '.jpg', '.jpeg', '.tiff', '.bmp', '.gif']

    for file_name in os.listdir(input_folder):
        if file_name.lower().endswith(tuple(supported_formats)):
            input_path = os.path.join(input_folder, file_name)
            output_path = os.path.join(output_folder, os.path.splitext(file_name)[0] + '.webp')
            convert_to_webp(input_path, output_path)


if __name__ == '__main__':
    input_folder_path = './img-ori'
    output_folder_path = './img-webp'

    batch_convert_to_webp(input_folder_path, output_folder_path)

convert_to_webp: 该函数接受输入图片文件的路径和输出 WebP 图片文件的路径作为参数，使用 Pillow 库打开输入图片，并将其保存为 WebP 格式。如果转换成功，打印转换信息；如果失败，打印错误信息。

batch_convert_to_webp: 该函数用于批量转换指定文件夹中的图片文件。首先，它检查输出文件夹是否存在，如果不存在则创建。然后，它遍历输入文件夹中的所有文件，仅处理支持的图片格式。对于每个符合条件的文件，构建输出路径，并调用convert_to_webp函数进行转换。

最后，__name__ == '__main__' 部分用于在直接运行脚本时执行转换操作，你可以在这里指定输入和输出文件夹的路径。

示例输出：

Converted ./img-ori\1d7ow6.jpg to ./img-webp\1d7ow6.webp
Converted ./img-ori\2y2pwo.jpeg to ./img-webp\2y2pwo.webp
Converted ./img-ori\3p952p.bmp to ./img-webp\3p952p.webp
Converted ./img-ori\5por2l.tiff to ./img-webp\5por2l.webp
Converted ./img-ori\7rvgfs.png to ./img-webp\7rvgfs.webp
Converted ./img-ori\9exijz.png to ./img-webp\9exijz.webp
Converted ./img-ori\9oibji.png to ./img-webp\9oibji.webp
Converted ./img-ori\zwedxc.gif to ./img-webp\zwedxc.webp
Converted ./img-ori\zxcdfv.gif to ./img-webp\zxcdfv.webp

2.2 在线转换工具

2.2.1 Shutterstock

在线网址：https://www.shutterstock.com/zh/file-converter

2.2.2 PicWish

在线网址：https://picwish.com/convert-to-jpg

2.2.3 MyEdit

在线网址：https://myedit.online/cn/photo-editor/png-converter

2.2.4 Freeconvert

在线网址：https://www.freeconvert.com

2.2.5 iLoveIMG

在线网址：https://www.iloveimg.com/convert-to-jpg

Reference

源文档	平台
WebP、JPG、PNG 是什么？教你如何挑选最优的图档格式	哔哩哔哩
图片批量转换Webp工具，图片收集爱好者的利器！	知乎