1. 程式人生 > 實用技巧 >圖片格式中的小較真

圖片格式中的小較真

關於圖片格式,大家或多或少都能說出一兩種來,平時寫程式碼的時候也不時會用到不同格式的圖片。但是我們在具體使用過程中,為了達到最佳的使用者體驗,我們需要根據不同的環境來選擇不同格式的圖片。這篇文章將為大家介紹一下常見的圖片格式的特點。

向量圖與點陣圖

首先,我們先來說一說向量圖和點陣圖。所有的圖片都可以劃分到這種類別中的一個去。

我們平時畫圖的時候可以通過點線面這些幾何特徵明顯的要素畫圖,像這樣的。

wKiom1YeTcGCWT-TAADPYb_D5As664.jpg

也可以用許多點來構成圖畫,類似這樣。

wKiom1YeThWx51dMAACijEx4bgg368.jpg

而同樣,我們的電腦在顯示圖片的時候也可以分為兩種——向量圖和點陣圖。

向量圖是通過組成圖形的一些基本元素,如點、線、面,邊框,填充色等資訊通過計算的方式來顯示圖形的。就好比我們在幾何學裡面描述一個圓可以通過它的圓心位置和半徑來描述,當然還可以通過邊框的粗細、顏色以及填充的顏色等資料去描述它的樣式。而電腦在顯示的時候則通過這些資料去繪製出我們定義的影象。

向量圖的優點在於檔案相對較小,並且放大縮小不會失真。缺點則是這些完美的幾何圖形很難表現自然度高的寫實影象。

點陣圖又叫畫素圖或柵格圖,它是通過記錄影象中每一個點的顏色、深度、透明度等資訊來儲存和顯示影象。一張點陣圖就好比一幅大的拼圖,只不過每個拼塊都是一個純色的畫素點,當我們把這些不同顏色的畫素點按照一定規律排列在一起的時候,就形成了我們所看到的影象。所以當我們放大一幅畫素圖時,能看到這些拼片一樣的畫素點(如下圖)。

點陣圖的優點是利於顯示色彩層次豐富的寫實影象。缺點則是檔案大小較大,放大和縮小影象會盡管我們在web頁面中所使用的JPGPNGGIF格式的影象都是點陣圖,即他們都是通過記錄畫素點的資料來儲存和顯示影象,但這些不同格式的影象在記錄這些資料時的方式卻不一樣,這就是涉及到有失真壓縮和無失真壓縮的區別——是否失真。

我們在web頁面上所使用的影象都是點陣圖,即便有些稱為向量圖形(如向量icon等)也是指通過向量工具進行繪製然後再轉成點陣圖格式在web上使用的(區別於畫素繪製的圖形)。

有失真壓縮和無失真壓縮

接著,我們聊聊有失真壓縮和無失真壓縮。

有失真壓縮,在臺灣、港澳又稱作破壞性資料壓縮,

有損資料壓縮方法是經過壓縮、解壓的資料與原始資料不同但是非常接近的壓縮方法。有損資料壓縮又稱破壞型壓縮,即將次要的資訊資料壓縮掉,犧牲一些質量來減少資料量,使壓縮比提高。通俗點說,有失真壓縮就是在儲存影象的時候並不完全真實的記錄影象上每個畫素點的資料資訊,它會根據人眼觀察現實世界的特性(人眼對光線的敏感度比對顏色的敏感度要高,生物實驗證明當顏色缺失時人腦會利用與附近最接近的顏色來自動填補缺失的顏色)對影象資料進行處理,去掉那些影象上會被人眼忽略的細節,然後使用附近的顏色通過漸變或其他形式進行填充。這樣既能大大降低影象資訊的資料量,又不會對影象的還原效果有較大影響。

相對有失真壓縮而言,無失真壓縮則會真實的記錄影象上每個畫素點的資料資訊,但為了壓縮影象檔案的大小會採取一些特殊的演算法。無失真壓縮的壓縮原理是先判斷影象上哪些區域的顏色是相同的,哪些是不同的,然後把這些相同的資料資訊進行壓縮記錄,(例如一片藍色的天空之需要記錄起點和終點的位置就可以了),而把不同的資料另外儲存(例如天空上的白雲和漸變等資料)。就像下圖所示的一樣,壓縮軟體將每一種顏色進行編號,然後對畫素點的顏色進行歸類,記錄下哪種顏色出現在哪個畫素點上,這樣既壓縮了儲存空間,在還原圖片時也不會影響圖片質量。

wKioL1YeTkCA_tkPAAB6b96xHZ0521.jpg

JpgJPEG),GIFpng三種圖片格式

我們平時接觸和使用得最多的就是JPGGIFPNG這三種格式了。

JPGJPEG

