html頁面中圖像格式的選用之我見
這三種格式各有優(yōu)缺點,其中PNG優(yōu)點多多。雖然普及得還很一般,但是其特殊的優(yōu)越性已經(jīng)讓我們對其產(chǎn)生非常大的興趣。至少我現(xiàn)在很喜歡這種格式。當(dāng)然了對于制作頁面的制作人員來說,頁面總體積的大小那就是競爭力。所以我們還是必需要注意這三種格式的混合使用。那以什么時候用GIF什么時候用PNG什么時候用JPG呢?我們下面一一來分析。
在實際的工作中,我發(fā)現(xiàn)一般的純色的圖形,比如一些小圖標、平鋪背景其中的色彩比較少,那么作為GIF格式雖然只有256種色彩,但是應(yīng)對這種類型的圖片那一定是非常的合適的。當(dāng)然了,不排除有一些特別的小圖標色彩的豐富性,但是相信作為小圖標其色彩有點損失也不會影響到整體的視覺效果,所以GIF的適用范圍是:小圖標、平鋪背景等色彩比較少的小型圖片。
那么大圖片又怎么選擇呢,首先我們先了解一下JPG,我們使用Photoshop的朋友都知道,在最后導(dǎo)出圖片時會有一個地方讓我們選擇這個JPG圖片的圖片品質(zhì),100%是表示無壓縮,當(dāng)我們拿同一張圖片導(dǎo)出不同的品質(zhì)圖片對比時我們發(fā)現(xiàn)品質(zhì)低的很明顯會比品質(zhì)高的臟了很多,這樣照片看起來就很不好,當(dāng)然我們也發(fā)現(xiàn)這種情況在偏大色塊的圖片中猶為突出。所以比如天空、人像。特別人像面部就會出現(xiàn)很難看的黑斑。當(dāng)然如果對于照片質(zhì)量要求不嚴格可以使用JPG并且降低品質(zhì)。但是不適用于背景、小圖標。



我個人覺得PNG是介于GIF與高品質(zhì)JPG之間的一種選擇,如果是簡純的小圖標,PNG會比GIF大這么一點,但是品質(zhì)上是差不多的。如果是普通的圖片,那么PNG還是要比高品質(zhì)的JPG要小一點的,但是PNG還是有點色彩損失的。不過如果圖片不放大基本上看不出來。我們做頁面基本上不是為了讓人放大了挑刺。所以PNG也就是介于中間的一種選擇。當(dāng)然了,PNG還有一個很偉大的優(yōu)點,那就是透明,雖然IE6之前還不支持這一特性。GIF也有透明,但是GIF只支持絕對的透明,不支持半透明,所以GIF的圖片的邊緣常會有一圈的白色的小點。而PNG就沒有這些問題,隨著時代的發(fā)展當(dāng)IE6成為歷史的時候我想我們就可以看到PNG的真實的威力。
當(dāng)然了有一種特別的情況可能會很特別,那就是背景圖片與前景圖片的切合處,這種地方需要色彩結(jié)構(gòu)一致才能產(chǎn)生良好的視覺效果。那么這種時候注意盡可能的不要使用不同格式混合使用。
相關(guān)文章
firefox background-image垂直平鋪問題的解決方法
firefox下background-image的垂直平鋪repeat-y不設(shè)置height的解決辦法2008-07-07
Internet Explorer 8 beta 中文版與IE7共存的解決方法
今天安裝了IE8,去微軟網(wǎng)站下載的時候發(fā)現(xiàn)已經(jīng)提供中文版的beta了,哈哈 發(fā)現(xiàn)IE8沒有傳說中的那么妖魔化,不錯的瀏覽器,新增功能不錯。2008-05-05
《CSS3實戰(zhàn)》筆記--漸變設(shè)計(二)
這篇文章主要介紹了《CSS3實戰(zhàn)》筆記--漸變設(shè)計(二,需要的朋友可以參考下2016-05-05

