今天下午二狗子照常上班摸魚的時候,突然看到了一則訊息,訊息說 GIF 的發明人因新冠去世了。作為一個自詡理性的網際網路人,二狗子第一反應是看到了一個離譜謠言,可是檢視了多方訊息後,二狗子難過地發現這是真的。
斯蒂芬·威爾海特就職於 CompuServe(全球第一家網路服務提供商),當時這家公司想要在網上展現彩色天氣圖等資訊,但因受限於網路頻寬而束手無策。斯蒂芬·威爾海特瞭解一些壓縮技術,於是他參與了創造 GIF 格式的工作。在之後的1978 年,CompuServe 公司推出 GIF 格式,誕生了世界上第一張動圖。
GIF 全稱 Graphics Interchange Format,即圖形交換格式,以8位色(即256種顏色)重現真彩色的影像。它有效地減少了影像檔案在網路上傳輸的時間,是目前網際網路廣泛應用的網路傳輸影像格式之一。
除去 GIF,目前網際網路廣泛使用的影像格式還有以下種類:
- JPEG
- png
- WebP
GIF
前面我們也提到了一點關於 GIF 的介紹,作為它最大的,與 JPEG 和 PNG兩種格式不同的特點,就是 GIF 是“能動”的。我們通常將 GIF 用於從影像檔案建立動畫,可以通過在壓縮中合併無損質量,無損傳輸和儲存這些檔案,並且對影像庫的儲存影響較小。
GIF 是無損的,採用 GIF 格式儲存圖片不會降低圖片質量。得益於資料的壓縮,檔案體積小,也是 GIF 格式的優點。此外,它還具有支援動畫以及透明背景。
GIF 格式適用於對色彩要求不高同時需要檔案體積較小的場景,比如企業 Logo、線框類的圖等。因其體積小的特點,現在 GIF 也已經被廣泛應用在各類網站中。
JPEG
JPEG 全稱 Joint Photographic Expert Group,即聯合照片專家組。是由國際標準化組織(ISO)制定的面向連續色調靜止影像的一種壓縮標準。它是我們常說的 JPG 的正式副檔名,那為什麼會出現 JPG 這種說法呢?這是因為 DOS、Windows 95 等早期系統採用的 8.3 命名規則只支援最長 3 字元的副檔名,所以為了相容性使用了 .jpg 的形式。而後來所有的 apple 旗下機體都不限制副檔名長度,讓 JPEG 能夠完整出現。不過因為大家已經喜歡了 JPG 的喊法,所以現在 JPG 也依然很流行。
JPEG 圖片格式的設計目標,是在不影響人類可分辨的圖片質量的前提下,儘可能壓縮檔案大小。這意味著JPEG 去掉了一部分圖片的原始資訊,也就是進行了有失真壓縮。JPEG 的圖片的優點,是採用了直接色,得益於更豐富的色彩,JPEG 非常適合用來儲存照片,用來表達更生動的影像效果,比如顏色漸變。
然而,JPEG 不適合用來儲存企業 Logo、線框類的圖。因為有失真壓縮會導致圖片模糊,而直接色的選用,又會導致圖片檔案體積更大。
PNG
PNG 全稱 Portable Network Graphics,即可移植網路圖形。是 1994 年由全球資訊網聯盟(W3C)的一個工作組開發的,當初的開發目的是為 GIF 格式建立一種現代的、免費的替代方案。
PNG 採用無失真壓縮演算法的點陣圖格式,檔案字尾名為 .png。使用的是從 LZ77 派生的無損資料壓縮演算法,一般應用於 JAVA 程式、網頁中,它的壓縮比高,生成檔案體積小。
PNG 格式是我們在數字設計專案中最常使用的格式,通常比其他格式的檔案大小要大。但是它保留了硬性邊緣效果,且可以處理大量顏色。另外 PNG 有個比較有趣的特性,那就是支援透明背景,因此大多數網站PNG 格式作為 Logo 。
看到這裡相信大家都發現了三者的一點共同點,它們都提到了壓縮和損壞,有的是有損的,有的是無損的。難道所有的圖片都必須壓縮嗎?其實是可以不壓縮的,比如 BMP 就可以不壓縮儲存。但是一兩張圖還可以這麼做,如果圖片多起來那對於儲存和傳輸就造成了極大的壓力。
因此如何在保證圖片質量不變的情況下,壓縮圖片進而節省流量頻寬,讓傳輸更快,帶來更好的觀看體驗就變得重要起來。
但是作為傳統的圖片格式 JPEG,PNG,GIF 等其實已經沒有很大的優化空間了,那唯一剩下的道路就是發掘一種新的圖片格式,或者壓縮格式來解決這個問題,WebP 應運而生。
WebP
WebP 是 Google 於 2010 年提出了一種新的圖片壓縮格式,目的就是為 Web 上的圖片資源提供卓越的有損、無失真壓縮。在與其他格式同等質量指數下提供更小,更豐富的圖片資源,以便資源在 Web 上訪問傳輸。
WebP 圖片格式來源於 VP8 視訊編解碼器,也就是 WebM 視訊容器,是 WebM 視訊格式的單個壓縮框架。VP8 編解碼器的一個強大功能就是能夠進行幀內壓縮,或者更確切地說,能將視訊的每個幀都被壓縮,再壓縮幀與幀之間的差異。
作為專為壓縮而推出的格式,WebP 具有以下特性:
- 有失真壓縮:有失真壓縮基於 VP8 關鍵編碼。VP8 是 On2 Technologies 建立的視訊格式,是 VP6 和 VP7 格式的後續版本。
- 無失真壓縮:採用預測變換,顏色變換,減去綠色,LZ77 反響參考等技術進行壓縮。
- 透明度:8位 Alpha 通道對圖形影像很有用。Alpha 通道可以與有損 RGB 一起使用。與其它格式圖片所不支援的 WebP 特有的功能。
- 動畫:它支援真彩色動畫影像,即可以支援動態圖( 類Gif 圖)
- 後設資料:它可能具有 EXIF 和 XMP 後設資料
- 顏色配置檔案:它可能具有嵌入式 ICC 配置檔案。
同時它的效果也是明顯的,以 JPEG 作為對比,當 WebP 將 JPEG 壓縮到相當於原圖 90% 質量時,圖片體積可以減少 50% 左右。當 WebP 將 JPEG 壓縮到相當於原圖 80% 質量時,圖片體積則減少了 60%~80%。
在 WebP 出現後,它憑藉自己優異的圖片壓縮效能,以及兼備無損和有損兩種壓縮演算法,以及唯一可以對 GIF 進行壓縮的特點,迅速在各大網站、App 普及。那要如何才能讓圖片變成 WebP 格式呢?
最簡單的方法就是直接接入雲服務的圖片處理功能,比如又拍雲 WebP 自適應:
在後臺一鍵開啟 WebP 自適應功能,即可通過 CDN 平臺智慧判斷客戶端瀏覽器是否支援 WebP 解碼,如果支援則返回 WebP 格式圖片,如果不支援則會返回原圖,在客戶端以及源站無需任何改動。