Whoops

網站使用體驗核心指標 CWV 介紹:LCP、CLS、INP

Core Web Vitals(CWV)是 Google 評估網頁體驗的三項指標:LCP、CLS、INP。內容以白話說明各項門檻、與搜尋排名及使用體驗的關係,並整理非工程師也能執行的優化方向、官方工具與問題排查清單。

作者:褚崇名(Sliven)

本頁目錄

很多人應該都有過這種經驗?用手機點進一篇文章,畫面停在白屏轉了半天,好不容易圖片蹦出來,文字卻又整排往下跳,你本來想點的那個按鈕瞬間被擠到螢幕外面。十秒之內你做了決定:按上一頁,換一個網站。

你剛剛經歷的,正好就是 Google 用 Core Web Vitals(簡稱 CWV,中文叫「網站使用體驗核心指標」)想要量化的事情。它把那種「這個網站用起來很煩」的主觀感受,翻譯成一組可以打分數的數字。目前正式在用的有三個指標:LCP(載入)、CLS(視覺穩定度)、INP(互動回應)。而 FID 已經在 2024 年被 INP 正式取代,只是大家搜尋時還是習慣四個名字一起講,所以這裡把它們一次解釋清楚。

換句話說,CWV 是 Google 對你網站開出的一張「使用者體驗成績單」,用來判斷你的網站用起來順不順。接下來這篇會帶你搞懂這四個名字到底在量什麼、及格線在哪、你看到的數字能不能信,還有它對排名的影響究竟有多大。

在開始之前,先用三句話把重點講完,方便你快速抓到方向:

  • 目前的正式指標有三個:LCP 看載入、CLS 看畫面穩不穩、INP 看互動回應快不快;FID 已經被 INP 取代,屬於上個時代的名字。
  • 它影響排名,但不是主因:CWV 是「平手時的加分題」,內容和主題權威才是決定排名的主力。
  • Google 排名看的是實測資料:來自真實使用者的 field data(CrUX)才算數,模擬出來的 lab data 只能拿來除錯。

如果你時間有限,記住這三點就足夠跟工程師或同事溝通了。想深入了解每一項,就跟著往下讀。

為什麼 Google 要把「使用者體驗」變成一組數字

要把 CWV 講清楚,得先回頭看 Google 這幾年到底在想什麼。Google 很早就把「使用者感受」放進排名考量,CWV 只是這條路上的一個新版本。

早在 2018 年,Google 就正式把「網頁速度」納入行動搜尋的排名因素,當時官方在〈Using page speed in mobile search〉的說法很直白:搜尋者在手機上等不及慢網頁,所以速度會影響排名(Google Search Central Blog,2018 年)。這一步其實是個訊號:Google 已經把「用戶的感受」當成搜尋結果的一部分來看待,光看內容相不相關已經不夠。

到了 2020 年,Google 更進一步提出「網頁體驗」(page experience)這個概念。官方在那一年的部落格裡說明,他們要把 CWV 這組新指標,搭配行動裝置友善、HTTPS 安全性、無插頁式廣告干擾等條件,整合成一個「網頁體驗訊號」,一起送進排名系統,相關說明見當年的 〈Evaluating page experience〉〈Timing for bringing page experience to Google Search〉 兩篇 Google Search Central Blog 文章。換句話說,Google 不只問「這個網頁內容好不好」,還要問「這個網頁用起來順不順」。

這條演進脈絡背後有一個不能放過的背景:行動流量。根據 Statista 的全球季度統計,行動裝置貢獻的網站流量比例,這幾年長期維持在過半的水準。當超過一半的訪客用手機上網,你網站在手機上的表現就等於他們對你品牌的第一印象。Google 自己也在 2020 年宣布全面走向行動優先索引(mobile-first indexing),並在 2023 年正式宣告整個網路都已完成這項轉換,依據是 Google Search Central Blog 的 〈Mobile-first indexing for the whole web〉〈Mobile-first indexing is here〉 兩篇公告。也就是說,Google 現在收進資料庫、拿來排名的,是你網站的「手機版」,桌機版反而變成配角。

