相關文章

Eb68d3e7a4d81ed2412492896d8ffe38 你沒有發現你看到的GIF圖片畫質都很差勁嗎?因為這種格式的圖像只支援8 bit顏色,就是只有256種顏色,不能呈現真實彩色畫面。所以這種演算法對於圖像的邊緣處理與整體渲染都還停留在上個世紀。那為什麼更優秀的APNG沒法取代它?

先從近日Kickstarter上的一個項目說起。這個專案叫做「apngasm」,現在已經超出了預期的5,000美元目標,達到了7,512美元。它是做什麼的?很簡單,製作動態的PNG圖像,就像是GIF那種的。

我們對GIF這種動態圖像已經非常熟悉了,平時在網路上看到的俗稱的「動態圖檔」幾乎都是這種格式的圖像。可是,這個格式已經有27年歷史了,它誕生在Windows 1.0的時代。目前來看,似乎應該要找到一個GIF的替代者。

Why?你沒有發現你看到的GIF圖片畫質都很差勁嗎?因為這種格式的圖像只支援8 bit顏色,就是只有256種顏色,不能呈現真實彩色畫面。所以這種演算法對於圖像的邊緣處理與整體渲染都還停留在上個世紀。雖然GIF目前是最流行的動態圖像演算法,但有關於它的替代者的開發從未停止過。

其中一個便是上面提到的動態的PNG圖像,即APNG(Animated PNG)。從字面上理解,這種格式的圖像就是一個「會動」的PNG圖檔。這個最早是由Mozilla的兩名程式設計師設計出來的,當時Mozilla放棄了MNG圖像格式,轉而自己開發了APNG用以存儲動態多圖檔。

這個MNG檔是PNG開發組設計的用以處理動態圖檔的「官方」演算法,但在實際使用時佔用了過多的資源,需要使用者端載入過多的程式碼,顯得十分笨重,所以被Mozilla拋棄。不過,PNG開發組本身就不怎麼贊成「動態圖檔」這種演算法設計,因為他們覺得讓一種圖片格式既有靜態又有動態展示是一種「糟糕的設計」。

因此,在MNG上,PNG的開發組並沒有下太大功夫。不過,Mozilla依然樂此不疲的想要用動態的PNG(APNG)來取代GIF成為下一代動態圖檔的標準。

我們先來對比下GIF跟APNG之間的表現,體積和畫質。

可以看出,在體積相仿的情況下,APNG格式的畫質就像是單眼相機,而GIF的畫質就好比普通手機,差異十分巨大。同時,在24位元的情況,由於PNG容納的顏色種類遠遠多出256種(實際上是1680萬種顏色),所以色彩還原更加細膩、真實。

感興趣的讀者可以點擊此連結查看官方的示範,畢竟這些圖是動態的。但需要注意,如果你用是IE或者Chrome瀏覽器,只能看到GIF在動,右側的APNG只能看到靜態的。因為——瀏覽器不支援APNG。

既然APNG這麼優秀,為什麼不直接普及呢?實際上,在2004年開發出來至今,APNG格式在網路社群中得到的支持非常少,尤其是來自應用端的,比如瀏覽器。目前,唯一原生支援APNG的就是Gecko核心的火狐瀏覽器以及其他兩款同核心的小眾瀏覽器。

至於IE,根本不支援。而Webkit核心的Safari也完全不支持。只有Blink內核的Chrome、Opera在安裝APNG解碼外掛程式後可以支援顯示APNG。所以,在網際網路最大的入口瀏覽器這個管道上,APNG缺乏最根本的支持。最重要的一點是,APNG受到了PNG開發組的堅決反對,後者只支持MNG格式,這使其在標準的普及上失去了格式發明者的支持。

下圖是APNG的壓縮原理。


這裡簡單的說一下它的原理。我們看到,這個示例中有三幅圖片,其中IDAT為圖像的「正文」,即構成圖片的那部分資料。這三部分資料被拿出來放到了APNG的長條中。至於IHDR與IEND,指的是一個PNG檔的頭部資訊與尾部資訊,暫且不用管。

關鍵是要看明白,APNG多了哪幾部分?這裡有主要有3部分,即acTL(用於控制動畫)、fcTL(控制框架)以及fdAT(存儲框架資訊)。這就是三幅(3個框架)圖片組成的APNG檔。

