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 是兼容性最好的，基本上所有的設備和平臺都支持的很好。