理解了這層動機,你就會明白 CWV 為什麼誕生。它並非 Google 突然發明的炫技指標,而是「把使用者真實感受變成可量化數字」這條路上,一個很自然的產物(web.dev 的 Core Web Vitals 說明)。Google 官方文件也說得很清楚,CWV 是網頁體驗訊號裡量測「速度、回應度、視覺穩定度」的那一塊核心(Google Search Central 對 Core Web Vitals 的說明)。它跟行動裝置友善、HTTPS、安全瀏覽這些條件是並列的,共同組成所謂的「網頁體驗」。

一個常被漏掉的重點是:CWV 只是網頁體驗訊號的其中一環。就算你 CWV 全綠,如果網站不是 HTTPS、手機版排版破掉、還塞了滿滿蓋版廣告,使用者的整體體驗還是差的。所以你看 CWV 的時候,要把它放回「網頁體驗」這個更大的框架裡,別把它當成單一的神主牌。關於 HTTPS 那一塊,可以回頭看 HTTPS 的基礎介紹,這裡先聚焦在 CWV 本身。

回頭看這整條演進,你會發現 Google 的邏輯其實一以貫之:搜尋引擎的服務對象是人,所以它會一直往「人真實的感受」靠攏。從最早只看文字相不相關,到後來看連結權威、看內容品質、看到現在連「頁面用起來順不順」都要管。CWV 就是這條路上最新的一塊拼圖。對網站經營者來說,與其把 CWV 當成一個新增的負擔,不如把它當成一面鏡子:它誠實反映你的網站對真實訪客友善到什麼程度。這個視角轉過來,你會發現顧 CWV 跟顧使用者體驗本來就是同一件事。

四個指標在量什麼:一張表先看全貌

在我們一個一個拆開講之前,先用一張表把全貌看清楚。建議把這張表當成「速查卡」,之後在報表裡看到數字可以回來對照。

指標 測量的那種「感受」 及格(Good) 待改善(Needs Improvement) 不及格(Poor)
LCP(Largest Contentful Paint) 首屏最大元素多久才畫完,也就是使用者等多久才看到主要內容 ≤ 2.5 秒 2.5 至 4 秒 > 4 秒
CLS(Cumulative Layout Shift) 整個頁面生命週期裡,畫面跳動累積了多少 ≤ 0.1 0.1 至 0.25 > 0.25
INP(Interaction to Next Paint) 使用者點了畫面之後,多久才看到畫面有回應 ≤ 200 毫秒 200 至 500 毫秒 > 500 毫秒
FID(First Input Delay,已退役) 使用者第一次跟頁面互動時的延遲 ≤ 100 毫秒 100 至 300 毫秒 > 300 毫秒

這張表裡藏了一個關鍵差異:LCP 和 CLS 的門檻是用「秒」和「位移分數」這種直觀單位,但 INP 和 FID 用的是「毫秒」。200 毫秒聽起來很短,換算才 0.2 秒,但你手指點下去到畫面有反應只要超過這個時間,大腦就會隱約覺得「卡卡的」。這就是為什麼互動類指標的及格線訂得這麼嚴苛。

這裡有個細節要注意:這幾組門檻都是 Google 用「第 75 百分位」來認定的。意思是它不看平均值,它要求「至少有 75% 的訪客體驗達到這個水準」。所以就算你的平均值好看,只要還有一大群人體驗很差,分數照樣會被拉下來。這個設計背後的邏輯是:Google 想保護的是大多數使用者,尤其是那些網路或設備條件較差的人。

接下來我們一個一個拆。這裡盡量用「使用者實際感受」的角度來講,用白話把觀念講通。如果你需要 Google 官方對每個指標的精確技術定義,可以對照 Core Web Vitals 完全攻略 那篇的細節。

LCP:你的首屏到底要等多久

LCP 全名是 Largest Contentful Paint,白話翻譯就是「最大的那塊內容畫完的時間」。當你打開一個網頁,瀏覽器會持續繪製畫面,Google 則去抓「畫面裡面積最大的那個元素」完整出現的瞬間,當作「使用者覺得頁面載好了」的代理指標。

