如何將 PNG 轉換為 WebP——檔案縮細 26% 同時保留透明度
PNG 係網頁上無損圖片嘅黃金標準——非常適合標誌、截圖、圖示以及任何具有銳利邊緣或透明度嘅內容。問題在於,按照現代標準,PNG 嘅壓縮並唔特別高效。Google 自己嘅基準測試顯示,無損 WebP 圖片平均比等效 PNG 細 26%。呢個意味住如果你嘅網站每次頁面載入提供 5 MB 嘅 PNG 圖片,切換到 WebP 將喺資料傳送上節省超過 1.3 MB,且零品質損失。零。每個像素都係相同嘅。透明度、Alpha 通道、清晰嘅文字——一切都保持不變,只係裝喺一個更緊湊嘅容器裡。我哋嘅 PNG 轉 WebP 轉換器支援無損模式(相同品質,更細檔案)同有損模式(積極壓縮以獲得更細檔案,品質略有降低)。兩種模式都保留透明度。本指南走查轉換過程、截至 2025 年嘅相容性情況,以及如何為你嘅特定 PNG 素材喺無損同有損 WebP 之間做出決定。
PNG轉WebP轉換器
免費 · 無需註冊
分步指南
上載你嘅 PNG 檔案
將你嘅 PNG 拖放到轉換器上。該工具接受最大 50 MB 嘅 PNG-8、PNG-24 同 PNG-32 檔案(後者包括 Alpha 通道)。上載即時完成——冇資料傳送到任何伺服器。轉換器喺你嘅瀏覽器中直接讀取檔案,並準備使用現代瀏覽器內建嘅 WebP 編碼器重新編碼。
選擇無損或有損模式
選擇「無損」以獲得平均 26% 嘅體積縮減,像素品質完全相同。呢個係標誌、UI 元素、截圖同任何包含文字嘅圖片嘅推薦模式。選擇「有損」如果你想要更細嘅檔案並能容忍輕微嘅品質降低——將品質滑桿設為 80–90% 對圖示同裝飾圖形效果良好。
下載你嘅 WebP 檔案
點擊「轉換」,你嘅 WebP 喺一秒內產生。對比轉換前後嘅體積——一張 200 KB 嘅 PNG-24 標誌通常會變成 145–155 KB 嘅無損 WebP。預覽顯示你嘅圖片,透明處以棋盤格顯示,咁你可以喺下載前驗證 Alpha 通道係咪完好。
使用技巧與最佳實踐
無損 PNG 轉 WebP 轉換平均產生 22–34% 嘅體積縮減,26% 係 Google WebP 研究中常引用嘅數字。用你自己嘅圖片測試以確切了解你能節省幾多。
具有大面積平色嘅 PNG 圖片(標誌、圖示、UI 元素)通常比相片型 PNG 壓縮得更好。一個平色標誌可能縮細 35–40%,而帶有漸層嘅截圖可能只縮細 15–20%。
應用於 PNG 嘅 90% 品質有損 WebP 通常產生比原始細 60–70% 嘅檔案,視覺品質喺正常觀看距離下與原始無法區分。對於圖片密集型博客嚟講,呢個係一個強大嘅選項。
對於帶有 Alpha 透明度嘅 PNG,WebP 無損模式保留 Alpha 通道嘅每個像素。透明度喺數學上係相同嘅——投影、羽化邊緣同部分不透明度都能喺轉換後完好保留。
截至 2025 年,WordPress 唔會原生產生上載 PNG 嘅 WebP 版本。像 WebP Express、Imagify、ShortPixel 同 EWWW Image Optimizer 咁嘅外掛填補咗呢一空白。將佢哋嘅壓縮率與我哋嘅手動轉換器進行比較,搵到最適合你網站嘅管線。
轉換 CSS sprite 中使用嘅 PNG 圖示時,一次性轉換整個 sprite 表而唔係單個圖示。呢個保留咗 sprite 座標,免去你重新計算位置嘅麻煩。
轉換後,喺 Safari(桌面同 iOS)中測試你嘅 WebP。Safari 14+ 支援 WebP,但某些舊裝置上嘅用戶可能仍然睇到破損嘅圖片。檢查你嘅分析以確定呢個影響咗幾大比例嘅受眾。
永遠唔好刪除你嘅原始 PNG 檔案。始終保留 PNG 作為你嘅母版副本——佢係無損嘅,並且可以喺將來以任何品質級別重新編碼為 WebP,而唔會累積世代損失。
常見問題解答
PNG 轉 WebP 轉換對於網頁效能係純粹嘅勝利——更細嘅檔案、無損模式下相同嘅品質、完整嘅透明度支援以及廣泛嘅瀏覽器相容性。26% 嘅平均體積縮減喺每次頁面瀏覽、每次存取同每個用戶身上累積。今日轉換你嘅 PNG,開始為你嘅受眾提供更快嘅體驗。
免費試用此工具 →open_in_new