← 返回工具

如何為網頁壓縮圖片(又不破壞畫質)

頁面速度是 Google 的排名因素,而圖片通常占頁面總大小的 50-80%。正確壓縮圖片是提升網站效能最有效的一件事。以下是正確做法。

準備好轉換了嗎?立即試用 - 免費,無需註冊。

智慧壓縮 - 自動最佳化 →

為什麼圖片壓縮很重要

數據很清楚:

圖片壓縮檢查清單

  1. 選對格式:網頁用 WebP,照片用 JPG,只有在需要透明度又無法使用 WebP 時才用 PNG
  2. 先調整大小:不要在 800px 的容器裡放 4000px 的圖片。依顯示尺寸(Retina 則為 2 倍)調整圖片大小。
  3. 壓縮:有損格式使用 75-85 的畫質。大多數使用者看不出差別。
  4. 使用 WebP:轉換為 WebP,立即縮小 25-35%。
  5. 延遲載入:為首屏以下的圖片加上 loading="lazy"。
  6. 指定尺寸:一定要加上 width 和 height 屬性,避免版面位移。

免費圖片壓縮工具

在瀏覽器中執行(無需上傳)

命令列

# Convert and compress with cwebp
cwebp -q 80 photo.jpg -o photo.webp

# Compress existing WebP
cwebp -q 75 image.webp -o image-compressed.webp

# Batch convert a folder
for f in *.jpg; do cwebp -q 80 "$f" -o "${f%.jpg}.webp"; done

畫質設定速查表

用途 JPG 畫質 WebP 畫質 備註
主視覺圖片 85-90 80-85 醒目、影響大 - 值得多花幾 KB
部落格圖片 75-85 70-80 兼顧畫質與效能
縮圖 60-75 55-70 顯示尺寸小 = 畫質低一點也沒關係
背景圖片 50-70 45-65 通常會模糊或被覆蓋 - 大幅壓縮也沒關係

常見問題

在不損失畫質的情況下,圖片能壓縮到什麼程度?

有損的 JPG/WebP:畫質 75-85 通常與原圖肉眼難辨。低於 60 時,壓縮瑕疵會開始變得明顯。我們的智慧壓縮工具會自動找出最佳平衡點。

圖片應該在上傳到 CMS 之前還是之後壓縮?

之前。雖然部分 CMS(WordPress、Shopify)會在上傳時壓縮圖片,但預設不會轉換為 WebP。事先壓縮能讓你完全掌控畫質與格式。

網頁圖片的理想大小是多少?

一般內容的圖片每張以 200 KB 以下為目標,主視覺/橫幅圖片則在 500 KB 以下。若要取得良好的 Core Web Vitals 分數,整個頁面的圖片總大小應低於 1.5 MB。

立即轉換你的圖片 - 100% 免費,在瀏覽器中執行。

智慧壓縮 - 自動最佳化 →

相關指南

JPG 轉 WebP 指南 PNG 轉 WebP 指南 WebP 轉 JPG 指南 圖片壓縮指南 什麼是 WebP?