為什麼抓「最大的元素」?因為那通常就是使用者視線第一眼會停的地方。它可能是一張首圖、一段大標題、一個影片預覽框。只要這個主角還沒出現,使用者就會覺得「頁面還沒好」,就算旁邊的小字早就載完了也一樣。這比單純量「整個頁面載完」更貼近人的感受,因為人不是等所有東西都好才開始看,而是等「那個最重要的東西」出現就開始讀。

及格線是 2.5 秒。意思是從使用者開始載入這個頁面算起,那個主角元素最好在 2.5 秒內完整現身。超過 4 秒就被判定為不及格。你想想,自己滑手機時,一個頁面讓你盯著空白或殘缺的畫面超過 4 秒,是不是已經開始煩了?這條線其實訂得相當貼近真實人性。

那麼,是什麼東西在拖慢 LCP?不管是哪種網站,最常見的兇手就那幾個:

  • 首圖太大:一張沒壓縮、動輒兩三 MB 的 hero image,光下載就把時間吃光了。
  • 伺服器回應慢:伺服器要花很久才把第一個位元組送出來(技術上叫 TTFB),後面所有載入都被往後推。
  • 會擋住繪製的 CSS 與 JavaScript:瀏覽器得先讀完這些檔案才能開始畫畫面,檔案一多一肥,畫面就卡在起跑線。
  • 網頁字型載入順序:用了漂亮但肥大的自訂字型,字還沒下載完,文字區塊就一直空著。
  • 第三方追蹤碼與廣告:一大包分析、像素、廣告腳本搶著載入,把首屏的資源都佔走了。

這裡的解法方向其實很直覺:把首圖壓小、讓伺服器回應更快、把會擋路的資源往後延後載入、收斂不必要的第三方腳本。如果你想往優化實作走,載入速度優化全攻略 裡有更具體的做法,CDN 那篇則解釋了為什麼把靜態檔案散到全球節點能直接改善首屏速度。整體的 網頁速度 觀念也可以一併參考,因為 LCP 本質上就是速度問題裡最關鍵的那一塊。

CLS:畫面跳來跳去,比你想的更傷

CLS 全名是 Cumulative Layout Shift,翻成白話是「累積版面位移」。它量的對象是「畫面到底有多會亂跳」。

這個指標的門檻用了一個比較抽象的數字:0.1。它不是秒也不是毫秒,是一個把「元素位移的距離」和「影響到的畫面比例」算在一起的分數。你不用背公式,只要記得一個原則:分數越低越好,超過 0.25 就是不及格。0.1 大概對應到「使用者勉強能察覺、但還不至於困擾」的程度。

為什麼 Google 要特地為「畫面跳動」設一個指標?因為它直接傷害的是「信任」和「操作」。想像你正要點某個按鈕,結果畫面一跳,你點到了旁邊的廣告或一個根本不想去的連結。這種經驗會讓人對整個網站反感,嚴重的時候甚至會誤觸下載或付款。Google 自己也把「視覺穩定度」列為使用者體驗的核心面向之一,因為它跟「這個網站可不可以信任」的直覺高度相關。

在這三個指標裡,CLS 常常是網站老闆最無感、卻最容易修的一項。你不需要懂程式,只要懂觀念就能跟工程師或設計師溝通。常見的元兇包括:

  • 圖片和嵌入框沒有預留高度:瀏覽器一開始不知道這張圖多大,先給 0 高度,圖下載完才把下面的內容往下擠。
  • 廣告或動態注入的區塊:廣告載入後突然把整段內容往下推,是最經典的版面位移來源。
  • 網頁字型替換:先用了系統字撐著,自訂字型下載完後字寬不同,整排版面跟著跳。
  • 展開摺疊的動畫:選單或 FAQ 展開時沒有預留空間,硬把下面的內容擠開。

修 CLS 的核心觀念其實只有一句話:在內容出現之前,就先把它要佔的空間保留好。圖片給寬高、廣告區塊預留固定高度、字型用適當的載入策略。延遲載入(Lazy Loading) 用得對可以幫上忙,但用錯反而會製造新的位移,這點要特別小心。一個常見的反例是:你為了加快載入把圖片改成延遲載入,卻忘了同時設定寬高屬性,結果圖片載入瞬間把版面撐開,CLS 反而變更糟。

INP:那個取代 FID 的新同學

