6723 Pillar

圖片壓縮怎麼做？WebP、JPG、PNG 差在哪＋免費工具推薦 2026

內容目錄 顯示
加入為 Google 偏好來源

圖片檔案、顯示尺寸與載入方式都可能影響網頁速度，但圖片不是所有網站變慢的唯一原因。先用測速報告和網路請求找出待改善的圖片，再比較縮尺寸、格式與壓縮品質；檔案變小不代表載入時間、排名或轉換率會按同一比例改善。

這篇從「為什麼要壓縮」講到「怎麼壓」：WebP、JPG、PNG 三種格式差在哪，免費壓縮工具怎麼選，以及一套照著做就能上手的網站圖片優化流程。

為什麼圖片壓縮對網站這麼重要？

圖片壓縮是減少圖片資料所需空間的處理方式。無損壓縮保留可還原的像素資料；有損壓縮會捨棄部分資料，需比較畫質與大小，不能保證肉眼一定看不出差異。可從三個方向評估：

  • 速度：檢查圖片在該頁的傳輸大小、請求時間與顯示尺寸；減少圖片資料可能改善載入，但效果還受伺服器回應、網路與其他資源影響。
  • SEO：Google 排名系統會使用 Core Web Vitals，但良好指標不保證排名。LCP 衡量可視範圍內最大圖片、文字區塊或影片的渲染時間，不能直接當成主圖的下載時間。
  • 使用體驗：等待與畫質都應驗收。若要判斷對詢問或成交的影響，需看自己的使用者資料，不能套固定三秒或每秒流失的生意比例。

有損壓縮可能讓文字、細節或漸層產生失真；調整尺寸也可能丟失需要的資訊。請保留原檔，用實際顯示尺寸比較畫質，確認透明背景與色彩，再決定是否採用輸出版本。

WebP、JPG、PNG 差在哪？一張表看懂

選格式時可先看照片、細字、透明背景與接收端支援，再用同一張圖比較輸出大小和畫質。以下三種格式可以互相比較，並非大小永遠固定的名次：

比較項目WebPJPG（JPEG）PNG
壓縮方式有損與無損模式一般使用有損壓縮格式採無損壓縮；優化工具另可能減色
檔案大小依內容、尺寸、編碼與品質設定實測，不能預設哪一種永遠最小
透明背景支援不支援支援
比較情境照片、透明圖與其他網頁圖片可測試照片、漸層及接收端要求 JPEG透明圖、細字、線條與需要無損保存的像素
相容性主要現代瀏覽器支援，仍核對目標裝置與工具核對目標平台與輸出要求核對目標平台與輸出要求

來源：Google WebP 官方文件（查核時間：2026-10-10；頁面所列最近更新為 2025-08-07）。

可把 WebP 當成比較選項，而不是所有圖片的唯一答案。Google 官方在同 SSIM 品質指標的 JPEG 比較中列出 WebP 有損檔案小 25%～34%，並在無損 PNG 比較中列出約 26% 差異；這是相關比較結果，不保證你的每張圖都會得到相同比例。仍要以實際輸出大小、畫質及相容性決定。

什麼時候不該用 WebP？

若圖片需提供下載、交給其他軟體或上傳第三方平台，先確認接收端的格式要求。網頁上也應檢查實際畫質、色彩、透明與動畫，以及目標裝置支援；轉成 WebP 不代表檔案一定更小或沒有取捨。

免費圖片壓縮工具推薦

以下工具可用來比較與壓縮圖片。免費功能、檔案上限及處理方式不同，重要或敏感圖片應先核對工具條件。

Squoosh：比較單張畫質與參數

Squoosh 可在瀏覽器比較原圖與輸出，再調整尺寸、格式與品質。官方原始碼說明指出圖片壓縮在本機處理，不把圖片送到伺服器；另有訪客與前後檔案大小等分析資料收集。可先用單張重要圖片比較結果，不把它稱為所有工具的品質第一名。

TinyPNG：按免費上限批次處理

TinyPNG 當日官方頁列出免費一次最多 20 張，每張最多 5 MB，免費格式轉換最多 3 張；支援格式可在工具及說明確認。圖片需上傳至服務處理，可能移除中繼資料，影響色彩描述等資訊。下載後比較畫質與格式，有保密或保留中繼資料需求時先確認適用條件，不假設免費額度適合所有更新量。

作業系統內建工具：應急夠用

可先檢查已安裝圖片工具是否提供調整尺寸、另存格式與品質選項；選項依作業系統、版本與格式而異。另存副本並保留原圖，檢查實際輸出大小與畫質後再上傳，不用工具名稱推定所有格式都可處理。

秒站用戶：主動使用圖片壓縮工具

可先開啟秒站圖片壓縮工具，調整尺寸及品質，下載後檢查再重新上傳。現有後台實作是在部分 WordPress 編輯與媒體庫頁面遇到超過上傳限制的錯誤時提示工具入口；它不會替所有過大圖片自動壓縮，也不會把壓縮結果自動送回原上傳流程。不同入口和版本的提示仍以實際畫面為準。

網站圖片優化 SOP：四步驟照著做

尺寸先對，再談壓縮

若版面只顯示 800px 寬，可把 4000px 原圖與較小版本放在目標裝置比較，再決定輸出尺寸。顯示尺寸、裝置像素密度及裁切方式都會影響需求；可提供不同尺寸並確認實際選用的圖片，不把固定 1.5～2 倍視為所有圖的標準，也不保證縮尺寸比任何壓縮都有效。