聯合照片專家組(外語簡稱JPEG外語全稱:JointPhotographicExpertGroupJPEG也是最常見的一種影象格式,它是由聯合照片專家組(外語全稱:JointPhotographicExpertsGroup),檔案後輟名"jpg""jpeg",是最常用的影象檔案格式

JPGJPEG)是我們最常見的採用有失真壓縮對影象資訊進行處理的圖片格式。JPG在儲存影象時會把影象分解成8*8畫素的柵格(如下圖),然後對每個柵格的資料進行壓縮處理,當我們放大一幅影象的時候,就會發現這些8*8畫素柵格中很多細節資訊被去除,而通過一些特殊演算法用附近的顏色進行填充(為了讓大家看得更清楚我將影象的壓縮比率調到很低)。這也是為什麼我們用JPG儲存影象有時會產生塊狀模糊的原因。

wKiom1YeTiqhsX4OAAEnM6jVkTQ504.jpg

JPGJPEG)格式的優缺點:

優點:

攝影作品或寫實作品支援高階壓縮。

利用可變的壓縮比可以控制檔案大小。

支援交錯(對於漸近式JPGJPEG檔案)。

JPGJPEG 廣泛支援 Internet 標準。

缺點:

有損耗壓縮會使原始圖片資料質量下降。

當我們編輯和重新儲存JPGJPEG檔案時,JPGJPEG會混合原始圖片資料的質量下降。這種下降是累積性的。

JPGJPEG 不適用於所含顏色很少、具有大塊顏色相近的區域或亮度差異十分明顯的較簡單的圖片。

GIF

圖形交換格式(外語簡稱:GIF、外語全稱:GraphicsInterchangeFormat),是CompuServe公司在 1987年開發的影象檔案格式GIF格式,是為使圖片能夠應用在線上應用程式上所特別開發的圖片格式。Gif,有時也被稱為為“Giff”,是一種無損,8點陣圖片格式。無損是指100%的保持原始圖片的畫素資料資訊。“8是指,所能表現的顏色深度——一個8點陣圖像僅最多隻能支援256種不同顏色(一個多餘256種顏色的圖片若用gif圖片儲存會出現失真)。

GIF格式有四大特性

透明特性:
GIF支援基本的透明特性,這意味著你能夠使圖片的某些畫素不可見。在其被放置到網頁中時,我們就可以看到通過這些不可見區域看到此圖片後面的背景顏色(圖片)。此特性非常有用:如果你需要將某個gif圖片的內容置於所有圖片的上層,你可以將其設定為透明。
壓縮特性:
GIF格式採用LZW演算法進行壓縮,此演算法是Unisys申請的一項專利。在很久很久之前,如果你想使用GIF格式,那麼就意味著你需要向Unisys付費申請專利許可。不過值得高興的是,此項專利技術已於2003620日過期,我們現在使用GIF是完全免費的。
快速載入:
GIF同時也支援隔行掃描。隔行掃描能夠令圖片在瀏覽器中更快的載入和顯示。此特性對於那些慢網速的瀏覽者來說尤其實用。
動畫GIF
一個動態的GIF檔案,是由若干幀圖片所聯結而成的動態圖片。在顯示時,這些動態幀被反覆的繪製讀取出來從而形成了簡單的動畫效果。

PNG

前面說過,以前使用GIF格式是要收錢的,那不想給錢怎麼辦?於是用來代替GIF格式的行動式網路圖形(外語簡稱PNG、外語全稱:PortableNetworkGraphics)就應運而生了。PNG格式,初始時被作為GIF的免費替代格式所開發,採用公共專利壓縮演算法。PNG目前有PNG8PNG24兩種格式,不過PNG最多可以支援48位通道。PNG8最多隻能索引256種顏色,所以對於顏色較多的影象不能真實還原;PNG24則可以儲存1600多萬種顏色,基本能夠真實還原我們人類肉眼所可以分別的所有顏色.

1、能在保證最不失真的情況下儘可能壓縮影象檔案的大小。

2PNG用來儲存灰度影象時,灰度影象的深度可多到16位,儲存彩×××像時,彩×××像的深度可多到48位,並且還可儲存多到16位的α通道資料。

3、對於需要高保真的較複雜的影象,PNG雖然能無失真壓縮,但圖片檔案較大,不適合應用在Web頁面上。

wKioL1YeTYqwEOwkAAE3K4hR8AI421.jpg

JPGPNGGIF使用對比

這裡只是介紹了一些常見的圖片格式的情況,在維基百科裡有詳細的圖片格式的介紹,有興趣可以去看看。

https://zh.wikipedia.org/wiki/%E5%9B%BE%E5%BD%A2%E6%96%87%E4%BB%B6%E6%A0%BC%E5%BC%8F%E6%AF%94%E8%BE%83

如果大家還想繼續深入地瞭解一下圖片格式的一些具體的演算法實現,可以去看看

bmp/gif/jpg圖象最底層原理分析

http://www.cnblogs.com/glaivelee/archive/2011/10/10/2205151.html

wKioL1YeTlqTDhmsAABVv4OpEoM179.jpg

wKioL1YeTlrB9B0tAAC-5t90OrA212.jpg


轉載於:https://blog.51cto.com/xiaoqin00/1702952