Core Web Vitals 是什麼?LCP、INP、CLS 三大指標總覽
Core Web Vitals(網站體驗核心指標)是 Google 挑出來量化網頁使用者體驗的三項指標。它們刻意只有三個,各自對應使用者最有感的三個問題:
| 使用者的疑問 | 對應指標 |
|---|---|
| 「主要內容什麼時候看得到?」 | LCP 最大內容繪製 |
| 「我點了為什麼沒反應?」 | INP 互動到下次繪製 |
| 「畫面怎麼一直跳?」 | CLS 累積版位偏移 |
這三項與 CSS 效能優化 談的檔案大小不同,它們量的不是資源多大,而是 使用者實際感受到的延遲與干擾。
三個指標與門檻
| 指標 | 量什麼 | 良好 | 待改善 | 不佳 |
|---|---|---|---|---|
| LCP | 最大內容元素繪製完成的時間 | ≤ 2.5 秒 | 2.5-4.0 秒 | > 4.0 秒 |
| INP | 從互動到下次繪製的延遲 | ≤ 200 毫秒 | 200-500 毫秒 | > 500 毫秒 |
| CLS | 非預期版面位移的累積量 | ≤ 0.1 | 0.1-0.25 | > 0.25 |
三項都要落在「良好」,這一頁才算通過。任一項不佳,整頁就算不通過,不會互相抵銷。
第 75 百分位是什麼意思
指標不是量一次就算,而是收集真實使用者的造訪紀錄,取 第 75 百分位 的值。
為什麼不用平均值
假設 100 次造訪中,20 次在高階裝置上 1 秒完成、80 次在中階手機上要 3.5 秒。平均值大約 3 秒,看起來只是「待改善」;但事實是八成的人都在 3.5 秒以上,屬於「不佳」。
取第 75 百分位表示 四分之三的造訪都達到這個水準以上,既不被少數極快的裝置美化,也不被極端值綁死。
另外要注意的是,行動裝置與桌機 分開計算。桌機通常輕鬆過關,行動裝置才是真正的戰場。
在排名中的權重
不要高估它
Core Web Vitals 是排名訊號之一,但權重明顯低於內容相關性。官方一貫的說法是:內容品質優先,體驗指標在兩個結果相關性接近時才成為區分依據。
一篇內容不相關的頁面,速度再快也不會贏過一篇切題但稍慢的頁面。
真正值得投入的理由不在排名,而在轉換:載入慢、版面跳、點了沒反應,使用者會直接離開。這部分的損失遠比排名差幾名明顯。
優化順序建議
三項的修正成本差很多,照這個順序做最有效率:
| 順序 | 指標 | 為什麼先做 | 典型手法 |
|---|---|---|---|
| 1 | CLS | 成本最低,改動明確 | 替圖片與廣告版位補上寬高、字型加 size-adjust |
| 2 | LCP | 影響第一印象最大 | 首屏圖片改 fetchpriority="high"、不要延遲載入 |
| 3 | INP | 常需要調整架構 | 切分長任務、減少水合成本 |
CLS 尤其值得先做:多數網站的 CLS 問題只是 圖片沒標寬高 ,補上之後分數立刻改善,而且不會影響其他部分。
這一組還有這些主題
| 主題 | 說明 |
|---|---|
| 最大內容繪製 LCP | LCP 元素怎麼判定、四段時間拆解與實作手法 |
| 互動到下次繪製 INP | 長任務切分、輸入延遲與呈現延遲的差別 |
| 累積版位偏移 CLS | 版面跳動的六種成因與逐一修法 |
| 伺服器回應 TTFB 與 FCP | TTFB 的組成、CDN 與快取標頭的影響 |
| 資源提示 preload 與 preconnect | 四種 rel 提示的差異與濫用的後果 |
| 指標量測與 CrUX 數據 | 實驗室數據與真實使用者數據的判讀 |
兩種數據不要搞混
同一個指標會有兩種來源,用途完全不同:
| 實驗室數據 | 真實使用者數據 | |
|---|---|---|
| 來源 | Lighthouse、PageSpeed Insights 的模擬 | CrUX 收集的實際造訪紀錄 |
| 特性 | 條件固定、可重現 | 反映真實裝置與網路,有延遲 |
| 用途 | 除錯、找出是哪個資源拖慢 | 評分依據、判斷有沒有真的改善 |
| 陷阱 | 分數好不代表使用者體驗好 | 資料要累積 28 天,改完不會馬上反映 |
用實驗室數據除錯,用真實數據驗收。 詳細判讀方式見 指標量測與 CrUX 數據 。
常見問題
Core Web Vitals 的權重有多大?
它是排名訊號之一,但權重明顯低於內容相關性。官方的說法是內容品質仍然優先,體驗指標在兩個結果相關性接近時才成為區分依據。實務上它更大的價值在於降低跳出率與提升轉換。
為什麼用第 75 百分位而不是平均值?
平均值會被少數極快的裝置拉低,掩蓋掉多數人的實際體驗。取第 75 百分位表示四分之三的造訪都達到這個水準以上,是一個對多數使用者負責的標準,也不會被極端值綁死。
INP 和 FID 有什麼不同?
FID 只量第一次互動的輸入延遲,而且不計算處理與繪製的時間,容易低估問題。INP 觀察整個造訪期間的所有互動,取接近最差的那一次,並涵蓋從輸入到畫面更新的完整過程,因此更貼近真實感受。INP 已在 2024 年正式取代 FID。
Lighthouse 的分數和 Search Console 的數據為什麼不一樣?
兩者的資料來源不同。Lighthouse 是在固定條件下模擬一次載入的實驗室數據;Search Console 呈現的是真實使用者在各種裝置與網路下的實際紀錄。實驗室數據用來除錯,真實數據才是評分依據。