四大主要網頁影像格式
選擇合適的影像格式能把你的檔案大小減半——如果選錯則會加倍。下面是何時使用每種格式的實用概覽。
JPG (JPEG)
最適合:照片、帶大量色彩漸層的複雜場景。
壓縮:有損。永久丟棄細微的色彩資料。 透明度:不支援。 瀏覽器支援:100%——每個瀏覽器和裝置。 典型檔案大小:1200 萬像素照片在 85% 品質下為 2–5 MB。
JPG 自 1992 年起就是照片的標準。其近乎通用的支援使它成為當你不知道影像將在什麼平台上顯示時的安全預設選擇。
PNG
最適合:螢幕截圖、標誌、插畫、帶文字的影像、帶透明度的影像。
壓縮:無損。每個像素都被精確保留。 透明度:支援(Alpha 通道)。 瀏覽器支援:100%。 典型檔案大小:1200 萬像素照片為 20–40 MB(不適合照片)。
當像素級完美的準確度很重要時使用 PNG——用於 UI 螢幕截圖、圖形素材,或任何你將多次編輯的影像。切勿在網站上將 PNG 用於照片;檔案太大了。
WebP
最適合:希望檔案比 JPG 小、格式彈性比 PNG 更廣的網頁影像。
壓縮:有損和無損兩種模式都可用。 透明度:支援。 瀏覽器支援:所有現代瀏覽器(Chrome、Firefox、Safari 14+、Edge)。不支援 IE。 典型檔案大小:在同等視覺品質下比 JPG 小 25–35%。
WebP 由 Google 建立,現在是大多數網頁影像的推薦格式。如果你的受眾使用現代瀏覽器,從 JPG 切換到 WebP 是在沒有任何視覺代價的情況下減少頁面重量的簡單方法。
AVIF
最適合:最大壓縮至關重要的高品質影像——主視覺圖、大型產品照片。
壓縮:有損和無損。 透明度:支援。 瀏覽器支援:Chrome 85+、Firefox 93+、Safari 16+。良好但不通用。 典型檔案大小:在同等品質下比 JPG 小 40–50%。
AVIF 提供任何主流格式中最好的壓縮。代價是編碼較慢(我們的轉換器對大檔案可能需要幾秒)以及瀏覽器支援略低於 WebP。
快速決策指南
網頁用照片 → WebP(或為最大相容性用 JPG) 帶透明度的標誌或圖示 → PNG(或 WebP) 現代網站的主視覺圖 → AVIF 透過電子郵件分享的影像 → JPG 螢幕截圖 → PNG 要分享的 iPhone 照片 → JPG(從 HEIC 轉換)