UltKit

JPG 轉 WebP

把網站上的 JPG 照片轉成 WebP,所有現行瀏覽器都能顯示,檔案更小。批次上傳,品質維持 80 或自行調整,下載的檔案通常輕四分之一到三分之一。

圖片轉換器

或將JPG, JPEG, JPE … 檔案拖曳到這裡 ·

每個檔案最大 95 MB· 最多 20 個檔案· 30 分鐘後刪除

輸出

檔案會在我們的伺服器上處理,並於 30 分鐘後刪除。

使用方式

  1. 1

    上傳網站上的 JPG

    將商品照、部落格封面圖或相簿照片拖曳到上傳區。每批最多 20 個檔案,單一檔案最大 95 MB。

  2. 2

    設定 WebP 品質

    品質預設為 80,適合原本以 85–90 儲存為 JPG 的照片,是常見的起點。請保持關閉無損;開啟只會讓照片變大,不會變好。

  3. 3

    轉換並替換

    按下轉換為 WebP,下載檔案或 ZIP,再上傳到現有 JPG 旁邊,這樣兩種格式都能提供。

解答

JPG 轉 WebP 值得嗎?

值得,只要圖片放在你經營的網站上。在相同視覺品質下,WebP 通常能節省四分之一到三分之一的位元組,而且 2020 年以後發布的所有瀏覽器都支援。請保留原始 JPG 作為備援。

JPG 轉 WebP,讓網頁載入更快

圖片通常是網頁中最重的部分,而且大多仍是 JPG,因為相機、手機和圖庫產出的都是這種格式。Google 在 2010 年推出 WebP,就是要取代這些檔案、讓它們更小。它的有損模式以 VP8 影片編碼為基礎,會根據相鄰區塊預測每個區塊,而不是像 JPEG 那樣各自編碼每個 8 × 8 區塊。

實際的結果就是同一張圖用更少的位元組。在有十二張 150 KB 照片的商品頁上,每張縮減四分之一到三分之一,每次造訪可省下數百 KB,直接反映在最大內容繪製(LCP)上;這是 Core Web Vitals 中,計算畫面上最大圖片或文字區塊載入時間的指標。

對訪客來說,支援度已不成問題。Chrome 顯示 WebP 已超過十年,Firefox 從 2019 年的 65 版開始,Safari 則從 2020 年的 14 版開始。尚未跟上的在瀏覽器之外:電子郵件用戶端、部分產生連結預覽的社群平台,以及桌面軟體。因此合理的做法是對瀏覽器提供 WebP,其他情況保留 JPG。

JPG 照片該選哪個 WebP 品質

  1. 50

    縮圖與小型卡片;在大螢幕上會看出模糊

  2. 70

    細節不多的背景圖與滿版橫幅

  3. 80

    此處的預設值;商品與部落格照片看起來與 JPG 相同

  4. 90

    含細小文字、布料紋理或銳利邊緣的照片

用 picture 元素提供 WebP 並以 JPG 作為備援

HTML:優先使用 WebP,JPG 作為備援
<picture>
  <source srcset="/images/sofa.webp" type="image/webp">
  <img src="/images/sofa.jpg" alt="灰色三人座沙發" width="1200" height="800">
</picture>

JPG

JPEG 影像

JPEG(或 JPG)是使用最廣泛的照片格式,由 Joint Photographic Experts Group 於 1992 年標準化。它採用失真壓縮,捨棄肉眼不易察覺的細節,讓照片小到適合網頁、電子郵件和手機儲存。它能妥善處理平滑漸層和自然景物,但銳利的文字、線稿和純色區域會出現明顯的區塊或模糊瑕疵。JPEG 沒有透明度也沒有動畫,每次重新儲存都會再損失一點畫質。所有瀏覽器、手機、相機和影像編輯器都能開啟。

壓縮方式
有損
透明度
不支援
動畫
不支援
推出年份
1992 · Joint Photographic Experts Group
JPG 轉檔工具

WEBP

WebP 圖片

WebP 是 Google 於 2010 年推出的圖片格式,目的是讓網頁載入更快。它在同一種格式中同時支援有損與無損壓縮、Alpha 透明度與動畫。在視覺品質相近時,有損 WebP 檔案通常比 JPEG 小 25–35%,無損 WebP 通常也比 PNG 小。目前所有主流瀏覽器都支援,但部分較舊的桌面軟體、列印服務與上傳表單仍然不接受。Windows、macOS 與多數新型圖片編輯軟體都能開啟 WebP 檔案。

壓縮方式
有損或無損
透明度
支援
動畫
支援
推出年份
2010 · Google
WEBP 轉檔工具

網站經營者將 JPG 轉成 WebP,是為了減少自己發布圖片的頁面載入量;留在筆電裡或要送印的檔案,並不需要 WebP。

導入 WebP 而不出問題

上方的 <picture> 程式碼會讓每個瀏覽器選用第一個它看得懂的來源,因此舊版瀏覽器的訪客會自動取得 JPG。請在 <img> 上保留 width 和 height;它們會預留空間,避免圖片載入時版面跳動。

如果你的網站使用 WordPress,5.8 版以後的媒體庫可直接上傳 WebP,因此能直接上傳轉換後的檔案。許多 CDN 也能即時轉換;本頁適合想手動控制的圖片,例如主視覺橫幅。

發布前請比較資料夾總大小:如果 WebP 這組沒有明顯變小,代表 JPG 本來就壓得很緊,轉換的效益不大。若圖片之後仍需控制檔案大小,請使用壓縮圖片。

網站管理者常問的 JPG 轉 WebP 問題

同一張 JPG 轉成 WebP 能小多少?

Google 公開的比較顯示,在相同 SSIM(一種常用的視覺相似度指標)下,有損 WebP 檔案比 JPEG 小 25–34%。實際節省幅度因照片而異:平滑的天空和攝影棚背景縮得最多,雜訊多的低光源照片最少。已經高度壓縮的 JPG 可能幾乎沒有變化。

哪個 WebP 品質相當於 JPG 品質 85?

兩者的品質刻度不同,數字無法一對一對應。大多數照片在一般檢視大小下,WebP 75–80 看起來就像 JPG 85–90。整批轉換前,建議先用 100% 縮放檢查一個檔案。

JPG 轉成 WebP 後還需要保留 JPG 嗎?

請保留。電子郵件用戶端、部分平台的社群分享預覽,以及較舊的桌面軟體仍然需要 JPG,而且 <picture> 元素也需要 JPG 作為備援。請把 WebP 與 JPG 放在一起,而不是取代它。

JPG 轉 WebP 會讓照片變得更好看嗎?

不會。WebP 是從解碼後的 JPG 編碼而成,JPG 中原有的方塊雜訊或色彩斷層都會保留。轉換只會改變這些像素的儲存效率,不會增加細節。

WebP 會保留相機 JPG 的 EXIF 資料嗎?

WebP 可以保留 EXIF,但移除中繼資料預設為開啟,會移除 GPS 位置與相機資訊。對公開網站上的圖片來說,通常正是你需要的。若要保留這些資料,請到進階設定中關閉。

我的網站該選 AVIF 而不是 WebP 嗎?

AVIF 對照片的壓縮率更高,但編碼速度慢得多,部分圖片外掛與 CDN 的支援也還不夠穩定。WebP 是更安全的第一步;等 WebP 上線後,可以對幾張主視覺圖試試 JPG 轉 AVIF。