图片格式

PNG（Portable Network Graphics）

说明： PNG 是一种无损压缩的位图图像格式。它支持透明背景，适用于需要高质量图像而不损失细节的场景。

使用场景：

• 网站图标和标志：由于其透明背景功能，适用于网站的图标和标志。
• 截图：无损压缩使其适合截取高质量的屏幕截图。
• 图形和插图：需要透明背景和高质量的图形，如插图和设计作品。

优点

• 无损压缩
• 支持透明、半透明
• 最高支持24位真彩色图像以及8位灰度图像，从而彻底地消除锯齿边缘。

缺点

• 与jpg的有损耗压缩相比，png提供的压缩量较少
• 不支持动画，如需支持动画还得使用apng

JPEG（Joint Photographic Experts Group）

说明： JPEG 是一种有损压缩的图像格式，适合存储复杂的彩色图像。其压缩率高，但会有一定程度的画质损失。

普通jpg：

渐进式jpg：

从上面两张图可以看到，普通的jpg是从上往下加载图片的，在网络慢的时候尤为明显。

渐进式jpg文件包含多次扫描，这些扫描顺寻的存储在jpg文件中。打开文件过程中，会先显示整个图片的模糊轮廓，随着扫描次数的增加，图片变得越来越清晰。

使用场景：

• 数码照片：适用于存储和分享数码照片，文件大小较小且画质较好。
• 网络图片：因其较小的文件大小，适用于网页加载较快的图片。
• 电子邮件附件：由于文件较小，适合通过电子邮件发送图片。

优点

• 采用有损压缩，压缩后体积更小
• 支持24位真彩色
• 支持渐进式加载

缺点

• 有损压缩会损坏图片的质量
• 不支持透明/半透明

GIF（Graphics Interchange Format）

说明： GIF 是一种支持动画和透明背景的位图图像格式，但只支持256种颜色。

使用场景：

• 网络动画：适用于创建简单的动画和短视频片段，如表情包和动画广告。
• 简单图形：适用于颜色较少的简单图形，如图标和线条图。
• 网站装饰：由于支持透明背景和动画，适用于装饰网站。

优点

• 体积小
• 支持动画

缺点

• 由于采用了8位压缩，最多只能处理256种颜色

TIFF（Tagged Image File Format）

说明： TIFF 是一种无损压缩的图像格式，适合保存高质量图像。它支持多种颜色深度和压缩方法。

使用场景：

• 专业摄影：适用于需要高质量和细节保存的专业摄影作品。
• 印刷品：由于其高质量，适合印刷和出版物的图像存储。
• 扫描文档：常用于保存扫描的文档和照片，确保细节和质量不丢失。

BMP（Bitmap）

说明： BMP 是一种无压缩或轻度压缩的位图图像格式，保留了图像的原始数据。文件大小较大，但质量高。

使用场景：

• Windows系统图像：常用于Windows系统中的图像存储和处理。
• 简单图像编辑：适用于需要进行多次编辑而不希望损失图像质量的场景。
• 软件开发：适用于软件开发中需要高质量图像的应用，如图标和按钮设计。

Webp 格式

Webp 是一种现代图像格式，可为图像提供无损压缩和有损压缩，这使得它非常灵活。由 Google 在购买 On2 Technologies 后发展出来，以 BSD 授权条款发布。

Webp的优秀算法能同时保证图像质量和较小体积；可以插入多帧，实现动画效果；可以设置透明度；采用 8 位压缩算法。

无损的 Webp 比 PNG 小 26%，有损的 Webp 比 JPEG 小 25-34％，比 GIF 有更好的动画。

适合：适用于图形和半透明图像。