這裡是很多人會混淆的地方,也是最值得好好講的一段。

先說 FID。FID 全名 First Input Delay,量的是使用者「第一次」跟頁面互動(點一下、按一下)時,瀏覽器多快能開始處理這個動作。它的及格線是 100 毫秒。這個指標在 2020 年 CWV 剛推出時是正式成員。

但 FID 有一個先天的盲點:它只量「第一次」,而且只量「延遲」,不量整個互動處理完的時間。問題是,使用者不會只點一下就滿足。他會捲動、會填表單、會點選單、會展開摺疊區塊。如果只看第一次,後面那些真正影響體驗的互動就完全沒被看到。而且 FID 只量「主執行緒空下來之前的等待」,不算後續畫面更新的時間,等於只看了互動的前半段。

於是 Google 推出了 INP(Interaction to Next Paint)。INP 量的是「使用者每一次互動,從動作發生到畫面更新完成」的完整時間,而且會取整個頁面生命週期裡「最差的那幾次」來代表整體表現。它看的是終點線,不是起跑。及格線是 200 毫秒,超過 500 毫秒就是不及格。

這個「取最差的那幾次」的設計很重要。它代表 INP 在意的不是平均體驗,而是「有沒有一群人被嚴重卡住」。一個網頁就算平均互動很快,只要某一個特定操作(例如展開一個很大的選單)會卡住 800 毫秒,INP 分數就會被拉下來。這對內容網站尤其有感的點在於:選單、側欄、篩選器、加入購物車這類操作,往往就是 INP 的破口。

那麼,是什麼讓 INP 變差?這個指標的破口幾乎都跟 JavaScript 有關。當使用者的點擊發生時,如果瀏覽器的主執行緒正在忙著跑一大段 JavaScript,那個點擊就會被排隊等候,等主執行緒空下來才有辦法處理,INP 就這樣被拉長。常見的兇手包括:載入了太多第三方腳本(分析工具、廣告、聊天機器人、社群按讚按鈕)、頁面上掛了太重的事件監聽器、某些外掛在每次互動時都重新計算整個畫面。改善 INP 的方向,本質上來說就是「讓 JavaScript 做更少、更晚、更有效率的事」:拆分長任務、延後載入非必要的腳本、移除用不到的程式碼。這部分通常會走到 JavaScript SEO 的領域,如果你的網站互動很多,值得花時間深究。

重點來了:INP 已經在 2024 年 3 月正式取代 FID,成為 Core Web Vitals 的互動指標,依據是 web.dev 的 Core Web Vitals 定義。現在你在 Google 工具裡看到的「互動」成績,量的就是 INP,不是 FID。FID 雖然退場了,但這個名字還活在很多舊文章和搜尋習慣裡,這也是為什麼這篇還是把它一起列出來解釋。如果你想知道這個替換背後更完整的技術理由,像是 INP 是怎麼取樣、為什麼它比 FID 更能反映真實體驗,可以參考 INP 與 FID 的比較 一文。這裡你只要記得一個結論:今後要顧的互動指標叫 INP,它的標準比 FID 更全面、也更嚴格。

三個常被誤解的 CWV 觀念

CWV 這幾年紅到一個地步,周圍就開始長出各種似是而非的說法。以下挑出三個最常見、也最容易讓網站老闆走錯方向的誤解,用一張表先破除,再展開說明。

常見誤解 實際情況
CWV 全綠就會衝上第一頁 CWV 是網頁體驗訊號的一環,屬於「平手時的加分題」,內容相關度與權威度才是排名主因
分數紅的就一定會被降排名 CWV 是眾多因素之一,單一頁面分數差不一定直接掉排名,但它會讓你在跟對手比較時吃虧
Lighthouse 跑出來的分數等於 Google 的排名判斷 Lighthouse 是 lab data(模擬環境),Google 排名看的是 field data(真實使用者資料,來自 CrUX)

第一個誤解最致命。很多人把「CWV 全綠」當成終極目標,花大錢請人調分數,卻沒想過自己網站的內容根本沒有回答搜尋者的問題。這就像把一間店裝潢得金碧輝煌、動線完美,結果架上賣的東西沒人要。裝潢(體驗)是加分項,商品(內容)才是讓人來的理由。CWV 顧好是基本功,但它不會憑空把空洞的內容推上去。

