WEBP是什麼圖片格式?PNG、JPG、WEBP和GIF有什麼區別

png、jpg、webp和gif是市面上最常使用的三種圖片格式。在介紹它們的區別之前，先讓我來簡單介紹下圖片的基礎知識。

圖片是由很多像素點組成的，每個像素點只能保存一種顏色。如果說一個圖片格式是8位的，就說明這個像素點可以表示2的8次方種顏色，即256種顏色。所以圖片格式的位數越多，一個像素點能表示的顏色數越多，圖片就越豐富。

Alpha透明通道：一個8位的灰度通道，該通道用256級灰度來記錄圖像中的透明度信息，定義透明、不透明和半透明區域，其中黑表示透明，白表示不透明，灰表示半透明。

下面，我分別對png、jpg、webp和gif圖片從像素點位數、是否支持透明通道、是有損壓縮還是無損壓縮、知否支持動態圖四個維度進行說明。

PNG

png有PNG8、PNG24、PNG32三種格式。PNG8表示圖片的每個像素點是8位。PNG24表示圖片的每個像素點是24位。PNG32表示圖片的每個像素點是32位。所以，PNG32比PNG8能表示的顏色數量更多。

png支持透明通道。

PNG8有1位的布爾透明通道（要麼完全透明，要麼完全不透明）。PNG24用的就是Alpha透明通道,就是有8位（256階）的布爾透明通道（所謂半透明），它有1600萬種顏色。

png是無損壓縮。Android之所以用png格式圖片，就是為了不同手機的適配，如果用jpg的話，對於高解析度手機，可能圖片會虛。

雖然png是無損壓縮。但是也有一些網站可以對png圖片進行有損壓縮，比如tinypng網站。正如tinypng官網上介紹的：

When you upload a PNG (Portable Network Graphics) file, similar colors in your image are combined. This technique is called 「quantization」. By reducing the number of colors, 24-bit PNG files can be converted to much smaller 8-bit indexed color images. All unnecessary metadata is stripped too. The result: better PNG files with 100% support for transparency.

它的原理是把相似像素的24bit位用8bit位來表示，並且移除了不必要的元數據，是有損壓縮，不過肉眼很難看出來。

png不支持動態圖。

JPG

jpg又叫jpeg，兩者是完全相同的壓縮算法。之所以有兩個名字，是因為很久之前的Windows系統僅支持擴展名為三位的文件，所以將jpeg格式簡寫成jpg來供Windows系統識別。當然，現在的Windows系統已經可以支持擴展名為多位數的文件了，但是由於歷史原因導致的jpg就延續到至今了。

jpg是24位的。

jpg不支持透明通道。

jpg是有損壓縮。每次保存都會有數據損失, 所以儘量不要多次保存。不然圖像會失真。

jpg不支持動態圖。

WebP

WebP是Google發明的一種圖片格式。在達到圖片同樣效果的情況下，WebP格式的圖片體積更小。

WebP剛出現時是不支持透明通道的，後來Google讓WebP支持了透明通道。

WebP有無損壓縮和有損壓縮兩種，壓縮比例大。

WebP支持動態圖。

GIF

gif是8位的。

gif支持透明度。

gif是有損壓縮，反覆保存gif，圖片質量會逐漸變低。

gif可以保存多個圖層，所以支持動態圖。