網(wǎng)頁設(shè)計(jì)中對于圖像格式的選用技巧

　　GIF意為Graphics Interchange format(圖形交換格式)，GIF圖片的擴(kuò)展名是gif?，F(xiàn)在所有的圖形瀏覽器都支持GIF格式，而且有的圖形瀏覽器只認(rèn)識GIF格式。GIF是一種索引顏色格式，在顏色數(shù)很少的情況下，產(chǎn)生的文件極小，它的優(yōu)點(diǎn)主要有：

　　GIF格式支持背景透明。GIF圖片如果背景色設(shè)置為透明，它將與瀏覽器背景相結(jié)合，生成非矩形的圖片。

　　GIF格式支持動畫。在Flash動畫出現(xiàn)之前，GIF動畫可以說是網(wǎng)頁中唯一的動畫形式。GIF格式可以將單幀的圖象組合起來，然后輪流播放每一幀而成為動畫。雖然并不是所有的圖形瀏覽器都支持GIF動畫，但是最新的圖形瀏覽器都已經(jīng)支持GIF動畫。

　　GIF格式支持圖形漸進(jìn)。漸進(jìn)是指圖片漸漸顯示在屏幕上，漸進(jìn)圖片將比非漸進(jìn)圖片更快地出現(xiàn)在屏幕上，可以讓訪問者更快地知道圖片的概貌。

　　GIF格式支持無損壓縮。無損壓縮是不損失圖片細(xì)節(jié)而壓縮圖片的有效方法，由于GIF格式采用無損壓縮，所以它更適合于線條、圖標(biāo)和圖紙。

　　GIF格式的缺點(diǎn)同樣相當(dāng)明顯。索引顏色是歷史遺留的產(chǎn)物，在DOS下的老游戲幾乎無一例外的采用索引顏色，這種格式本來早就應(yīng)該淘汰了。但是由于帶寬的限制，GIF從DOS時(shí)代紅到了Internet時(shí)代。GIF這種索引顏色格式最大的缺點(diǎn)就是它只有256種顏色，這對于照片質(zhì)量的圖片是顯然不夠的。

　　JPEG代表Joint Photograhic Experts Group(聯(lián)合圖像專家組)，這種格式經(jīng)常寫成JPG，JPG圖片的擴(kuò)展名為jpg。

　　JPG最主要的優(yōu)點(diǎn)是能支持上百萬種顏色，從而可以用來表現(xiàn)照片。此外，由于JPG圖片使用更有效的有損壓縮算法，從而使文件長度更小，下載時(shí)間更短。有損壓縮會放棄圖像中的某些細(xì)節(jié)，以減少文件長度。它的壓縮比相當(dāng)高，使用專門的JPG壓縮工具其壓縮比可達(dá)180：1，而且圖像質(zhì)量從瀏覽角度來講質(zhì)量受損不會太大，這樣就大大方便了網(wǎng)絡(luò)傳輸和磁盤交換文件。JPG較GIF更適合于照片，因?yàn)樵谡掌袚p失一些細(xì)節(jié)不像對藝術(shù)線條那么明顯。另外，JPG對照片的壓縮比例更大，而最后的質(zhì)量也更好。

　　但是從長遠(yuǎn)來看，JPG隨著帶寬的不斷提高和存儲介質(zhì)的發(fā)展，它也應(yīng)該是一種被淘汰的圖片格式，因?yàn)橛袚p壓縮對圖像會產(chǎn)生不可恢復(fù)的損失。所以經(jīng)過壓縮的JPG的圖片一般不適合打印，在備份重要圖片時(shí)也最好不要使用JPG。還有，JPG也不如GIF圖像那么靈活，它不支持圖形漸進(jìn)、背景透明，更不支持動畫。

　　PNG是20世紀(jì)90年代中期開始開發(fā)的圖像文件存儲格式，其目的是企圖替代GIF和TIFF文件格式，同時(shí)增加一些GIF文件格式所不具備的特性。流式網(wǎng)絡(luò)圖形格式(Portable Network Graphic Format，PNG)名稱來源于非官方的“PNG's Not GIF”，是一種位圖文件(bitmap file)存儲格式，讀成“ping”。PNG用來存儲灰度圖像時(shí)，灰度圖像的深度可多到16位，存儲彩色圖像時(shí)，彩色圖像的深度可多到48位，并且還可存儲多到16位的α通道數(shù)據(jù)。PNG使用從LZ77派生的無損數(shù)據(jù)壓縮算法。

　　PNG文件格式保留GIF文件格式的下列特性：

　　使用彩色查找表或者叫做調(diào)色板可支持256種顏色的彩色圖像。

