PNG從哪冒出來的？

PNG從哪冒出來的？

　　PNG全名Portable Network Graphics，字面上翻譯過就是『可攜性網路用圖形』，這簡單幾個字已經明白定義了PNG的用途以及主要發展方向。1996年，PNG Group向W3C (World Wide Web Consortium)提出一種多媒體圖形格式，重點在於改進現有JPG跟 GIF的缺點，並且提供更多新的概念與壓縮模式，在提出後得到W3C的認可與推薦。在1st October, 1996，W3C正式發函公告，推薦PNG為最佳的圖形格式，並且以『PNG Delivers Higher Quality Graphics for Web Page Design』這樣高度推崇的文字來作為該文件的標頭，看來PNG在1996年倒是相當風光。

　　PNG要如何發音？基本上跟『ping』的發音相同，或者是你想念做『P-N-G』也可以。PNG的非官方名稱為『PNG's Not GIF』，頗挑釁，但是這也反映出目前網路圖形的現實狀況。怎麼說呢，話說網路最常用的圖形格式GIF，其專利權屬Unisys所有，早在1994年底，Unysis公司就宣佈，要求有支援GIF軟體的作者須繳交權利金。此舉對於一向以免費開放架構為主流的網路生態，殺傷力非常大。這時不少人便開始反對Unisys的作風，並且共同開發另一種圖形標準，希望能完全取代GIF，而PNG(PNG's Not GIF)也就孕育而生，從1996年起加入網路圖形的陣營。

 

PNG的圖檔格式特性

　　由於終極目標是為了取代GIF，因此PNG保留了大部分GIF的特性，像是Index Color、交錯顯示、透明區域、額外說明資訊等，都是GIF有的屬性，而PNG在設定之初也保留了這樣的原始功能。畢竟，想要取代對方，敵人會的招數自己還是得學學。

　　除此之外，PNG還加入了不少GIF所沒有的新功能，包括儲存全彩影像(24bit)、256階透明層次(Alpha Channel)、Gamma值資訊、CRC Check、可定義的階層顯示、壓縮方式可以隨時擴充等，都是相當棒的特性，乍看之下，比起GIF跟JPG真的進步不少。

 

PNG vs GIF 大對決

