JPG, PNG, GIF, SVG, PSD, BMP, WEBP, CDR, RAW, EPS, TGA... 如此多的图片格式它们的区别是啥呢？
文件格式
在说图片格式之前，我们先聊聊文件格式。在计算机中我们除了图片，还会存储音乐、电影、文档等各种文件，文件格式就是为了让电脑分清不同信息而做的不同编码的方式。就像音乐我们用五线谱来记录，化学反应我们用化学式来记录，不同内容的记录形式不同，就形成了不同约定的格式。
图片格式
既然都是图片，我们为什么还要分那么多图片格式呢？因为作用和使用场景不同。前面我们说音乐用五线谱记录，当然除了五线谱还有大家熟悉的简谱，这就是音乐为了不同的情况使用了不同的格式。
文章开头列了那么多图片格式，我们日常工作当然是用不上那么多的，我们只要了解下面的格式就足够了。
JPEG
是不是很多同学经常看到图片文件的后缀名有时候是 .jpeg 有时候又是 .jpg 了，其实这两个就是一回事。JPEG 格式是一种有损的图片压缩格式，它用算法尽量去除冗余的图像和色彩数据，在图片文件较小的情况下可以得到比较高质量的图片。
JPEG
PNG
PNG 图片格式采用的是无损压缩，和 JPEG 相比文件的体积是会大一些的，但是图片质量非常好，而且还支持 Alpha 通道，也就是说 PNG 可以存部分区域透明的图片。
PNG
GIF
热爱斗图的中国人应该都不陌生，我们聊天时看到的动图其实都是 GIF 图片。没错，GIF 的特点就是它可以是动图，而且支持图片的透明，但是出于体积的考虑 GIF 只支持 256 色，所以我们会发现动图的清晰度和色彩质量并不是很好。
GIF
SVG
如果你是设计师或者开发者，可能对 SVG 并不陌生。SVG 的全称是可缩放矢量图形(Scalable Vector Graphics)，单听名字我们也对它的特性略知一二了。SVG 格式把图像信息用代码的形式存进了文件中，你可以通过任何一个文本编辑软件（记事本、VS Code等）打开来查看源代码，所以它不但体积小而且扩展性很强，我们可以通过编程的方式控制 SVG 图片进行交互和动画的播放。
SVG 图片背后的代码，代码表述了点线面的路径、坐标、长宽、颜色等信息
怎么选择图片格式
照片用 JPEG，因为色彩比较丰富也不需要透明，用 JPEG 即有较高的图像质量还能保持较小的文件体积。
小图片，小图标，有透明需求的用 PNG，尺寸较大的照片如果用 PNG 文件体积会比 JPEG 大不少。
动图用 GIF，虽然现在有更好的动图技术格式，但是 GIF 是兼容性最好的，基本上所有的设备和平台都支持的很好。