第二個誤解是另一個極端:看到分數變紅就恐慌,以為天要塌了。其實 Google 一直強調,網頁體驗是「很多因素之一」。如果你的內容夠強、主題權威夠高,CWV 偶爾亮紅燈不會立刻把你從第一頁踢下去。但這不代表你可以不管它,因為一旦出現實力相近的對手,那一點體驗差距就會變成決定輸贏的關鍵。

第三個誤解跟工具的選擇有關,這點留到下一節展開,因為「field data 跟 lab data 的差別」是理解 CWV 量測時最關鍵、也最容易被漏看的一塊。

Field data 跟 Lab data,為什麼你看到的數字不一樣

很多人第一次量 CWV 都會撞到同一面牆:用不同的工具量同一個網頁,數字居然差很多。原因不是工具壞了,而是它們量的根本是兩種不同的資料。

第一種叫 field data(實測資料、現場資料)。這是真實使用者在真實環境裡造訪你網站時,瀏覽器回傳的數據。Google 用來計算排名訊號的,就是這一種。它最大的來源是 Chrome UX Report(簡稱 CrUX),一個由真實 Chrome 使用者匿名貢獻的體驗資料集。也就是說,你在 CrUX 裡的分數,是成千上萬個真人用各種手機、各種網路造訪你網站之後,匯集出來的「真實平均感受」。

第二種叫 lab data(實驗室資料、模擬資料)。這是在一個受控的模擬環境裡(例如固定的一台虛擬手機、固定的網路速度)載入你的網頁所量到的數字。Lighthouse 和 PageSpeed Insights 裡那種「模擬載入」跑出來的,就是 lab data。它的好處是穩定、可重現,每次跑都差不多,適合拿來當對照基準。

這兩種資料各有各的用,但它們會打架的原因很合理:你的真實使用者用的手機有新有舊、網路有快有慢、地理位置五花八門,field data 反映的是這所有人的「平均真實感受」;而 lab data 反映的是「在同一個標準條件下,這個頁面表現如何」。一個量的是現實的混亂,一個量的是實驗室的乾淨。

那到底該信哪一個?答案是分清楚用途:

  • 想知道 Google 怎麼看你的網站、會不會因為體驗被扣分:看 field data(CrUX)。這才是進排名系統的那一份。
  • 想在改東西之前先有個可重現的對照基準、想本地除錯:看 lab data。它穩定、可重現,適合拿來驗證「修改到底有沒有效」。

最常見的陷阱,是只看 lab data 就以為自己網站很慘,或很健康。因為 lab data 用的是固定的模擬條件,它可能跟你使用者的真實情況差一大截。例如 Lighthouse 預設模擬的是「慢速手機加慢速網路」,這個條件比大多數台灣都會區使用者的實際環境還嚴苛,跑出來的分數自然偏難看。真正決定排名後果的,永遠是 field data 那一份。所以當兩個工具打架的時候,記得一句話:用 lab data 找問題,用 field data 看後果

為了幫你把工具跟資料類型對起來,以下整理了一張對照表。你可以把它當成挑工具時的快速參考:

工具 給你的資料類型 最適合拿來做什麼
PageSpeed Insights 同時給 field 與 lab(畫面上半是 field、下半是 lab) 輸入一個網址,三十秒內看完三項指標的全貌
Lighthouse lab data(模擬環境) 本地除錯、驗證「改了某個設定到底有沒有效」
Search Console 的 CWV 報表 field data(Google 內部那份) 看整個網站有多少網址良好或不及格,並定位問題頁
Chrome UX Report(CrUX) field data(公開資料集) 看歷史趨勢、跟同業網站互相比較體驗

有一個小提醒:CrUX 只收錄「有一定流量規模」的網站。如果你的網站還很新、流量還不大,可能在 CrUX 裡根本查不到資料,這時候 PageSpeed Insights 會告訴你「目前沒有足夠的實測資料」。這很正常,不代表你的網站有問題,只是樣本還不夠多。遇到這種情況,先用 lab data 建立基準,等流量累積上來,field data 自然會出現。

CWV 對排名的影響,講白一點是「平手時的加分題」

