壓縮圖片是一種交換：你放棄一點資料，換到小得多的檔案，載入更快、儲存成本更低。真正的技術在於知道哪些資料可以安全地放棄。這篇指南說明如何在看不出畫質損失的前提下壓縮圖片與相片，格式與質素如何互相影響，以及真正重要的設定。

壓縮在你的瀏覽器裡執行，所以原始照片不會離開你的裝置，也沒有上傳或下載的等待時間。

01有損、無損，以及為什麼重新編碼會讓檔案變小

無損壓縮用更少的位元組存下同一批像素，做法是移除冗餘——PNG 的 DEFLATE 步驟（W3C PNG 規格）與 WebP 的無損模式都是這樣運作。解碼後圖片完全相同，省下來的空間來自資料的寫法，而不是內容。

有損壓縮則接受一點可控的損失，小到眼睛通常不會注意到。JPEG 會丟掉高頻細節，並用比亮度更低的解像度儲存色彩；WebP 與 AVIF 用更新的模型做類似的事（MDN 圖片格式指南）。這就是為什麼手機拍的 4 MB 照片能變成不到 1 MB、在屏幕上看起來一樣的 JPEG。

重新編碼也會清掉中介資料。GPS 座標、相機型號與拍攝時間這些 EXIF 欄位（ExifTool 標籤清單），在小檔案裡可能佔掉可觀比例——同時也是隱私外洩——所以會移除它們的壓縮工具，一次幫了你兩個忙。

02批次壓縮圖片

1. 加入圖片 — 把檔案拖到上傳區，或點擊瀏覽。接受 JPEG、PNG、WebP 等常見格式，並支援批次上傳。
2. 選預設或自訂 — Web Optimized、Balanced、Small File 與 High Quality 會一起決定質素與格式。Custom 會解鎖個別控制項，所以先選最接近的預設再微調。
3. 設定輸出格式 — Keep Original Format 會保留 JPEG、PNG 或 WebP。改選 JPEG、PNG、WebP 或 AVIF 則是轉檔，對「照片被存成 PNG」這種情況特別有用。
4. 調整質素滑桿 — 質素對應編碼器的率失真設定。網頁常見甜蜜點是 70–80；低於約 60 就開始在漸變看到塊狀、在邊緣看到環狀雜訊。
5. 只在圖片真的過大時縮放 — 4000 px 的照片顯示在 800 px 的版面上，是在為沒人看得到的細節付費。把長邊限制在版面實際使用的最大尺寸即可。
6. 預覽並下載 — 每個檔案會顯示原始大小、新大小與節省百分比。可以逐檔下載，或用 Download All 一次帶走整批。

03哪種圖片用哪種格式

WebP 的數字來自 Google 自己的編碼器實測：同 SSIM 之下比 JPEG 小 25–34%，比經過最佳化的 PNG 小 23–42%（無損研究）。MDN 對 AVIF 的描述是壓縮率明顯優於 PNG 與 JPEG，但提醒要為不支援的瀏覽器準備後備（caniuse）。

單檔轉檔可以交給專門的頁面處理：JPG 轉 WebP 與 PNG 轉 WebP 把圖片換成現代格式，WebP 轉 JPG 則在對方不收 WebP 時反向處理，JPG 轉 PNG 與 PNG 轉 JPG 分別對應無損再編輯與照片兩種情境。

04質素滑桿實際上在改什麼

質素不是原始檔案大小的百分比，而是編碼器在體積與保真度之間取捨的目標值。把它從 80 拉到 100，檔案可能大一倍，但多數人看不出差別；從 80 降到 60 可能讓檔案減半，只出現輕微瑕疵。

每張圖片都只從原始檔壓縮一次，不要拿已經壓過的版本再壓。JPEG 反覆編碼會產生世代損失：第一輪的瑕疵會被第二輪放大。之後若需要不同尺寸或格式，請從原始檔重新輸出。

05前後對照

網頁用照片

輸入

beach.jpg — 3.8 MB, 4032×3024, JPEG

輸出

beach-1600.jpg — ~0.4 MB, 1600×1200, JPEG, quality 78

縮放做了大部分的事；質素 78 讓天空漸變與膚色保持乾淨。

必須保持銳利的 UI 截圖

輸入

dashboard.png — 1.4 MB, 2560×1440

輸出

dashboard.webp — ~0.4 MB, 2560×1440

像素必須完全精確時請用 PNG 或無損 WebP；有損 JPEG 會把文字邊緣抹糊。

帶透明度的 Logo

輸入

logo.png — 240 KB, 800×800, transparent background

輸出

logo.png — ~96 KB, 800×800 (lossless, transparency preserved)

千萬不要把透明 Logo 轉成 JPEG——透明區域會變成黑色或白色。

同一個檔案不要重複編碼兩次

每一次有損儲存都會再丟掉一層資訊。請保留原始檔，每次都從原始檔輸出，不要拿壓縮過的圖再壓一次。

06常見的壓縮錯誤

07壓縮與頁面速度

多數網站上 Largest Contentful Paint 的元素是主視覺圖片，而檔案大小是它多快出現的最大槓桿。兩個做法就能涵蓋大部分收益：提供瀏覽器支援的最小格式（WebP 或 AVIF，附 JPEG 後備），以及讓圖片尺寸符合版面，而不是用 CSS 去縮一張巨大的檔案。

圖片在首屏時，請設定 width 與 height 屬性並改用 eager 載入；首屏以下全部延遲載入。壓縮與正確的尺寸兩者一起做，勝過只做其中一件。

08資料來源

• MDN — Image file type and format guide（取用日期：2026-10-09）
• Google — WebP compression study（同 SSIM 下比 JPEG 小 25–34%）（取用日期：2026-10-09）
• Google — WebP lossless and alpha study（比最佳化 PNG 小 23–42%）（取用日期：2026-10-09）
• W3C — PNG Specification (Third Edition)（取用日期：2026-10-09）
• web.dev — Largest Contentful Paint（取用日期：2026-10-09）
• caniuse — AVIF 圖片格式支援（取用日期：2026-10-09）
• ExifTool — EXIF 標籤清單（取用日期：2026-10-09）