PNG是壹種非常流行的無損壓縮格式，所有的瀏覽器都支持這種格式。 它提供了卓越的圖像質量，但是通常來說壓縮率較低。
本文將使用PNG圖片作為基準，對比其他有損格式壓縮，檢查圖片質量並對圖片質量進行評分。
雖然PNG格式老，體積大，但它仍然在網絡上占有壹席之地，尤其是在壹些對畫質要求很高的場景。同時對於邊緣非常銳利的圖像（例如包含文本的圖像），也建議選擇PNG。 對此類圖片，PNG壓縮與其他格式（包括有損壓縮）相比，文本圖像使用PNG實際上具有更高的壓縮率，並且具有更好的質量優勢。
PNG有兩種模式：24位或8位顏色深度。 前者用於表示照片，後者用於文本圖像，單色照片或Logo圖像。?
BMP只是壹個圖像的容器，不提供壓縮。 這是壹種格式，主要在圖像處理中使用，譬如說Windows裏面的調色板。
BMP的尺寸很容易計算，譬如說分辨率是1920x1080p的RGB圖像，整個的存儲空間大約就是1920 x 1080 x 3 ，大約5MB。可以看得出來，BMP文件的大小明顯大於壓縮格式，包括PNG。通常來說，沒有特殊情況，不應在網站上使用BMP圖片，不過實際情況下網站上還是有很多BMP圖像的。
壹般來說，如果想要文件更小，就需要花費更多的處理時間來對文件進行編碼，而解碼時間壹般來說相差不大。
回顧壹下，BMP圖像質量很好，瀏覽器支持廣泛，但是文件尺寸卻非常大。
GIF作為動畫格式非常流行，不管是微信裏面轉發的動圖表情，還是網站上的動圖，都隨處可見，所有的瀏覽器也都支持GIF圖像。
GIF具有無損壓縮和有損壓縮的混合特性。像素表示形式是無損的，但是顏色深度限制為每個像素8位(即每個圖像轉換為256色，原始的圖像如果是RGB格式的，每個像素實際上使用24位來表示的)。這意味著文件將包含較少的顏色（每個文件最多包含256種不同的顏色），但文件體積更小。 這是24位PNG和8位GIF之間的色彩表示的比較。
可以明顯看到GIF圖像有輪廓效應，這是因為GIF無法表示豐富的色彩。
GIF不適合表示照片或任何其他內容豐富的圖片。但是它們對於簡單的徽標，圖標等很有用，因為這些圖片顏色不多，而且純色居多。根據我的經驗，與GIF相比，8位PNG生成的文件更小，所以對於靜態圖片而言，建議采用8bit PNG。
SVG格式比較特殊，與其他格式有很大不同。 SVG圖像存儲的是幾何形狀，而不是每個像素的值。 它的主要優勢是可以無限放大而不會造成質量損失，具體可以看下圖的對比：
SVG文件類型主要用於徽標，但也用於幾何形狀的圖像。 這種文件的主要缺點是：
對於徽標等小圖片，文件大小通常比PNG或WebP大，尤其對於形狀復雜，不規則的logo。在大多數情況下，無法將圖片有效地轉換為SVG(有壹些工具說可以做到這壹點，但效果並不理想)。
不論視圖大小如何，SVG文件的圖像質量都很高。 所有現代瀏覽器都支持它。
JPEG是網絡圖像的王者。 網絡上絕大多數的圖像以JPEG格式存儲，具體的份額可以參考下圖：
什麽使JPEG如此流行？ JPEG文件對於絕大多數文件通常都很小。 它的壓縮使用有損算法，通過犧牲人眼不太敏感的區域的質量來最小化大小。
這種方法可顯著減小尺寸，通常不會出現明顯的變形。 我們可以對比下JUNO探測器拍攝的這張木星照片。
原始PNG照片(2MB) ? JPEG最好的質量(1MB) JPEG默認的質量
使用JPEG壓縮，我們可以大幅度縮小尺寸（超過90％），而不會造成質量損失。 當我們放大這些圖片時，質量上也沒有很大的損失。
JPEG並不是對於所有圖像都很管用，如前面介紹PNG時所說的，對於具有銳利邊緣和顏色比較少的圖像，JPEG並不是非常管用。常見的例子就是包含文字的圖片，另壹個是徽標：
在這幅圖片裏面，JPEG圖像大約2KB(是PNG文件的兩倍)，同時放大來看，JPEG對於邊緣的表示並不理想，同時顏色也有失真。失真非常明顯，即使在圖像的未縮放部分上也清晰可見。
JPEG有兩種格式，壹種是Baseline JPEG，壹種是Progressive JPEG.
兩者之間的視覺差異是加載圖像的方式。 隨著數據的到達，Baseline從上到下加載圖像。 Progressive以非常低的質量壹次打印整個圖像，並且隨著數據的到達，圖像得到了改善。 這裏是展示差異的動畫：
JPEG之外的世界– WebP
JPEG壓縮可以很好地減小文件大小，不過JPG已經過時了。 如您所知，IT開發的幾年就像外面的壹個世紀壹樣。?
最近幾年已經有更新的編碼方法（例如mozJPG），但核心思想保持不變。
同時還有其他的格式在圖像質量和文件大小方面都更好(BPG, JPEG 2000, JPEG XR)，但因為某些格式受專利保護，無法在網絡上廣泛使用。
幸運的是，有壹個可供公眾使用的WebP。 目前，這種格式由Google開發並開源，並采用無損和有損壓縮以最小化文件大小。許多現代瀏覽器都支持它，但覆蓋範圍仍然存在差距。 截至2018年8月，全球將近75％的用戶使用支持WebP圖像的瀏覽器瀏覽Web。 WebP圖像的文件大小和質量看起來很有希望。除了壓縮性能出色外，它的最大優勢還在於多功能性。 它可以有損和無損壓縮，具有特定的顏色深度，透明度和動畫效果。 它在所有這些領域中也表現出色。
簡單總結下，對於靜態圖片幾種格式的對比如下：
下壹篇介紹下常見的動態格式有哪些。