講到這裡,一定要回答一個你心裡大概已經在想的問題:「所以你把 CWV 搞到全綠,排名就會衝上去嗎?」

老實說,不會。至少不會是你期待的那種戲劇性效果。

原因在於,Google 官方一直把網頁體驗(CWV 是其中一部分)定位成一個「tiebreaker」,一個打破平手的訊號,它並非決定排名的主因(見 Google Search Central 對 Core Web Vitals 的說明)。翻成白話:當兩個網頁的內容相關度、權威度、資訊品質都差不多時,那個用起來比較順、比較快的,才有機會佔到便宜。但如果你拿一個內容空洞的網頁,光靠把速度催到極限,想要幹掉一個內容紮實但稍慢的對手,這在現實裡幾乎不會發生。

Google 自己也講得很明白:網頁體驗是「排名眾多因素之一」,它的重要性在於「不要成為你的弱點」。也就是說,CWV 是一張入場券,是基本功。它不會讓你贏,但它會讓你不因為體驗太差而輸掉本來該贏的仗。這個「不輸掉該贏的仗」聽起來低調,其實很重要,因為在很多競爭激烈的關鍵字領域,前幾名的內容實力往往在伯仲之間,體驗就是那個分高下的臨門一腳。

這個觀念為什麼重要?因為太多網站老闆把力氣全部砸在衝 CWV 分數,卻忽略內容、忽略搜尋意圖、忽略 on-page SEO 的基本功。這是本末倒置。CWV 是你要顧好的底,天花板永遠是內容和主題權威。Google 官方對「為什麼速度重要」的說明(web.dev 的 Why does speed matter?),落點也是「更好的體驗讓使用者願意留久一點、多看幾頁」,並非速度直接換排名。

所以正確的心態是:把 CWV 當成「體質」。體質好,你才有本錢去比內容;體質差,再好的內容也會在起跑點就漏掉一批不耐煩的訪客。CWV 真正影響的不是排名分數本身,而是「使用者願不願意在你網站上留下來」這件更上游的事,而這件事又會回頭影響跳出率、停留時間、轉換率這些行為訊號。換個角度看,CWV 是一個「上游開關」:它先決定了訪客的留滯行為,這些行為再慢慢回饋到 Google 對你網站的整體評價。

你的網站是用 WordPress 架的嗎?那更該注意這幾件事

如果你跟大多數台灣的中小企業網站一樣,是用 WordPress 架站的,那 CWV 這件事你得更上心一點。原因很現實:根據 W3Techs 的統計,WordPress 在全球網站 CMS 市佔率長年高居榜首,遙遙領先其他平台。市佔率高,代表全世界的開發者都在為它寫外掛、做佈景主題,但也代表「外掛衝突」和「佈景主題肥大」這類問題非常普遍。

WordPress 網站在 CWV 上最常踩的三個坑:

  • 外掛裝太多:每裝一個外掛,前端就多一批 CSS 和 JavaScript。很多外掛還會把腳本塞在頁首擋住繪製,LCP 和 INP 一起遭殃。建議定期清理沒在用的外掛,能用程式碼取代的就不要裝外掛。
  • 佈景主題太重:一些強調「什麼功能都有」的萬能佈景主題,內建了大量你根本用不到的特效和字型,載入成本全轉嫁到使用者身上。挑選時優先考慮輕量、效能導向的佈景主題。
  • 快取沒設好:WordPress 預設不會幫你把頁面快取起來,每個訪客都觸發一次資料庫查詢,伺服器回應當然慢。裝一個可靠的快取外掛(或主機層級的快取),是改善 LCP 最立竿見影的一步。

這裡的關鍵觀念是:CMS 本身不會害你 CWV 變差,會害你的是「怎麼用它」。一個打理得乾淨的 WordPress 網站,CWV 可以非常漂亮;一個塞滿外掛、從不更新的 WordPress 網站,則是 CWV 災難的溫床。所以問題從來不是平台,是紀律。