　　口口聲聲要取代GIF，連PNG這個名字都擺明了就是要跟死要錢的GIF作對(PNG's Not GIF)，那就得拿出真本事來，來能夠讓使用者信服。以下分別針對各種不同屬性的圖檔，做一完整的測試，比較看看，PNG是否有取代GIF的實力。

 

測試一：全彩Photo圖片

　　取樣標準選用短景深的花卉攝影，主要目的在於，比較能夠清楚了解圖興壓縮過後的解像能力。前景花卉的枝葉是否輪廓清晰，而後景朦朧的部分是否清楚展現其連續色階也是重點。紅跟綠的對比配色，對於顏色數限制下的色彩展現，也有相當的測試性質。

GIF 16色 7.15k	GIF 32色 9.63k	GIF 64色 12.9k	GIF 128色 15.6k
PNG 16色 9.51k	PNG 16色12k	PNG 16色15k	PNG16色 16.5k

　　首先是GIF與PNG的比較。測試之後，非常無奈的發現，PhotoShop似乎沒有對PNG以及GIF的壓縮格式分別作最佳化。在抖色的色彩排列上，上下的比較可以很明顯的看到，不論是GIF或是PNG，同一色彩數的抖色方式皆相同，也因此在畫質上，兩種格式完全沒有差異。

　　既然畫質沒有差異，那能夠比較的只剩下圖檔大小。在全彩照片的測試中，GIF在每一個顏色數中都佔盡上風，平均圖檔只要PNG的80%大小，在全彩複雜圖形的壓縮上保有一定的優勢。PNG在這次的測試中佔居第二。

 

測試二：全彩Photo圖片 --> 24bit圖形

JPG 25-Quality 5.97k	JPG 50-Quality 9.19k	JPG 75- Quality 18.9k	JPG 100- Quality 38.3k
PNG 24bit 57.5k

　　PNG在規格上可以壓製24bit全彩圖形，所以我們也增加了與JPG的比較測試。比較方式為，JPG採分階段縮測試，分別由25、50、75到100，而PNG方面由於PhotoShop並未提供壓縮比設定，在PNG規格上亦未標明24Bit圖形的壓縮品質如何控制，所以僅以一個樣本來做比較。(PNG欄中的四張圖皆為同一張，為了方便與上面四張JPG比較而複製四份)

　　測試結果發現，JPG在50的壓縮品質下已經相當接近原圖，而在75的壓縮品質下，幾乎已是很難發現壓縮失真的痕跡。JPG的壓縮方式在壓縮全彩圖片上確實優秀，而且K 數非常小，9K的畫質已是嚇嚇叫。反觀PNG，目前的24bit圖片效果似乎中看不重用，圖形品質雖好，但是在檔案大小上的劣勢卻相當明顯。看來24bit的PNG圖形應用，還有待大力改進。

 

測試三：16色矩陣圖形

　　在GIF完全剖析中，我們測試了GIF的壓縮方式，當然在PNG的測試中，我們也如法炮製，測試一下圖形的排列方式是否與PNG的壓縮比有關。測試方式由線條、矩陣、3色矩陣、4色矩陣，一直到16色漸層矩陣，逐漸提高圖形的複雜度，以下就是測試結果。

GIF 2色 272 bytes	GIF 2色 572 bytes	GIF 2色 591 bytes
PNG 2色 747 bytes	PNG 2色 772 bytes	PNG 2色 774 bytes

GIF 3色 843 bytes	GIF 4色 1013 bytes	GIF 16色 3115 bytes
PNG 3色 796 bytes	PNG 4色 803 bytes	PNG 16色 1255 bytes

　　測試結果發現，PNG的圖形壓縮方式與GIF並不相同，GIF在橫狀圖形的高壓縮特點，並沒有在PNG上面看到。而有趣的是，在複雜度高的矩陣排列上，越複雜的矩陣，PNG壓縮的比值越高。逐漸提高複雜度的狀況之下，到了16色的漸層矩陣時，PNG的壓縮比甚至是GIF的1倍多，看來在壓縮複雜矩陣上，PNG扳回了一成。

 

測試四：128色以上複雜矩陣圖形

　　在測試三中，我們比較了16色標準矩陣。可是在實際使用狀況中，方方正正的標準矩陣圖形並不常用到。於是我們增加了128色以上的複雜圖形，模擬一般比較可能出現的圖形狀態，作為對照的參考。

GIF 16色 2.19k	GIF 32色 2.70k	GIF 64色 3.33k	GIF 128色 4.21k
PNG 16色 1.39k	PNG 16色 1.49k	PNG 16色 1.66k	PNG16色 1.90k

　　測試結果發現，PNG在『色塊』的壓縮上，確實有其獨到之處，儘管是複雜的排列方式以及高達128色的色階，PNG在壓縮比上依舊是GIF的約1倍多。用以往GIF的壓縮圖形經驗來看PNG的檔案大小，這樣的壓縮比，確實令人驚艷。不用說，PNG在這個測試上又狠狠電了GIF一大截。

 

測試四：文字型GIF透明圖檔

　　在以往各國字碼不相通的網路時代，解決字碼問題最可靠的辦法就是GIF文字，直接把文字轉成圖形，就可以把字碼與排版的問題一次解決。現在GIF文字不流行了，但是用透明GIF來解決排版問題，卻還是相當常見的用法。所以我們也測試了文字型GIF，當然也順便測試一下透明色的應用狀況。

透明GIF 2色 1108 bytes	透明GIF 3色 1325 bytes	透明GIF 4色 1478 bytes	透明GIF 5色 1561 bytes
透明PNG 2色 960 bytes	透明PNG 3色 1004bytes	透明PNG 4色 1184bytes	透明PNG 5色 1200bytes

　　基本的顯示都沒有問題，不論是GIF或是PNG在透明色上都相當正確，不過由於小P手邊沒有較舊版的IE，所以在舊版IE瀏覽器上是否依舊相容，這就不得而知了。Netscape 4.xx版似乎會有顯示上的問題，顏色會錯亂，大概是PNG圖形解譯器支援不全的因素。但是可以確信的是，在Netscape 6.0、IE5.5以上是完全相容的。

　　在圖形大小上，PNG保持著自測試三以來的優勢，依舊小幅領先GIF約15%左右。

 

結語

　　測試一天下來真是累壞了，不過收穫不少。然而對於PNG，我的感覺是：先天規劃佳，有一定優勢，但是後天發展不足。

　　在PNG的原先規劃上，對於GIF的完全取代性應該是第一要點，不過在Animation GIF的取代方案上卻偏偏漏掉了。後來該組織又發展出所謂MNG (Multiple-image Network Graphics)，企圖補足Animation上的不足，不過光是動態格式的不支援，我就給PNG打了一個大折扣，畢竟GIF的重要功能之一就是動態圖形，少了Animation的功能，GIF恐怕也稱霸不了這麼久。

　　此外，繪圖軟體的支援也是一大問題，目前PhotoShop 6.0版並不能夠藉由Save For Web功能，在PNG中有效儲存2bit以上的Alpha層，在規格上頗誘人的Gamma值設定也不見蹤跡，以這樣業界表率的大哥級軟體都不支援進階設定的狀況下來看，PNG的進階應用似乎還要等一段時間。如果真要在PhotoShop中儲存8bit Alpha，也是可以，利用Save As儲存PNG就可以保留8 Bit Alpha層，但是圖檔視複雜情況，會比2 bit Alpha多出約3-7倍以上的大小。這樣的檔案大小似乎不是Web用圖形可以容忍的，因此在8 bit Alpha的實用性上並不高。當然，如果您是Freehand的愛用者，那儲存的便利性就另當別論了，當然會比PhotoShop繞了一圈才能保留8 bit Alpha來得便利。不過對我來說，一張網頁設計稿要切換兩個同質性的繪圖軟體來割圖，只為了檔案大小有點嚇人的8 bit Alpha PNG.. 　唉，實在沒什麼說服力。

　　不過，PNG的高壓縮率，確實令人印象相當深刻。尤其是圖表型的圖片，PNG明顯的比GIF來的更有競爭力，在沒有動態圖形的困擾下，儲存PNG圖形跟GIF簡直沒有兩樣。而且圖形壓縮的更小，品質卻不受影響，這一點確實如W3C推薦般，圖形更小，且維持高品質。

　　整體來說，我並不會想要換用PNG。這是實話，儘管我討厭壟斷以及趁機收費，但是我還是傾向支持GIF檔案格式，因為GIF的相容度好，且Solution較為全面。對於講究相容、互通的網際網路來說，交換性勝過一切，而在這一點上，PNG可以努力的空間還很多。像是送幾個紅包給Adobe，請他們在下一版PS 7加入完整PNG支援，或是多發一些年終獎金給組織內的工程師，請他們用畢生的精力將MNG與PNG做整合，讓PNG也能夠做Animation PNG..等。開點小玩笑，總之看樣子，以現在的普及率來說，PNG短期內應該還不會取代GIF。此外，GIF授權金問題，我們也不用擔心，因為收取對象為繪圖軟體開發商而非使用者，只是要小心Adobe、MacroMedia、Ulead等大廠絕對會偷偷把授權金轉嫁到軟體售價上的。

 

小P撰於2001.2.21