圖片格式轉換

JPEG、PNG、WebP 圖片格式互轉

格式轉換在 JPEG、PNG、WebP 三者之間互換：先把來源圖解碼、原尺寸重繪到一塊畫布上，再讓瀏覽器內建的編碼器用你選的格式重新寫一次。像素的寬高完全不動，變的是外面那層編碼方式，以及隨之而來的檔案大小與透明度支援。

使用步驟

  1. 先把圖丟進虛線框。選檔之後畫面才會展開下面的選項，在那之前只有一個空框是正常的。
  2. 在「輸出格式」那一排三顆按鈕裡挑一個：JPEG、PNG、WebP。預設選中的是 WebP，被選中的那顆會亮起主色邊框。
  3. 選 JPEG 或 WebP 時，下面會出現「品質：90%」滑桿（1–100）；改選 PNG 的話整根滑桿會直接消失，因為 PNG 是無損格式，給它品質參數也沒有用。
  4. 按「轉換」。跑完之後按鈕右邊會出現一行 原始大小 → 新大小 的對照，這是判斷這次轉換划不划算最直接的依據。
  5. 下方預覽旁的按鈕會標成「下載 WEBP」之類的字樣，跟著你選的格式變。存下來的檔名是原檔名換掉副檔名，不加任何前綴。
  6. 想比較不同品質的結果，改完滑桿要再按一次轉換 —— 數字不會自己重算。

什麼時候用得上

把網站上的 PNG 截圖換成 WebP

產品說明頁、技術文件裡那些介面截圖，用 WebP 存通常比 PNG 少三到五成，而且同樣支援透明。轉完先看那行大小對照，真的有差再替換，別為了時髦而換 —— 少數色塊極單純的圖，PNG 反而更小。

把別人給的 WebP 轉回 JPEG 交出去

從網頁上存下來的圖現在十有八九是 WebP，而不少上傳表單、投影片範本、印刷廠的收件流程只認 JPEG。轉成 JPEG 是這種場合最省事的通行證，代價是透明背景會被填實色，這點請先確認過再送出。

同一張圖三種格式各存一次，實測哪個划算

與其相信「WebP 一定比較小」這種通則，不如就用手上這張圖試三次：每按一次轉換，畫面就給你一組實際位元組數。照片、純色插畫、含大量文字的截圖，三種內容的排名並不一樣，量過再決定比背規則可靠。

把混雜的素材統一成同一種格式再進下一關

從各處蒐集來的圖有 PNG 有 JPEG 有 WebP，丟進拼版、轉 PDF 或自動化腳本時常常在某一個格式上卡住。先全部轉成同一種（要保留透明就選 PNG，只求體積小且工具鏈吃得下就選 WebP），後面的步驟會少掉一堆例外處理。

