網站核心體驗指標 (Core Web Vitals) 2025 指南：LCP, INP, CLS 優化全攻略

先說結論

Core Web Vitals 不是分數遊戲，而是「使用者是否願意留下來」。

LCP：先讓主要內容更快看見。
INP：讓互動有即時反應。
CLS：避免畫面跳動導致誤點。

Core Web Vitals 及格標準是什麼？

指標	良好	需改善	不佳	主要影響
LCP	< 2.5s	2.5s-4.0s	> 4.0s	首屏載入體感
INP	< 200ms	200ms-500ms	> 500ms	點擊互動延遲
CLS	< 0.1	0.1-0.25	> 0.25	視覺穩定與誤觸

應該先修哪一個？

先修最影響商業結果的瓶頸，通常順序是 LCP → INP → CLS。

情況	優先修正	原因
首頁很慢、跳出高	LCP	先讓人看得到內容
點按鈕卡頓、表單延遲	INP	直接影響轉換
廣告/圖片導致亂跳	CLS	影響體驗與信任

LCP 要怎麼在 30 天內下降？

先抓「最大區塊元素」來源，再逐一減重。

壓縮首屏大圖，改用 WebP/AVIF。
減少首屏阻塞資源（CSS/JS）。
提升 TTFB（快取、CDN、主機等級）。
預載入首圖與關鍵字體。

INP 過高通常是哪裡出問題？

多半是主執行緒被 JavaScript 和第三方腳本塞滿。

延後非必要第三方腳本（defer/async）。
切分長任務，避免單次執行過久。
降低元件初始水合成本。
使用 loading 狀態讓互動先有回饋。

CLS 怎麼快速修好？

做法很直接：預留空間、固定尺寸、減少動態插入抖動。

圖片、影片、廣告都先給尺寸比例。
字體採 font-display: swap 並縮小 fallback 落差。
不在首屏上方插入未知高度元件。

WordPress 與 Next.js 各該怎麼做？

場景	優先做法
WordPress	啟用頁面快取、圖片優化、延後第三方腳本、精簡外掛
Next.js	伺服端渲染關鍵內容、使用 `next/image`、拆分 JS bundle、做好 ISR/快取策略

應該看 Lab Data 還是 Field Data？

都要看，但決策優先看 Field Data。

Lab Data：幫你快速定位問題來源。
Field Data：代表真實訪客體驗，也是搜尋系統長期更重視的訊號。

每月監控儀表板要放哪些指標？

LCP / INP / CLS（行動版優先）。
首頁與重點 landing page 的轉換率。
首屏圖片體積與 JS 總量。
重大改版前後的表現差異。

常見問題 FAQ

Q1：PageSpeed 分數 100 就代表 SEO 一定會好嗎？

不一定。內容品質與搜尋意圖匹配仍是主體；但在內容接近時，體驗更好的頁面通常更有優勢。

Q2：只修首頁可以嗎？

不夠。要優先修「有流量且有商業價值」的頁面。

Q3：Core Web Vitals 會影響廣告轉換嗎？

會。頁面反應更快、穩定性更高，通常能改善跳出率與轉換率。

Q4：多久應該做一次 CWV 健檢？

至少每月一次，改版或大量上新內容後要立即重測。

下一步行動

先用 PageSpeed 與 Search Console 找出最差的 3 個頁面。
依 LCP → INP → CLS 順序排修復待辦。
每兩週檢查一次修復後的 Field Data 變化。