一句話結論：網站開太慢，最常見的元兇不是主機，而是沒經過處理的大圖。把圖片轉成 WebP 或 AVIF、設定延遲載入、搭配 CDN 傳送，通常就能把首頁的圖片體積砍掉一半以上，讓 LCP 回到 Google 建議的 2.5 秒內。這篇由甫東科技整理的影像壓縮優化指南，說明為什麼圖片會拖垮網站，以及中小企業可以照做的三個步驟。
很多老闆花了不少預算拍 4K 高畫質的產品照，攝影師交來的原檔一張就是好幾 MB，然後直接上傳到官網。結果是照片很美，但客戶在手機上等了好幾秒還是白畫面，最後直接關掉。這不是攝影師的錯，也不是主機的錯，而是圖片在上線前少了一道「瘦身」的工序。
這篇文章會用白話的方式說明網站速度和圖片的關係、2026 年 Google 用哪些指標衡量速度，以及甫東科技在網站專案裡標準化執行的影像壓縮做法，讓你可以自己檢查、也可以拿去跟網頁設計公司討論。
為什麼網站開太慢會流失顧客？
因為使用者的耐心非常有限，而且 Google 也把速度納入排名與 AI 引用的考量。Google 過去公開的行動網頁研究指出，載入時間超過 3 秒，超過半數的手機使用者會直接離開。換句話說，網站慢一點，不只是「體驗差一點」，而是有一半的潛在客戶根本沒看到你的內容。
使用者直接跳出
手機使用者最沒耐心。畫面轉圈超過幾秒，多數人會回到搜尋結果點下一家，你的廣告費和 SEO 努力等於白做。
SEO 排名受影響
Google 以 Core Web Vitals 衡量頁面體驗，LCP、INP、CLS 不及格的網站，在同樣內容品質下會輸給速度快的競爭者。
廣告轉換打折
投了 Google 或 Meta 廣告，客戶點進來卻卡在白畫面，等於花錢把人帶到門口再請他離開。
2026 年的速度指標：Google 的 Core Web Vitals 三項核心指標是 LCP（最大內容繪製，建議 2.5 秒內）、INP（互動延遲，2024 年起取代 FID，建議 200 毫秒內）、CLS（版面位移，建議 0.1 以下）。其中 LCP 最常被大圖拖垮，因為首屏最大的元素通常就是主視覺圖片。
網站跑不動，通常是圖片的問題嗎？
依甫東科技做網站健檢的經驗，多數中小企業官網的頁面總體積裡，圖片就佔了六成到八成以上。主機、外掛、程式碼當然也會影響速度，但如果首頁一張 Banner 就 5 MB、產品頁一次放 30 張未壓縮的照片，其他優化做得再好也救不回來。
常見的「肥胖圖片」有幾種型態：
- 原檔直接上傳：相機或手機拍出來的照片寬度動輒 4000 到 6000 像素，但網站實際顯示寬度通常只有 1200 到 1600 像素，多出來的像素全都是浪費。
- 格式選錯：照片用 PNG 儲存，檔案會比 JPG 大好幾倍；有透明背景的 Logo 反而用 JPG，邊緣會出現白邊。
- 一次載入全部：頁面最底下的圖片，在使用者還沒捲到之前就先下載了，拖慢首屏出現的時間。
- 沒有指定尺寸：img 標籤沒有寫 width 與 height，圖片載入時把版面往下推，造成 CLS 版面位移。
影像壓縮優化的三個步驟：格式、延遲載入、CDN
影像優化不是單純把圖縮小，而是從「格式」「載入時機」「傳送路徑」三個層面重新設計圖片怎麼到達使用者的螢幕。甫東科技交付的網站，這三件事都是標準配備，而不是加購項目。
轉成次世代格式：WebP 或 AVIF
WebP 是 Google 推薦的圖片格式，在肉眼幾乎看不出差異的畫質下，檔案通常比 JPG 小三成到五成，比 PNG 小更多；AVIF 壓縮率更高，2026 年主流瀏覽器都已支援。一張 5 MB 的 JPG 轉成 WebP 後只剩 0.5 MB，這種等級的差異在實務上並不少見。WordPress 網站可用外掛在上傳時自動轉檔，不需要一張一張手動處理。
設定延遲載入（Lazy Loading）
使用者打開頁面時，只需要先下載首屏會看到的圖片，其餘的等捲動到附近再載入。做法很簡單，在 img 標籤加上 loading=”lazy” 即可，WordPress 預設也已支援。要注意的是首屏主視覺不要 lazy，否則反而會延後 LCP。
用 CDN 從離客戶最近的節點送圖
CDN（內容傳遞網路）會把圖片複製到全球或全台各地的節點，客戶在台北、高雄或海外開網頁時，圖片從離他最近的主機送出，不用每次都回到原始主機抓。對有海外客戶或流量集中在特定時段的網站，效果特別明顯。
上線前先縮到實際尺寸並提供多種版本
依網站版型決定最大顯示寬度（例如 1600 像素），上傳前先縮圖；再透過 srcset 提供手機、平板、桌機不同尺寸，讓手機不用下載桌機版的大圖。這一步常被忽略，卻是省最多流量的環節。
壓縮不等於畫質犧牲。WebP 與 AVIF 的「有損壓縮」在品質設定 75 到 85 之間，多數人在手機或一般螢幕上看不出差異；真正需要保留細節的攝影作品或設計稿，可以個別保留高品質版本，用點擊放大的方式提供，而不是讓整頁都揹著大檔案。
JPG、PNG、WebP、AVIF 該怎麼選？
選格式的原則很簡單：照片用 WebP（或 AVIF），需要透明背景的 Logo 與圖示用 SVG 或 WebP，只有在必須相容非常舊的環境時才回退到 JPG／PNG。下表整理四種格式的特性，方便你和設計師或網頁公司溝通。
| 格式 | 適合用途 | 檔案大小 | 2026 年瀏覽器支援 |
|---|---|---|---|
| JPG | 傳統照片，相容性優先 | 中等，無透明 | 全部支援 |
| PNG | 需要透明背景、線條清晰的圖 | 大，照片尤其大 | 全部支援 |
| WebP | 網站照片與透明圖的首選 | 比 JPG 小三到五成 | 主流瀏覽器全部支援 |
| AVIF | 追求極致壓縮的照片 | 比 WebP 更小 | 主流瀏覽器已支援，建議搭配 WebP 備援 |
實務上，甫東科技通常會在網站設定「上傳 JPG／PNG，系統自動產生 WebP 版本並保留原檔」的流程。這樣客戶端維護人員不必學新工具，網站也能自動得到壓縮的好處。
我們接手的網站健檢案裡，速度問題有相當高的比例只要處理圖片就能明顯改善，而且成本比換主機或重寫程式低得多。我們的做法是把影像優化寫進網站的建置規範：版型決定最大寬度、上傳自動轉 WebP、非首屏圖片一律延遲載入、有海外流量的站接 CDN。交付前用 PageSpeed Insights 跑過，確認行動版分數與 Core Web Vitals 都在合理範圍，才算完成。速度不是行銷話術，而是你的網站在 Google 與 AI 搜尋裡被看見的基本門檻。
怎麼自己檢測網站速度？
不需要工程師，你可以用 Google 的免費工具在五分鐘內看出網站的圖片問題在哪裡。
- PageSpeed Insights：輸入網址，切到「行動裝置」分頁，看 LCP、INP、CLS 三個數字是否在綠色範圍。往下捲到「診斷」區，若出現「提供次世代格式的圖片」「圖片尺寸適當」「延遲載入畫面外圖片」等建議，就代表圖片還有優化空間。
- Chrome 開發者工具的 Network 分頁：重新整理頁面後依「大小」排序，一眼就能看到哪幾張圖最肥。
- Google Search Console 的網頁體驗報告：看整站有多少網址被判定為「需要改善」或「不佳」，而不只是首頁。
如果檢測結果不理想，先從首頁與流量最高的幾個頁面下手，通常投入最少、看到成效最快。想進一步了解速度以外的技術 SEO 項目，可以參考 2026 年 Google 排名完整指南；若想知道網站被 AI 引用還需要哪些條件，官網被 AI 引用的 8 個檢查清單 有完整整理。
常見問題
圖片轉成 WebP 之後畫質會變差嗎？
在合理的品質設定下，肉眼幾乎看不出差異。WebP 在品質 75 到 85 之間就能兼顧清晰度與檔案大小，一般產品照、形象照都適用。若是需要極高細節的攝影作品，可以另外提供高解析版本供點擊放大。
WordPress 網站要怎麼自動壓縮圖片？
可以安裝影像優化外掛，設定上傳時自動縮圖、轉 WebP 並保留原檔，也可以在主機或 CDN 層做即時轉檔。甫東科技建議先確認佈景主題的最大顯示寬度，再設定壓縮參數，避免圖片被縮得太小而模糊。
延遲載入會不會影響 SEO？
正確設定不會，Google 能正常抓取延遲載入的圖片。要注意的是首屏主視覺與 Logo 不要設 lazy，否則 LCP 反而會變慢；其餘畫面外的圖片延遲載入，對速度與排名都是加分。
網站慢一定是圖片造成的嗎？
不一定，但圖片是最常見、也最容易改善的原因。其他常見因素包括主機效能不足、外掛過多、未壓縮的 CSS 與 JavaScript、缺少快取。建議先用 PageSpeed Insights 診斷，再依建議的優先順序處理。
甫東科技提供哪些網站效能優化服務？
甫東科技提供網站速度健檢、影像壓縮與格式轉換、延遲載入與 CDN 設定、Core Web Vitals 調校，以及新網站建置時的效能規範。服務範圍以高雄、屏東、台南為核心，全台皆可遠端合作。
覺得網站開得慢？先做一次免費測速
甫東科技提供免費網站速度健檢，告訴你圖片、主機與程式碼各佔多少問題，以及最值得先做的三件事。
預約免費測速與優化諮詢 →甫東科技有限公司｜高雄市大寮區鳳林一路 184 巷 20-11 號
電話 07-641-8686｜Email service@fulldot.com.tw｜了解 SEO 專業服務
圖片來源：藍白色的類比速度儀表照片由 Chris Liverani 攝影，取自 Unsplash，依 Unsplash License 免費使用。