如果你的網站正面臨改版或搬家,這段過渡期往往是 CWV 最容易崩盤的時候,因為新版的資源載入順序、快取設定、圖片格式可能全都變了。這種時候務必在網站遷移前後都量一次 CWV,避免改版之後體驗悄悄掉下去而你不自知。平時也要把 CWV 放進年度 SEO 健檢的清單裡,定期回頭看一次,因為網站內容會長、外掛會更新,今天的綠燈不代表半年後還是綠燈。

CWV 跟其他 SEO 工作,先做哪一個才對

講到這裡,你腦袋裡大概浮現一個很實際的問題:「你的時間有限,到底該先把力氣花在顧 CWV,還是寫內容、做關鍵字研究?」這個問題沒有標準答案,但有一個判斷框架可以幫你決定。關鍵在於「你現在站在哪個位置」。

你的處境 優先該做的事 背後的邏輯
內容還很薄、排名進不了前兩頁 先補內容、做關鍵字研究、顧搜尋意圖 連內容基礎都沒有,顧 CWV 等於裝修一間沒有商品的空店面
內容已經到位,卻卡在第 4 到第 10 名上不去 把 CWV 當成突破口,同時補強 E-E-A-T 這個區間的對手內容實力接近,體驗差距常常就是分高下的那一點
CWV 全紅、流量又在持續下滑 兩頭都要救,先止血(CWV)再補血(內容) 體驗太差會讓訪客秒退,連內容被看見的機會都沒有
網站剛改版或換主機 立刻量一次 CWV,確認沒有退化 改版是 CWV 崩盤的高風險期,第一時間發現才能及時修

這張表背後有一個核心原則:CWV 的優先順序,取決於你的內容已經累積到什麼程度。如果連內容的地基都還沒打好,把所有力氣砸在 CWV 上是事倍功半;但如果你的內容已經具備競爭力,卻始終差那臨門一腳,CWV 很可能就是那個被你漏掉的瓶頸。

還有一個容易漏掉的連動關係:CWV 跟爬蟲預算、跟索引也有間接關係。一個載入很慢、互動很卡的網站,搜尋引擎的爬蟲造訪時也會吃力,能爬的頁面數量變少,連帶影響你內容被收錄的速度與完整度。這在頁面數量龐大的大型網站上特別明顯,小型網站感受可能不強,但觀念是一致的:體驗差的網站,對人和對機器都不友善。

三個動作,三十分鐘搞懂你網站的 CWV 體質

觀念講完了,接下來給你一套馬上能做的起手式。不用裝任何東西,三十分鐘內你就能拿到自己網站的第一份成績單。

  1. 用 PageSpeed Insights 跑一次首頁和你最賺錢的落地頁。輸入網址之後,它會同時給你 field data(來自 CrUX)和 lab data(來自 Lighthouse)。這是入門最快的一步,畫面上會直接標出紅黃綠三色,你一眼就能看出哪個指標是地雷。想知道還有哪些同類工具可以交叉比對,可以參考 網站速度測試工具 這篇的整理。
  2. 打開 Google Search Console 的 Core Web Vitals 報表。如果你還沒設定 GSC,先看 GSC 介紹 把它接起來。GSC 的 CWV 報表會直接告訴你「有多少網址是良好、需要改善、不及格」,而且它用的就是 Google 內部在看的 field data,是所有資料來源裡最權威的一個。它還會把有問題的網址一條條列出來,讓你不用自己猜哪一頁出狀況。
  3. 列出最差的那批網址,挑一個先修。不要妄想一次救全部。先從影響最大的頁面下手,修完再量一次,確認數字真的動了。CWV 的改善是迭代式的,一次修一個、量一次、再修下一個。你會發現,通常修好一個指標(例如把首圖壓下來改善 LCP)之後,其他指標也會跟著受惠,因為很多根因是共通的。

這三步走完,你對自己網站的 CWV 體質就會有一個清楚的底。哪些指標健康、哪些是地雷、問題出在哪一類頁面,全部會浮上來。至於要不要進一步往 技術性 SEO 的深水區走,那就是下一步的事了。很多時候,光是把前兩步做完,你就已經比八成的網站老闆更了解自己網站的體質。

