JPG、GIF、PNG檔比較表

圖檔

GIF檔

JPG檔

PNG檔

漸層色彩

不佳

透明背景


(IE6以下不支援透明背景)

動畫效果

最適色彩輸出

256色

壓縮比80%以上

png32以上格式

色彩量

256色

24bit

48bit

檔案大小

較小

較大

適用時機

  1. Icon圖示
  2. 圖片無漸層色彩
  3. 圖片需透明背景
  4. GIF動畫
  1. 全彩照片
  2. 含漸層色彩的圖片
  1. 網頁介面
  2. 圖片需漸層又透明的背景

 

GIF檔的特色

  1. 網頁讀取速度最快 (檔案最小)
  2. 唯一支援動畫效果的格式
  3. 支援色彩最少 (失真嚴重)

下圖為GIF檔壓縮為「32色」的壓縮結果

網頁設計 gif檔

 

JPG檔的特色

  1. 網頁讀取速度中等
  2. 唯一不支援背景透明的格式
  3. 支援色彩中等

下圖為JPG檔壓縮品質為30的壓縮結果:

網頁設計 jpg檔


PNG檔的特色

  1. 網頁讀取速度最慢 (檔案最大)
  2. 支援色彩與效果最多,最精緻 (漸層、透明、不失真)
  3. IE6以下不支援PNG檔的透明背景

下圖為PNG格式為「PNG8」的輸出結果

網頁設計 png檔

 

{#eric}

ABOUT CADIIS

CADIIS凱士網頁設計公司專精於RWD網頁設計、形象網站設計、企業網站建置等各項網頁設計服務,提供台北、台中、台南、高雄、海外等地網站設計相關服務。

 

進一步了解