Core Web Vitals 是 Google 用來衡量網站體驗的三個核心指標:LCP、INP、CLS。它不會取代內容品質,但會影響使用者是否願意留下來,也會影響技術 SEO 的基礎分數。

資料基準:2026-05-19。這篇先講怎麼判讀,再講怎麼修,不把 PageSpeed 分數當成唯一目標。

本文目錄 9 節
  1. 先看結論
  2. LCP:使用者何時看到主要內容
  3. INP:點擊後多久有反應
  4. CLS:頁面不要跳來跳去
  5. 用哪些工具檢查
  6. 建議修復流程
  7. 常見誤區
  8. 常見問題
  9. 相關免費工具

先看結論

指標代表什麼建議目標常見問題
LCP主要內容載入速度2.5 秒內主圖太大、主機慢、CSS 阻塞
INP互動反應速度200 ms 內JavaScript 太重、第三方腳本太多
CLS版面穩定度0.1 以下圖片沒尺寸、廣告或字體造成跳動

如果你只想先做最有效的三件事:壓縮首頁主圖、替圖片補上 width/height、刪掉不必要的第三方腳本。多數小型內容站做到這三項,分數就會明顯改善。

LCP:使用者何時看到主要內容

LCP 是 Largest Contentful Paint,通常是首屏最大圖片、主標題區塊或主要內容卡片完成渲染的時間。內容站最常見的 LCP 問題是首頁 hero 圖太大,或文章頁主圖沒有壓縮。

LCP 常見改善方式

  • 把首屏圖片轉成 WebP 或 AVIF,並控制在合理尺寸。
  • 不要讓首頁載入用不到的大型 JS 套件。
  • 重要 CSS 盡量精簡,避免 render-blocking。
  • 確認主機 TTFB 不要太慢;如果主機本身慢,前端優化會有天花板。
  • 首屏圖片不要 lazy load,因為它就是 LCP 候選元素。

如果你還在選主機,可以先看 虛擬主機比較。如果網站已經上線,則先用 PageSpeed Insights 找出 LCP element。

INP:點擊後多久有反應

INP 是 Interaction to Next Paint,衡量使用者點按、輸入、展開選單後,頁面多久給出視覺回饋。2024 年起 INP 取代 FID,成為 Core Web Vitals 的互動指標。

INP 常見改善方式

  • 減少不必要的第三方追蹤、聊天外掛、彈窗外掛。
  • 把大型 JavaScript 拆小,避免一次卡住主執行緒。
  • 表單驗證與互動元件不要綁太多同步計算。
  • 用瀏覽器 Performance panel 檢查 long task。
  • 對不急著執行的功能使用 defer、idle callback 或延後載入。

內容站通常不需要複雜前端框架。如果頁面只是文章、表格、CTA 和目錄,靜態 HTML 加少量 JS 往往比大型 SPA 更穩。

CLS:頁面不要跳來跳去

CLS 是 Cumulative Layout Shift。當使用者正在閱讀,圖片突然把文字往下推、廣告突然插入、字體載入後版面改變,CLS 就會變差。

CLS 常見改善方式

  • 所有圖片加上固定 width 與 height,或使用 CSS aspect-ratio。
  • 廣告區塊預留高度,不要載入後才撐開。
  • 字體載入策略使用 font-display,避免字體切換造成明顯位移。
  • 不要在首屏插入延遲出現的大型 banner。
  • 表格、卡片、CTA 保持穩定尺寸。

如果你準備啟用 AdSense,CLS 特別重要。廣告區如果沒有預留空間,分數很容易被拉低。

同主題推薦 SEO 內容日曆規劃教學

用哪些工具檢查

  • PageSpeed Insights:看實際使用者資料與 Lighthouse 建議。
  • Search Console:看整站 Core Web Vitals 群組問題。
  • Chrome DevTools:定位單頁 long task、layout shift、LCP element。
  • Screaming Frog:大量掃描圖片尺寸、狀態碼、資源問題。

如果你還沒裝 Search Console,先看 Google Search Console 教學。如果你要從整體技術面排查,搭配 技術 SEO 檢查清單 會比較完整。

建議修復流程

  1. 先用 PageSpeed Insights 測首頁與 3 篇重要文章。
  2. 記下每頁的 LCP element、INP warning、CLS 來源。
  3. 先修會影響全站模板的問題,例如圖片尺寸、CSS、廣告預留空間。
  4. 再修個別頁面的圖片、表格或第三方嵌入。
  5. 部署後清 cache,再重新測試。
  6. 等 Search Console 收到新資料後,再判斷是否真正改善。

常見誤區

誤區一:只追 100 分。分數是參考,不是目的。對內容站來說,重點是讓讀者能快速閱讀、順暢互動、版面穩定。

誤區二:只測首頁。SEO 流量通常落在文章頁,不只首頁。至少要測 pillar page、長文、工具頁、分類頁。

誤區三:裝更多外掛解決速度。速度問題常常就是外掛太多造成的。先刪不必要功能,再談優化。

誤區四:忽略廣告造成的 CLS。如果站點靠 AdSense,廣告位需要預留空間,否則讀者體驗和 Core Web Vitals 都會受影響。

常見問題

Core Web Vitals 會直接影響排名嗎?

它是排名系統中的頁面體驗訊號之一,但不是最主要因素。內容品質、搜尋意圖匹配、權威性仍然更重要。Core Web Vitals 的價值在於避免技術體驗拖累好內容。

PageSpeed 分數低一定要立刻修嗎?

如果主要頁面載入慢、使用者互動卡、版面跳動,就應該修。如果只是某些實驗室分數不漂亮,但實際使用者資料穩定,可以排在較後面。

小型內容站最先修哪一項?

先修圖片。圖片通常是 LCP 和流量成本的最大來源。接著補圖片尺寸避免 CLS,最後再整理 JavaScript。

相關免費工具