程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 更多編程語言 >> 更多關於編程 >> WEB開發中圖片格式的合理選擇

WEB開發中圖片格式的合理選擇

編輯:更多關於編程

      從某種程度上說,判斷一個網頁設計師是否優秀,可以從其在WEB開發(或網頁設計)中是否合理的采用各種圖片格式得出結論。事實上,或許所有人都知道圖片存在GIF,JPG和PNG等格式,但並非所有人都知道它們之間的具體區別和使用技巧。

      接下來將給大家介紹:WEB開發中幾種最受歡迎圖片格式的前世今生以及如何正確的使用它們。

      1.JPEG

      JPEG格式是一種大小與質量相平衡的壓縮圖片格式。通俗一點講,就是:高的壓縮比=低的圖片質量=小的文件大小。反之,低的壓縮比=高的圖片質量=大的文件大小。由於JPEG文件無法保持100%的原始圖像的像素數據,所以它不被認為是一種無損圖像格式。

      用途:

      由於這種極其敏感的平衡特性,JPEG非常適合被應用在那些允許輕微失真的像素色彩豐富的圖片(照片)場合。反之,JPEG格式圖片並不適合做簡單色彩(色調少)的圖片,比如LOGO,各種小圖標(ICONS)。

      2.GIF

      GIF格式,是為使圖片能夠應用在在線(online)應用程序上所特別開發的圖片格式。Gif,有時也被成為“Giff”,是一種無損,8位圖片格式。“無損”是指100%的保持原始圖片的像素數據信息。專業名詞“8位”是指,所能表現的顏色深度——一個8位圖像僅最多只能支持256種不同顏色(一個多余256種顏色的圖片若用gif圖片保存會出現失真)。

      用途:

      由於8位顏色深度的限制,Gif不適合應用於各種色彩過於豐富的照片存儲場合。但它卻非常適合應用在以下場合:

      * Logo

      * 小圖標(Icon)

      * 用於布局的圖片(例如某個布局角落,邊框等等)

      * 僅包含不超過256種色彩的簡單,小型圖片場合

      透明特性:

      GIF支持基本的透明特性,這意味著你能夠使圖片的某些像素“不可見”。在其被放置到網頁中時,我們就可以看到通過這些不可見區域看到此圖片後面的背景顏色(圖片)。此特性非常有用:如果你需要將某個gif圖片的內容置於所有圖片的上層,你可以將其設置為透明。

      壓縮特性:

      GIF格式采用LZW算法進行壓縮,此算法是Unisys申請的一項專利。在很久很久之前,如果你想使用GIF格式,那麼就意味著你需要向Unisys付費申請專利許可。不過值得高興的是,此項專利技術已於2003年6月20日過期,我們現在可以免費的使用GIF了!

      隔行掃描:

      GIF同時也支持隔行掃描。隔行掃描能夠令圖片在浏覽器中更快的加載和顯示。此特性對於那些慢網速的浏覽者來說尤其實用。

      動畫GIF:

      一個動態的GIF文件,是由若干幀圖片所聯結而成的動態圖片。在顯示時,這些動態幀被反復的繪制讀取出來從而形成了簡單的動畫效果。合理的運用GIF動畫能夠為網頁增添動靜結合的效果,而過度的使用則會使網頁雜亂無章。

      3.PNG

      PNG,讀“ping”,初始時被作為GIF的免費替代格式所開發,采用公共專利壓縮算法。PNG格式也是一種無損壓縮,但與GIF格式不同的是,PNG同時支持8位和24位的圖像。

      8位PNG圖像:

      一個8位PNG圖片,支持透明背景且像素顏色不能超過256種。除了壓縮算法不同之外,此8位PNG格式與GIF格式極其相似;

      用途:

      8位PNG圖片的用途與GIF格式基本相同,

      * Logo

      * 小圖標(Icon)

      * 用於布局的圖片(例如某個布局角落,邊框等等)

      * 僅包含不超過256種色彩的簡單,小型圖片場合

      24位PNG圖像:

      24位PNG,支持160萬種不同的像素顏色且支持Alpha透明效果,這就意味著,無論透明度設置為多少,PNG圖片均能夠與背景很好的融合在一起。

      對PNG的支持:

      由於PNG格式的廣泛使用和開發者更加重視網頁的WEB標准,不同浏覽器對PNG的支持就顯得相當重要了。不過,幸運的是,目前市場上主流的浏覽器對PNG格式都有很好的支持,這包括:IE,Firefox,Safari,Opera,and Konqueror。

      *但不幸的是,IE6及IE6以下的浏覽器對PNG透明背景的支持並不好。不過我們仍可以通過其他方法來解決這個問題,詳情請查看如何在IE6中正常顯示透明PNG。

    1. 上一頁:
    2. 下一頁:
    Copyright © 程式師世界 All Rights Reserved