限制與注意事項

  • 轉成 JPEG 會把透明區域變成黑色，這是這個工具最容易踩到的一件事。程式沒有在畫圖之前先填一層底色，而 JPEG 沒有 alpha 通道，於是那些原本透明的像素帶著 RGB 全零的值被寫進檔案，看起來就是一塊黑。去背的 logo、有圓角陰影的截圖都會中招；需要白底請先在別的軟體上合成，或者乾脆選 WebP —— 它是這裡唯一同時支援透明與有損壓縮的選項。（順帶一提，隔壁的圖片壓縮工具在輸出 JPEG 時會補白底，兩個工具在這一點上並不一致。）
  • 每一次轉換都是完整的「解碼 → 重繪 → 重新編碼」，不是把位元組換個包裝。就算來源與目標是同一種格式，畫質也會再損失一輪，所以請一律從最原始的檔案轉，不要拿轉過的成品接著轉。
  • 選 PNG 時輸出必定是無損的，這也意味著 JPEG 轉 PNG 幾乎一定爆增檔案大小 —— 編碼器會把原本 JPEG 那些壓縮瑕疵一個像素一個像素忠實地保存下來，翻兩三倍很常見。反過來說，PNG 轉 JPEG 通常小很多，但那是丟掉細節換來的，不可逆。
  • 輸出的像素寬高一律沿用來源，畫面上也沒有任何尺寸欄位。要同時改尺寸請先用尺寸調整工具處理完再過來。
  • 換了檔案但還沒按轉換時，那行大小對照可能顯示上一張圖的轉換結果 —— 程式在換檔時清掉了預覽圖，卻沒有把上一次的輸出大小一併歸零。只要按下轉換，數字就會刷新成當前這張圖的，看到怪數字不必緊張。
  • 瀏覽器解不開的檔案會讓按鈕永遠停在「轉換中…」：程式在圖片載入成功時才會收尾，載入失敗沒有對應的處理。iPhone 的 HEIC 原檔、副檔名對不上內容的檔案最容易觸發，遇到了重新整理頁面即可。
  • 動態 GIF 與動態 WebP 只會留下第一格，SVG 會被畫成固定尺寸的點陣圖 —— 這三種格式在拖放時都不會被拒絕，因為檢查只看 MIME 型別是不是 image/ 開頭。
  • 重新編碼會讓 EXIF 消失，這在把照片放上網之前反而是好事：GPS 座標與拍攝時間不會跟著圖片一起公開。
  • 檔名是把原檔名最後一個點之後的部分換掉；如果來源檔案根本沒有副檔名，你會拿到一個只剩 .webp 的檔名，下載後手動補上名字即可。
  • 一次只轉一張，單檔上限 10 MB，也沒有 AVIF、HEIC、GIF、BMP、ICO 或 SVG 這些輸出選項 —— 畫面上就是那三顆按鈕，沒有隱藏設定。

常見問題

我的圖會被上傳嗎？

不會。解碼與編碼都由瀏覽器內建的能力完成，圖片資料從 URL.createObjectURL 進來、從 canvas.toBlob 出去，沒有任何一步把它送出去。（頁面本身載有廣告等第三方資源，那些請求不含你的圖片內容。）

我的透明 logo 轉成 JPEG 之後背景變黑了，怎麼救？

沒有辦法從那個黑底檔案救回來，透明資訊在編碼時就丟了，請回頭用原始檔重來。如果目的地允許 WebP，直接轉 WebP 最省事，透明會完整保留。非要 JPEG 的話，先在任何一個影像編輯器（甚至簡報軟體）裡把圖疊在一塊白色矩形上合併，匯出成不含透明的圖，再回來轉。

WebP 現在可以放心用了嗎？

瀏覽器端早就不是問題，主流瀏覽器近年的版本都能顯示。真正會卡住的是瀏覽器以外的地方：舊版 Office、部分內容管理系統的上傳檢查、印刷廠的收件規格、以及一些桌面看圖軟體。做網頁請放心用，要交檔給別人之前先問一句。

品質 90 的 JPEG 和品質 90 的 WebP 是同一件事嗎？

不是。兩種編碼器的數值刻度不同，同樣是 90，WebP 通常會小上一截，而肉眼品質相當。實務上 WebP 落在 75–85 就已經很好看了，JPEG 則建議別低於 70。這個工具預設 90 是偏保守的安全值，想壓更小就自己往下拉，然後看那行大小對照決定停在哪。

這算「無損轉檔」嗎？

只有轉成 PNG 時輸出端是無損的，但「輸出無損」不等於「整趟無損」：來源如果是 JPEG，它已經丟掉的細節不會因為換成 PNG 就回來。轉成 JPEG 或 WebP 則是明確的有損過程，每一輪都會再吃掉一點畫質。

可以轉 AVIF 或讀 HEIC 嗎？

兩者都不行。輸出只有那三顆按鈕，沒有 AVIF；輸入端則受限於瀏覽器解不解得開，HEIC 在多數桌面瀏覽器上讀不進來，按下轉換只會卡在「轉換中…」。iPhone 的照片建議在手機的相機設定裡改成「最相容」拍成 JPEG，或先用系統內建功能匯出一份 JPEG 再處理。