實務上,這裡提供一個判斷順序:三個指標裡,通常 LCP 是最值得先動手的,因為它的改善往往連帶拉起整體速度感受,效益最廣;CLS 多半是「設定性」問題(給圖片寬高、預留廣告空間),改動小、見效快;INP 則通常需要動到 JavaScript,工程量最大,建議留到前兩項穩下來之後再處理。當然,每個網站的狀況不同,最終還是要看你報表裡哪一項最紅,就先對付哪一項。切記一個原則:一次只改一個變數,改完就量一次,這樣你才會知道「到底是哪個動作讓分數動了」,避免改了一堆卻搞不清楚是誰的功勞。

還有一件事值得提醒:CWV 的改善成果會遞延,不會今天改、明天就看到排名跳升。field data 是過去 28 天的滾動平均值,所以你今天做的優化,最快也要幾週後才會完整反映在數字上。給它時間,持續追蹤,這是一場看長期的體質改造,不是一次性的衝刺。

把這份成績單放對位置

Core Web Vitals 不是一個讓你一夜翻盤的排名密技,它是 Google 開給每個網站的一張體驗成績單。LCP 管「等多久才看得到」、CLS 管「畫面會不會亂跳」、INP 管「點了有沒有回應」,而 FID 已經把棒子交給 INP,退到歷史名詞的位置。

你真正該做的,是把它當成體質來顧。讓你的網站不要在「用起來很煩」這件事上失分,把力氣留給內容、留給 SEO 的基本功、留給你累積主題權威的長期工程。CWV 是底,內容是天花板,兩個都顧,你的網站才站得穩。

放回整體 SEO 的地圖來看,CWV 屬於技術性 SEO 的一環,它跟網站架構、跟內部連結、跟結構化資料是並列的基礎工程。這些基本功平時不起眼,卻決定了你的網站在 Google 眼中「值不值得信任、好不好被理解」。把 CWV 顧好,等於把地基打穩;地基穩了,你往上蓋的每一篇內容才有機會發揮它該有的實力。說到底,SEO 不是花錢,是存錢,而 CWV 就是那筆你每個月都該存一點的基礎存款。

現在,挑出你網站流量最高的那一個頁面,用 PageSpeed Insights 跑一次。看著那三個數字,那就是你今天的起點。從那裡開始,一次修一個,把它們慢慢轉綠。

常見問題

Core Web Vitals 會影響 SEO 排名嗎?
會,但屬於平手破局因素而非主排名因素。當兩個網站內容品質接近時,體驗較好的一方勝出;若內容差距大,CWV 滿分也救不回劣勢。
非工程背景的人可以自己優化 Core Web Vitals 嗎?
能做的是看懂報表、把問題準確描述給工程師或外包廠商。多數調整需要動程式碼或伺服器設定,最大地雷是同時裝多個效能外掛互相衝突,反而讓分數更差。
LCP 太慢該怎麼改善?
先確認頁面最大元素是誰(通常是首圖或 Hero 圖),再從伺服器回應速度、圖片大小、阻斷渲染的 JavaScript 三個方向著手,例如啟用快取、壓縮圖片大小、刪除多餘 JS。
CLS 分數過高(畫面跳動)怎麼解決?
為所有圖片與 iframe 指定明確的寬高、為廣告與動態元素預留佔位空間、避免在已渲染內容上方插入新元素;字體造成的位移可用適當的字型載入策略減輕。
INP 和 FID 有什麼不同?
FID 只測量使用者第一次符合條件的互動所產生的輸入延遲;INP 則觀察頁面生命週期中的點擊、輕觸與鍵盤互動,衡量從輸入到下一次畫面更新的延遲,並以接近最慢的互動代表整體反應性。捲動與游標移動不列入 INP。INP 已於 2024 年 3 月取代 FID,良好門檻為第 75 百分位不超過 200 毫秒。

主題聚落|技術 SEO 與網站架構 看「SEO 搜尋引擎優化」中樞 →

相關文章

褚崇名(Sliven) 創辦人・巫普斯科技有限公司

長期投入技術 SEO、GEO/AEO 與 AI 搜尋實務。本站文章以可驗證資料、公開來源與實作觀察整理而成。

完整作者介紹LinkedInGitHubX

想把這篇的方法用在自己的站上?

SEO 健檢、GEO/AEO 引用優化、網頁設計諮詢——把文章裡的方法落地到你的網站。