原理大致就是這樣的,演算法方面的問題我們暫不深究。這裡只討論APNG的「前途」問題。即,它未來有可能被大範圍普及嗎?要知道,目前的動態圖演算法可不只有GIF、MNG以及APNG之類的,還有比如SVG等。

首先缺乏瀏覽器支援,這就讓APNG很難普及。文章開頭提到的Kickstarter項目是想通過普及APNG的製作工具來達到宣傳APNG的效果,但沒有來自瀏覽器的原生支援,這樣做的效果十分微小。

其次,沒有PNG發開組的支持。目前,支援MNG的PNG開發組與支援APNG的Mozilla在動態圖檔標準上已經形成了對立。這樣一來,ANG作為基於PNG標準的格式,就失去了原始開發者的技術支援,更失去了一個聯盟來推廣新的格式。這就讓APNG很難像PNG一樣被標準化。

從另一個角度講,GIF這麼低劣的畫質之所以能「橫行」網路二十多年,就是因為人們對於動態圖畫質的需求並不高。GIF的應用場所十分有限。你現在除了在論壇或其他社群網站上看到GIF,還在哪裡經常看到過?(專門搜集GIF的網站除外)

所以,動態圖檔雖然廣受歡迎,網際網路對其的需求也很大,但畫質不是決定性因素。或者說,即便是GIF這樣糟糕的畫質,人們也是樂此不疲的去欣賞一幅GIF中講述的故事。


steven steven@pingwest.com

使用 Facebook 留言

阿蛙
1.  阿蛙 (發表於 2013年8月28日 09:22)
『感興趣的讀者可以點擊此連結查看官方的示範,畢竟這些圖是動態的。』
請問連結在哪 @@?
三十二朔月
4.  三十二朔月 (發表於 2013年8月28日 11:21)
APNG會失敗的原因不止瀏覽器不支援
而是前有Adobe Flash
後有HTML5夾殺

兩者呈現在網頁上的功能性完勝APNG╮(╯_╰)╭
elgoogck
5.  elgoogck (發表於 2013年8月28日 13:03)
Flash和HTML5和一般圖檔的編輯容易度根本是兩碼子事好嘛!
APNG的確是缺少編輯工具,不過瀏覽器不支持也是原因之一
目前唯一的競爭者應該是Google開發的WebP格式吧!
支援有損/無損壓縮,動態圖像,壓縮比又高,瀏覽器支援(Chrome,Opera)
但是只能用指令列轉換,還是缺乏好用的編輯工具
只要Google有心開發,APNG應該一下子就沒有競爭機會了吧!
Randolph
8.  Randolph (發表於 2013年8月28日 17:20)
看似 Flash 或其它技術可以取代 GIF
但是 Flash 支援裝置有限
而且通常社群網站不允許一般使用者上傳 Flash

所以動畫的圖片格式還是有優點
安全、支援廣、又容易分享

順便一提......
要是 FB 也支援 GIF 動畫縮圖
FB 分享型式會變得很精彩
你會發現十張好友分享的圖大概有一半都會動

想也知道 FB 不可能會隨意的讓人上傳 Flash
不管是智慧型手機、平板支援度的考量也是資訊安全的問題
--------------------------------------------

至於樓上提的 WEBP
它也有支援性問題

至少比 APNG 支援性好太多了
--------------------------------------------

動畫圖片還有一個問題
它會浪費伺服器很多資源去計算縮圖
而且常常縮圖後的 GIF 竟然比沒縮圖的檔案還大
(若再加上最佳化動畫 GIF 又是一筆伺服器資源開銷)

即使是 FB 也沒支援 GIF 動畫縮圖......
只有 Google+ 作得到... Orz
朔影
9.  朔影 (發表於 2013年8月29日 09:38)
APNG不會普級的最大原因
瀏覽器支援度反而還只是其次
重點是在於"人們對高彩度動態圖片"的需求並沒有提高
真的要動態的話,Flash也可以作為替用
而APNG雖然也許發展到最終可以在單純"呈現動態圖片"這領域上比Flash更突出而簡易,但為此要多發展出一種格式,這是各方不願意的…,畢竟需求就那麼一點點,為了這小小的需求,反而要增加許多麻煩?

發表回應

謹慎發言,尊重彼此。按此展開留言規則