　　流式讀/寫性能(streamability)：圖像文件格式允許連續(xù)讀出和寫入圖像數(shù)據(jù)，這個(gè)特性很適合于在通信過程中生成和顯示圖像。

　　逐次逼近顯示(progressive display)：這種特性可使在通信鏈路上傳輸圖像文件的同時(shí)就在終端上顯示圖像，把整個(gè)輪廓顯示出來之后逐步顯示圖像的細(xì)節(jié)，也就是先用低分辨率顯示圖像，然后逐步提高它的分辨率。

　　透明性(transparency)：這個(gè)性能可使圖像中某些部分不顯示出來，用來創(chuàng)建一些有特色的圖像。

　　輔助信息(ancillary information)：這個(gè)特性可用來在圖像文件中存儲一些文本注釋信息。

　　獨(dú)立于計(jì)算機(jī)軟硬件環(huán)境。

　　使用無損壓縮。

　　PNG文件格式中要增加下列GIF文件格式所沒有的特性：

　　每個(gè)像素為48位的真彩色圖像。

　　每個(gè)像素為16位的灰度圖像。

　　可為灰度圖和真彩色圖添加α通道。

　　添加圖像的γ信息。

　　使用循環(huán)冗余碼(cyclic redundancy code，CRC)檢測損害的文件。

　　加快圖像顯示的逐次逼近顯示方式。

　　標(biāo)準(zhǔn)的讀/寫工具包。

　　可在一個(gè)文件中存儲多幅圖像。

　　網(wǎng)頁頁面中對于圖像格式的選用

　　文件結(jié)構(gòu)

　　這三種格式各有優(yōu)缺點(diǎn)，其中PNG優(yōu)點(diǎn)多多。雖然普及得還很一般，但是其特殊的優(yōu)越性已經(jīng)讓我們對其產(chǎn)生非常大的興趣。至少我現(xiàn)在很喜歡這種格式。當(dāng)然了對于制作頁面的制作人員來說，頁面總體積的大小那就是競爭力。所以我們還是必需要注意這三種格式的混合使用。那以什么時(shí)候用GIF什么時(shí)候用PNG什么時(shí)候用JPG呢?我們下面一一來分析。

　　在實(shí)際的工作中，我發(fā)現(xiàn)一般的純色的圖形，比如一些小圖標(biāo)、平鋪背景其中的色彩比較少，那么作為GIF格式雖然只有256種色彩，但是應(yīng)對這種類型的圖片那一定是非常的合適的。當(dāng)然了，不排除有一些特別的小圖標(biāo)色彩的豐富性，但是相信作為小圖標(biāo)其色彩有點(diǎn)損失也不會影響到整體的視覺效果，所以GIF的適用范圍是：小圖標(biāo)、平鋪背景等色彩比較少的小型圖片。

　　那么大圖片又怎么選擇呢，首先我們先了解一下JPG，我們使用Photoshop的朋友都知道，在最后導(dǎo)出圖片時(shí)會有一個(gè)地方讓我們選擇這個(gè)JPG圖片的圖片品質(zhì)，100%是表示無壓縮，當(dāng)我們拿同一張圖片導(dǎo)出不同的品質(zhì)圖片對比時(shí)我們發(fā)現(xiàn)品質(zhì)低的很明顯會比品質(zhì)高的臟了很多，這樣照片看起來就很不好，當(dāng)然我們也發(fā)現(xiàn)這種情況在偏大色塊的圖片中猶為突出。所以比如天空、人像。特別人像面部就會出現(xiàn)很難看的黑斑。當(dāng)然如果對于照片質(zhì)量要求不嚴(yán)格可以使用JPG并且降低品質(zhì)。但是不適用于背景、小圖標(biāo)。

　　我個(gè)人覺得PNG是介于GIF與高品質(zhì)JPG之間的一種選擇，如果是簡純的小圖標(biāo)，PNG會比GIF大這么一點(diǎn)，但是品質(zhì)上是差不多的。如果是普通的圖片，那么PNG還是要比高品質(zhì)的JPG要小一點(diǎn)的，但是PNG還是有點(diǎn)色彩損失的。不過如果圖片不放大基本上看不出來。我們做頁面基本上不是為了讓人放大了挑刺。所以PNG也就是介于中間的一種選擇。當(dāng)然了，PNG還有一個(gè)很偉大的優(yōu)點(diǎn)，那就是透明，雖然IE6之前還不支持這一特性。GIF也有透明，但是GIF只支持絕對的透明，不支持半透明，所以GIF的圖片的邊緣常會有一圈的白色的小點(diǎn)。而PNG就沒有這些問題，隨著時(shí)代的發(fā)展當(dāng)IE6成為歷史的時(shí)候我想我們就可以看到PNG的真實(shí)的威力。