網站體驗核心指標門檻的研究和方法
Core Web Vitals 是一組欄位指標，用於評估網站實際使用者體驗的重要面向。Core Web Vitals 提供各項指標的指標，以及每項指標的目標門檻，有助開發人員合理性地瞭解網站體驗是「良好」、「需要改善」還是「不佳」。本文說明一般網站體驗核心指標門檻的選擇依據，以及如何選擇各項特定 Core Web Vitals 指標的門檻。
複習：網站體驗核心指標指標和門檻
2020 年網站體驗核心指標的三項指標：最大內容繪製 (LCP)、首次輸入延遲時間 (FID) 和累計版面配置位移 (CLS)。每項指標都會評估不同使用者體驗的層面：LCP 會測量感知載入速度，並在網頁主要內容可能載入時，在頁面載入時間軸中標示時間點；FID 則會測量回應速度，並將使用者嘗試首次與網頁互動時感受到的體驗量化；CLS 會測量視覺穩定性並量化顯示網頁顯示內容意外版面配置時的情況。
每項網站體驗核心指標都有相關門檻，可將效能分為「良好」、「需要改善」或「不良」：
| 不錯 | 不佳 | 百分位數 | |
|---|---|---|---|
| 最大內容繪製 | ≤2500 毫秒 | 超過 4000 毫秒 | 75 |
| 首次輸入延遲時間 | ≤100 毫秒 | 超過 300 毫秒 | 75 |
| 累計版面配置轉移 | ≤0.1 | 超過 0.25 | 75 |
此外，為了分類網頁或網站的整體效能，我們會使用該網頁或網站所有網頁瀏覽的第 75 個百分位數值。換句話說，如果某網站的網頁瀏覽量至少有 75% 達到「良好」門檻，其指標就會歸類為具有「良好」成效。相反地，如果網頁瀏覽量至少有 25% 達到「低」門檻，我們就會將網站的成效歸類為「不佳」。舉例來說，系統會將第 75 個百分位數的 LCP (2 秒) 歸類為「良好」，而第 75 個百分位數為 5 秒的 LCP 則歸類為「不良」。
網站體驗核心指標門檻的條件
設定網站體驗核心指標指標的門檻時，我們會先確認每個門檻所達到的標準。以下說明 Google 在評估 2020 年網站體驗核心指標門檻時，採用的標準。後續章節將進一步說明如何在 2020 年套用這些條件，為每個指標選取門檻。未來幾年，我們預計會對相關標準和門檻進行改良及擴充，進一步提升我們評估網路使用者體驗的能力。
優質使用者體驗
我們的主要目標是盡可能讓使用者享有更優質的體驗。 因此，我們的目標是確保符合網站體驗核心指標「良好」門檻的網頁，為使用者提供優質體驗。
為了找出與優質使用者體驗有關的門檻，我們將人為感知和 HCI 研究。雖然這項研究有時會以單一固定門檻呈現摘要資訊，但我們發現基礎研究通常以一個範圍的值表示。舉例來說，如果研究的是使用者在失去焦點之前通常等待多久，有時可能為 1 秒，但基礎研究實際上是以數百毫秒或數秒等範圍表示。去識別化的 Chrome 指標資料經過匯總和匿名處理，可以進一步支援感知門檻會因使用者和背景資訊而異，這表示使用者在網頁顯示內容之前，不會等待一段時間才顯示內容。而是顯示流暢且持續的分佈。如需進一步瞭解人體感知門檻和相關 HCI 研究，請參閱 The Science Behind Web Vitals。
如果特定指標有相關的使用者體驗研究，且對於文獻中的值範圍有合理共識，我們就會以這個範圍做為輸入內容來調整閾值選擇程序。如果無法進行相關的使用者體驗研究 (例如「累計版面配置位移」等新指標)，我們會改為評估實際網頁是否達到特定指標候選門檻，藉此找出能帶來良好使用者體驗的門檻。
可透過現有的網頁內容達成
此外，為確保網站擁有者能夠順利最佳化網站，使其達到「良好」門檻，我們必須確保網路上現有內容達到這些門檻。舉例來說，雖然零毫秒是理想的 LCP 的「良好」門檻，但由於網路和裝置處理延遲時間的關係，因此即使在大多數情況下，未達零毫秒門檻也無法實現。因此，對於網站體驗核心指標而言，零毫秒並不是合理的 LCP「良好」門檻。
評估網站體驗核心指標的「良好」門檻時，我們會根據 Chrome 使用者體驗報告 (CrUX) 的資料，確認這些門檻是否可實現。為確認可達成的門檻，我們要求目前至少有 10% 的來源都符合「良好」門檻。此外，為確保經過妥善最佳化的網站不會因欄位資料變化而導致分類錯誤，我們也會確認經過妥善最佳化的內容是否一致達到「良好」門檻。
相反地，我們會找出只有少數來源目前尚未達到的成效等級，藉此設定「不良」門檻。除非有研究與定義「低」門檻相關的研究，否則根據預設，成效最差的 10-30% 來源都會歸類為「不良」。
關於條件的結論
評估候選者門檻時，我們發現這些標準有時會互相衝突。例如，持續可達成的門檻，以及確保一致的使用者體驗，之間可能存在緊張衝突。此外，由於人類認知研究通常提供了一系列的值，而使用者行為指標會顯示行為的逐步變化，因此我們發現指標通常並沒有單一的「正確」門檻。因此，我們決定採用 2020 年 Core Web Vitals 指標，選擇符合上述條件的門檻。另外，我們也體認到每個門檻並沒有完美的門檻，因此有時可能需要選擇多個合理的候選門檻。與其問「什麼是完美的門檻呢？」 而是直接詢問「哪個候選條件最符合我們的條件？」
百分位數選項
如前文所述，我們會使用該網頁或網站所有造訪的第 75 個百分位數值，將網頁或網站的整體效能分類。第 75 個百分位數是根據兩項條件選出第一，百分位數應確保大部分網頁或網站的造訪都達到目標等級的效能。第二，所選百分位數的值不應受到離群值過度影響。
這些目標不太容易。為了滿足第一個目標，百分位數較高通常是較佳的選擇。然而，百分位數越高，產生的值受到離群值影響的可能性也隨之增加。如果在一個網站幾次造訪時，網路連線不穩，因而產生大量 LCP 樣本，我們不希望這些離群樣本決定我們的網站分類。例如，假設我們評估網站造訪次數為 100 次且使用百分位數高 (例如 95 日) 的成效，那麼在第 95 個百分位數的值中，只有 5 個離群樣本會受到影響。
有鑑於這些目標可能有些微差異，經過分析後，我們確定第 75 個百分位數達成了合理的平衡。使用第 75 個百分位數，即可得知大多數網站造訪 (4 之 3) 都達到或更佳的成效。此外，第 75 個百分位數的值不太可能受到離群值的影響。回到我們的範例，假設網站造訪次數為 100 次，其中有 25 次造訪需要回報第 75 個百分位數的值，因而受到離群影響的大型離群樣本。雖然 100 個樣本中的 25 個可能可行，但比起第 95 個百分位數的可能性高出許多。
最大內容繪製
使用體驗品質
使用者開始失去聚焦工作之前，需要等待多久時間，才會引用 1 秒。在深入查看相關研究時，我們發現 1 秒是描述特定範圍值的約略值，範圍涵蓋約數百毫秒到數秒。
Card etal 和 Miller 是兩個常見的 1 秒門檻來源。卡片定義 1 秒的「立即回應」閾值，根據 Newell 的統合認知理論。Newell 解釋立即回應為「必須對約 1 秒 (約約 0.3 秒到約 3 秒) 內刺激的回應」。這正是 Newell 對「認知的即時限制」的討論，其中註記：「與環境互動時，會引發認知考量的延遲時間，長度介於 0.5 至 2 至 3 秒之間。」Miller 是另一個常見的 1 秒門檻來源，指出「人類可以執行且將透過機器通訊執行的工作，會嚴重改變角色，前提是回應延遲超過兩秒，且可能延長了一秒以上」。
Miller 和 Card 的研究說明瞭使用者將焦點移至某個範圍前需等待多久 (約 0.3 到 3 秒)，這表示我們的 LCP「良好」門檻應該落在這個範圍。此外，由於目前的「首次顯示內容所需時間」門檻為 1 秒，而最大內容繪製時間通常會在首次顯示內容繪製之後發生，我們進一步限制了候選 LCP 門檻範圍，從 1 秒到 3 秒。為選擇這個範圍中最符合我們條件的門檻，我們會在下方查看候選門檻。
可達成性
我們可以運用 CrUX 資料，判斷網頁符合候選 LCP「良好」門檻的來源百分比。
歸類為「良好」的 CrUX 來源百分比 (適用於候選的 LCP 門檻)
| 1 秒 | 1.5 秒 | 2 秒 | 2.5 秒 | 3 秒 | |
|---|---|---|---|---|---|
| phone | 3.5% | 13% | 27% | 42% | 55% |
| 電腦 | 6.9% | 19% | 36% | 51% | 64% |
雖然只有不到 10% 的來源符合 1 秒門檻，但如為 1.5 至 3 秒以外的所有其他門檻，則符合我們的要求，至少有 10% 的來源均符合「良好」門檻，因此仍然是有效的候選項目。
此外，為確保最佳化網站能持續達成所選門檻，我們會分析網路上成效最佳的網站的 LCP 效能，以判斷這些網站持續達到哪些門檻。具體來說，我們會找出效能最佳網站持續達到第 75 個百分位數可達到的門檻。我們發現，1.5 和 2 秒的門檻無法持續達到，而 2.5 秒則可持續可以達成。
為了找出 LCP 的「不良」門檻，我們會使用 CrUX 資料來識別大多數來源的門檻：
歸類為「不良」的 CrUX 來源百分比 (適用於候選 LCP 門檻)
| 3 秒 | 3.5 秒 | 4 秒 | 4.5 秒 | 5 秒 | |
|---|---|---|---|---|---|
| phone | 45% | 35% | 26% | 20% | 15% |
| 電腦 | 36% | 26% | 19% | 14% | 10% |
針對 4 秒門檻，約佔手機來源的 26% 與 21% 的桌上型電腦來源，都會歸類為「不佳」。落在目標範圍中介於 10% 到 30% 之間，因此我們判定 4 秒是可接受的「不良」門檻。
因此，我們的結論是 2.5 秒是合理的「良好」門檻，而 4 秒是最大內容繪製的合理「低」門檻。
首次輸入延遲時間
使用體驗品質
研究相當一致，其中結論是視覺回饋延遲最多 100 毫秒，這是將由相關聯的來源 (例如使用者輸入內容) 造成的。這表示 100 毫秒的首次輸入延遲時間「良好」門檻可能適合做為最低標準：如果處理輸入的延遲時間超過 100 毫秒，其他處理和轉譯步驟就沒有機會能及時完成。
Jakob Nielsen 常用的「回應時間：3 項重要限制」定義為 0.1 秒，這是讓使用者認為系統立即做出回應的限制。Nielsen 引述了 Miller 和 Card，他引用 Michotte 的 1962 年《The Perception of Causality》。在 Michotte 的研究中，實驗參與者顯示「螢幕上顯示兩個物件。物件 A 脫離並朝 B 前進。接觸 B 時就會停止輸出，而後者則開始從 A 移出。」Michotte 會改變物件 A 停止與物件 B 開始移動之間的時間間隔。Michotte 發現，由於延遲最多 100 毫秒，參與者發現物件 A 的曝光會引起物件 B 的動作。針對約 100 毫秒到 200 毫秒的延遲，造成因果關係的誤解已經混合，且延遲超過 200 毫秒，物件 B 的運動就不再視為物件 A 造成的。
同樣地，Miller 將「對控制啟用的回應」定義回應門檻定義為「指示其指定動作，通常是藉由移動金鑰、切換鈕或其他控製成員，表明其實際活動」。這個回應應屬於運算子引發的機械動作的一部分。時間延遲：不得超過 0.1 秒，以及之後「解壓縮金鑰和視覺回饋之間的延遲時間不應超過 0.1 到 0.2 秒」。
最近，Kaaresoja 等人在到「暫時完美的虛擬按鈕」中，研究了觸控螢幕上輕觸虛擬按鈕之間的同步感受，以及後續指出按鈕觸碰的視覺回饋情形。如果按下按鈕和視覺回饋的延遲時間為 85 毫秒以下，參與者回報視覺回饋會同時顯示，而且按下按鈕的時間佔了 75%。此外，由於 100 毫秒或更短的延遲，參與者表示按下按鈕的品質一直維持在高水準，在 100 毫秒到 150 毫秒的延遲時間內，品質下降，將延遲到極低的延遲時間，達 300 毫秒。
基於上述情況，我們結論是達到約 100 毫秒的值範圍，成為 Web Vitals 的適當「首次輸入延遲時間」門檻。 此外，由於使用者回報延遲 300 毫秒以上，品質等級較低，因此系統會將 300 毫秒視為合理的「不良」門檻。
可達成性
使用 CrUX 資料，我們確認網路上大多數來源都符合第 75 個百分位數的 100 毫秒 FID「良好」門檻：
在 FID 100 毫秒門檻被歸類為「良好」的 CrUX 來源百分比
| 100 毫秒 | |
|---|---|
| phone | 78% |
| 電腦 | >99% |
此外，我們還發現，網路上的熱門網站都能持續在第 75 個百分位數達到這個門檻 (通常達到第 95 個百分位數)。
基於上述情況，我們判定 100 毫秒是 FID 的合理「良好」門檻。
累計版面配置轉移
使用體驗品質
「累計版面配置位移」(CLS) 是新指標，用於評估網頁的顯示內容位移大小。由於 CLS 才剛推出，我們目前尚未發現任何研究可以直接指出這項指標的門檻。因此，為了找出符合使用者期望的門檻，我們針對實際使用的網頁位移數量評估實際網頁，決定在消耗網頁內容時發生重大干擾時，可接受的最長偏移量。我們在內部測試中發現，從 0.15 及以上變化的層級持續視為幹擾性，而 0.1 及以下的變化幅度卻受到明顯影響，但不會對其造成過度幹擾。因此，雖然最理想的版面配置位移是零，但最後約定為 0.1 的值即為「良好」CLS 門檻。
可達成性
根據 CrUX 資料，我們可以看見近 50% 的來源具有 0.05 或以下的 CLS。
歸類為「良好」的 CrUX 來源百分比 (針對候選 CLS 門檻)
| 0.05 | 0.2 | 0.15 | |
|---|---|---|---|
| phone | 49% | 60% | 69% |
| 電腦 | 42% | 59% | 69% |
雖然 CrUX 資料表明，0.05 可能是合理的 CLS「良好」門檻，但我們也瞭解，在部分使用情境中，目前很難避免版面配置造成乾擾。舉例來說，如果是第三方嵌入內容 (例如社群媒體嵌入內容)，在載入完成之前，有時無法得知嵌入內容的高度，導致版面配置位移大於 0.05。因此，我們的結論是，雖然許多來源都符合 0.05 的門檻，但嚴格較低的 CLS 門檻 0.1 相較在體驗品質和可達成性之間取得更好的平衡。我們希望網路生態系統日後能找出解決方案，解決第三方嵌入項目造成的版面配置變化，這樣就能在日後的 Core Web Vitals 疊代，使用更嚴格的 CLS「良好」門檻 (0.05 或 0)。
此外，為了判定 CLS 的「不佳」門檻，我們還使用 CrUX 資料來識別大部分來源都符合的門檻：
歸類為「不佳」的 CrUX 來源百分比 (適用於候選 CLS 門檻)
| 0.15 | 0.2 | 0.25 | 0.3 | |
|---|---|---|---|---|
| phone | 31% | 25% | 20% | 18% |
| 電腦 | 31% | 23% | 18% | 16% |
如果門檻為 0.25，代表手機來源約 20% 和 18% 的電腦來源，都會歸類為「不良」。落在目標範圍中介於 10-30% 之間，因此我們斷定 0.25 是可接受的「低」門檻。