- 登入
- 註冊

圖片壓縮怎麼做?WebP、JPG、PNG 差在哪+免費工具推薦 2026
網站越來越慢,十之八九是圖片惹的禍。一張沒處理過的手機照片動輒 3MB 到 5MB,放上網站等於要求每個訪客先下載一部短片才能看到你的內容。圖片壓縮是所有網站優化裡投資報酬率最高的一件事:不用改程式,不用換主機,把圖片處理對,速度立刻有感。
這篇從「為什麼要壓縮」講到「怎麼壓」:WebP、JPG、PNG 三種格式差在哪,免費壓縮工具怎麼選,以及一套照著做就能上手的網站圖片優化流程。
為什麼圖片壓縮對網站這麼重要?
圖片壓縮是「在肉眼幾乎看不出差異的前提下,把圖片檔案變小」的技術。它重要的原因有三層:
- 速度:圖片通常佔一個網頁總下載量的一半以上,是頁面變慢的第一兇手。圖片小一半,頁面載入時間大致跟著砍半
- SEO:頁面速度是 Google 排名訊號之一,Core Web Vitals 的 LCP(最大內容繪製)量測的常常就是你的主圖載入時間
- 轉換:訪客等不到三秒就走人,圖片拖慢的每一秒都在流失生意
反過來說,壓縮做過頭、畫質明顯劣化,品牌形象也會跟著打折。所以重點不是「壓到最小」,而是「在看不出差異的範圍內壓到夠小」。
WebP、JPG、PNG 差在哪?一張表看懂
選對格式,壓縮就成功了一半。三種主流格式的定位完全不同:
| 比較項目 | WebP | JPG(JPEG) | PNG |
|---|---|---|---|
| 定位 | 網頁專用的新世代格式 | 照片類圖片的老牌標準 | 需要透明背景或銳利線條時用 |
| 檔案大小 | 最小(同畫質比 JPG 小 25% 到 34%) | 中等 | 最大(無損) |
| 透明背景 | 支援 | 不支援 | 支援 |
| 適合內容 | 幾乎所有網頁圖片 | 照片、漸層豐富的圖 | Logo、圖示、截圖文字 |
| 瀏覽器支援 | 現代瀏覽器全支援 | 全支援 | 全支援 |
來源:Google WebP 官方文件(更新時間:2026-06)
實務結論很簡單:網站圖片預設用 WebP。Google 官方數據顯示 WebP 有損壓縮比同畫質的 JPEG 小 25% 到 34%,無損壓縮比 PNG 小約 26%,而且同時支援透明背景——等於一個格式吃下 JPG 跟 PNG 的主要使用情境。
什麼時候不該用 WebP?
兩種情況例外:一是圖片要給訪客下載後在其他軟體使用(部分舊軟體打不開 WebP),二是要上傳到不支援 WebP 的第三方平台。純網頁顯示的話,WebP 沒有實質缺點。
免費圖片壓縮工具推薦
不用買軟體,這幾個免費工具就能把壓縮做好:
Squoosh:壓縮品質的天花板
Squoosh 是 Google 出的瀏覽器壓縮工具,左右分割畫面即時對照壓縮前後的畫質,可以微調品質參數、轉 WebP,處理在你的瀏覽器本地完成,圖片不會上傳到別人的伺服器。適合需要精準控制單張重要圖片(首頁主視覺、產品主圖)的時候。
TinyPNG:批次處理最省事
TinyPNG 走「拖進去就好」路線,一次拖一批圖片進去自動壓縮,支援 PNG、JPG 與 WebP。免費額度對一般網站的日常更新綽綽有餘。適合不想調參數,要快速處理一批部落格配圖的情境。
作業系統內建工具:應急夠用
Mac 的「預覽程式」可以調整尺寸與另存壓縮品質,Windows 的「相片」app 也有調整大小功能。畫質控制不如專門工具精細,但臨時要縮一張圖不用開瀏覽器。
秒站用戶:後台內建 WebP 壓縮工具
秒站後台在你上傳過大圖片時會自動攔截並彈窗提醒,並提供一鍵導向內建的 WebP 圖片壓縮工具,壓完直接回到上傳流程。這個設計的用意是把「圖片太大拖慢網站」這件事擋在發生之前,而不是事後再來救。
網站圖片優化 SOP:四步驟照著做
尺寸先對,再談壓縮
常見的浪費是把 4000px 寬的原圖直接丟上網站,但版面實際只顯示 800px。先把圖片縮到「實際顯示寬度的 1.5 到 2 倍」(兼顧高解析螢幕),再進壓縮,省下的體積比任何壓縮參數都多。
選格式:預設 WebP
照片、Banner、內容配圖一律 WebP;需要給人下載的原檔才保留 JPG 或 PNG。
壓縮:單張重要圖用 Squoosh、批次用 TinyPNG
實務上的檔案大小參考:內容配圖控制在 100KB 到 300KB,首頁大圖盡量壓在 500KB 以內,超過 1MB 的圖片幾乎都還有壓縮空間。
上傳前最後檢查 Alt 文字
壓縮顧速度,Alt 文字顧 SEO。每張圖上傳時順手填上描述圖片內容的 Alt 文字,Google 圖片搜尋與 AI 搜尋引擎都靠它理解你的圖。
內文精華總結
圖片壓縮是投報率最高的網站優化。
- 圖片佔網頁下載量一半以上,速度直接影響 SEO 排名(Core Web Vitals)與轉換率
- 重點是「看不出差異的範圍內壓到夠小」,不是壓到最小
格式選擇:網頁圖片預設 WebP。
- Google 官方數據:WebP 同畫質比 JPEG 小 25% 到 34%,比 PNG 小約 26%,且支援透明背景
- JPG 留給要下載的照片原檔,PNG 留給特殊相容需求
工具組合:先縮尺寸,再壓縮,最後填 Alt。
- 單張精修用 Squoosh(Google 出品、本地處理),批次用 TinyPNG
- 內容圖 100KB 到 300KB、大圖 500KB 內,超過 1MB 一定還有壓縮空間
圖片只是網站速度的一環,其他的呢?
圖片壓縮自己動手做不難,但主機效能、CDN、快取、SSL 這些速度拼圖,自己處理就是另一回事了。秒站把這些全部打包:全球 CDN、SSL 憑證、每日備份內建,後台上傳圖片太大還會主動攔截提醒,你只要顧好內容:
- 1 小時免費試用:填 Email 直接進後台,不必信用卡,AI 架站小精靈 3 分鐘出首頁雛形
- 看秒站方案:標準 NT$24,000 / 專業 NT$36,000 / 輕電商 NT$48,000 年費
- 看 80+ 真實案例:8 大產業客戶用秒站做了什麼樣的網站
延伸閱讀
- SEO 排序怎麼提升?10 大排名因素與優化方法 2026
- 網站架設完整指南 2026:三種方式比較、費用拆解與新手怎麼選
- SEO 架站完整指南 2026|讓 Google 跟 AI 都找得到你
- 網頁設計趨勢 2026
- AI 做網站完整指南 2026|5 款 AI 架站工具實測
重點整理
圖片壓縮會讓畫質變差嗎?
有損壓縮(JPG、WebP 預設模式)會犧牲少量畫質換取大幅縮小的檔案,但在合理的品質設定下(例如 75% 到 85%),肉眼幾乎看不出差異。訣竅是用 Squoosh 這類有即時對照的工具,左右滑動比較壓縮前後,找到「看不出差異的最低品質」就是最佳設定點。
網站圖片應該壓到多小才合理?
實務參考值:內容配圖 100KB 到 300KB、首頁主視覺或 Banner 大圖 500KB 以內、圖示與 Logo 通常 50KB 以下。超過 1MB 的圖片放上網站幾乎都還有壓縮空間。比絕對數字更重要的是先把尺寸縮到實際顯示寬度的 1.5 到 2 倍,尺寸對了、檔案自然小。
WebP 是什麼?瀏覽器都支援嗎?
WebP 是 Google 開發的網頁圖片格式,同畫質下比 JPEG 小 25% 到 34%、比 PNG 小約 26%,同時支援透明背景與動畫。目前 Chrome、Safari、Edge、Firefox 等現代瀏覽器全數支援,網頁用途已經沒有相容性顧慮。
什麼時候該用 PNG 而不是 WebP 或 JPG?
兩種情況:一是圖片要提供給訪客下載、且對方可能用舊軟體開啟;二是要上傳到只接受 PNG 或 JPG 的第三方平台。另外螢幕截圖含大量細小文字時,PNG 的無損特性能保持文字銳利,但同樣的需求 WebP 無損模式也做得到且檔案更小。
Squoosh 跟 TinyPNG 哪個比較好?
定位不同:Squoosh 是 Google 出的單張精修工具,即時對照畫質、可微調參數、在瀏覽器本地處理不上傳伺服器,適合首頁主圖這類重要圖片。TinyPNG 是批次處理工具,一次拖一批自動壓縮,適合部落格配圖的日常處理。實務上兩個搭配用:重要圖 Squoosh、其他 TinyPNG。
圖片壓縮對 SEO 的影響有多大?
頁面速度是 Google 的排名訊號,而圖片通常佔頁面下載量一半以上。Core Web Vitals 的 LCP(最大內容繪製)指標量測的常常就是主圖的載入時間,圖片壓縮做好,LCP 立刻改善。另外每張圖的 Alt 文字是 Google 圖片搜尋與 AI 搜尋理解圖片內容的依據,壓縮跟 Alt 兩件事一起做才完整。
已經上線的網站圖片太大,要一張張重新處理嗎?
建議從影響最大的頁面開始:首頁、流量最高的幾篇文章、轉換頁。用測速工具(如 PageSpeed Insights)找出哪幾張圖被點名,優先處理那些就能拿到大部分的速度改善,不需要一次重壓整站。
秒站會自動幫我處理圖片嗎?
秒站後台在你上傳過大圖片時會自動攔截並彈窗提醒,並提供一鍵導向內建的 WebP 圖片壓縮工具,壓完直接回到上傳流程,把「圖片拖慢網站」擋在發生前。搭配方案內建的全球 CDN 加速,圖片載入速度從格式到傳輸都有人顧。