選格式：比較輸出與接收端要求

照片、Banner、透明圖與細字截圖可分別比較 WebP、JPEG 或 PNG。保留原檔，確認畫質、透明與接收端支援後再採用；轉檔不是每種圖都必須做的步驟。

壓縮：單張重要圖用 Squoosh，批次用 TinyPNG

可以把內容圖 100～300 KB，大圖 500 KB 以內先寫成團隊的測試預算，再按顯示需求與畫質調整；這不是通用合格線。超過 1 MB 不代表一定能繼續壓縮，也不能為達數字犧牲必要資訊。記錄原檔與輸出的尺寸、實際格式、大小及目視差異，下載失敗時保留原檔並重試。

上傳前最後檢查 Alt 文字

Alt 文字先服務圖片在當頁的用途與無障礙閱讀。Google 圖片說明指出會合併 Alt、電腦視覺及頁面內容理解圖片；有資訊的圖片應寫具體描述，純裝飾圖可依 W3C 指引使用空 Alt。不要堆關鍵字，也不能保證加上 Alt 就獲得 AI 引用或搜尋曝光。

內文精華總結

先量測圖片負擔，再決定改善順序。

  • 圖片大小、傳輸與渲染需要實測；可搭配Google 頁面體驗說明與LCP 定義核對指標，不推定固定下載占比或排名與成交提升。
  • 保留原檔，檢查尺寸、畫質、色彩與透明背景，在讀者需要的資訊和下載負擔之間取捨。

格式選擇：以實測畫質、大小與相容性決定。

  • Google 的 WebP 有損 JPEG 與無損 PNG 比較各有條件，不是全部圖的縮小保證。
  • JPEG、PNG 與 WebP 都可依圖片內容和接收端要求選用，不以副檔名判斷壓縮效果。

工具組合：先縮尺寸，再壓縮，最後填 Alt。

  • 單張精修用 Squoosh（Google 出品，本地處理），批次用 TinyPNG
  • 先訂測試預算，再確認必要畫質；大於 1 MB 不等於一定有可壓縮空間。

圖片只是網站速度的一環，其他的呢？

圖片只是效能的一環，還需要核對伺服器回應、快取與其他資源。秒站方案可按公開價格頁確認 CDN、SSL 與備份等服務；工具或上傳提示不能保證所有圖片自動最佳化，內容與實際閱讀效果仍需驗收：

  • 4 小時免費試用：免信用卡，確認編輯與圖片呈現需求；試用與正式站銜接依公開流程處理。
  • 看秒站方案：標準首年 NT$24,000／續年 NT$12,000，專業首年 NT$36,000／續年 NT$18,000，輕電商首年 NT$48,000／續年 NT$24,000；功能與加購另核對。
  • 看網站案例：參考圖片與內容安排，實際速度和閱讀效果另以自己的網站確認。

延伸閱讀

秒站現在不只是一套版型。你可以從現成架構快速開始，用頁面編輯器以拖曳和複製區塊的方式調整版面；需要更高自由度時，也能和 AI 協作，把自製頁面放進 Vibe 畫布。上線速度與設計自由不必二選一。

重點整理

圖片壓縮會讓畫質變差嗎？

無損與有損壓縮不同；有損處理可能改變細節或色彩，沒有通用的 75%～85% 品質保證。保留原檔，在實際顯示尺寸比較文字、細節、透明與漸層，再決定輸出。

網站圖片應該壓到多小才合理？

沒有通用的 KB 合格線。可先用內容圖 100～300 KB，大圖 500 KB 作測試預算，再依顯示尺寸、畫質及裝置調整；超過 1 MB 也不能推定一定有可壓縮空間。

WebP 是什麼？瀏覽器都支援嗎？

WebP 支援有損、無損、透明與動畫，Google 官方列主要現代瀏覽器原生支援。仍要核對目標裝置、圖片處理軟體與平台；官方 JPEG/PNG 比較結果不等於你的每張圖都更小。

什麼時候該用 PNG 而不是 WebP 或 JPG？

需要無損像素、透明、細字或接收端要求 PNG 時可以比較。WebP 也有無損模式，但大小與畫質需按同一張圖的實際輸出確認，不保證一定更小。

Squoosh 跟 TinyPNG 哪個比較好？

Squoosh 可在瀏覽器本機比較和調整單張圖片，官方另說明分析資料收集；TinyPNG 需上傳服務，當日免費一次最多 20 張，每張 5 MB，免費轉檔最多 3 張。依保密、批次量及畫質需求選擇，下載後驗收。

圖片壓縮對 SEO 的影響有多大？

圖片優化可能改善傳輸與渲染，但 LCP 還包含伺服器回應和其他時段，最大元素也可能是文字或影片。Core Web Vitals 良好不保證排名；Alt 應按圖片用途及無障礙需求處理，不保 AI 引用。

已經上線的網站圖片太大，要一張張重新處理嗎？

先用測速報告找出重要頁面的圖片負擔，再比較輸出與重測。保留原檔，優先順序依實際流量、閱讀需求及量測結果，不聲稱處理少數圖一定取得大部分改善。

秒站會自動幫我處理圖片嗎？

可主動使用秒站圖片壓縮工具，下載驗證後重新上傳。部分 WordPress 編輯與媒體庫入口有超過上傳限制的錯誤提示，但不能當作所有入口自動轉檔、壓縮或送回上傳流程的保證；實際呈現仍需測試。

分享此文章：

相關文章