如何在 Looker Studio 中建立 CrUX 資訊主頁

Looker Studio (舊稱「數據分析」) 是一項強大的資料視覺化工具,可讓您根據大數據來源 (例如 Chrome 使用者體驗報告 (CrUX)) 建立資訊主頁。本指南將說明如何建立自訂 CrUX 資訊主頁,追蹤來源的使用者體驗趨勢。

CrUX 資訊主頁的螢幕截圖,顯示在不同月份變化的堆疊長條圖。
CrUX 資訊主頁

CrUX 資訊主頁是使用 Looker Studio 的 社群連接器功能建構而成。這個連接器是 BigQuery 上原始 CrUX 資料與 Looker Studio 視覺化之間預先建立的連結。使用者不必編寫任何查詢或產生任何圖表。一切都已為您準備就緒,您只需提供來源,系統就會為您產生自訂資訊主頁。

預設 CrUX 資訊主頁

CrUX 有一個由 CrUX 團隊維護的預設資訊主頁。團隊會新增新的指標 (例如 INP),並在下次載入資訊主頁時提供。

建立自訂資訊主頁

有些使用者會想自訂資訊主頁。在這種情況下,您可以建立自己的預設資訊主頁副本,並視需要變更。

如要建立自訂資訊主頁,請前往 g.co/chromeuxdash。這會將您導向 CrUX 社群連接器頁面,您可以在該頁面中提供資訊主頁的來源。請注意,首次使用者可能需要完成權限或行銷偏好提示。

CrUX Dashboard 資訊主頁連接器設定畫面的螢幕截圖,其中包含可輸入來源網址的欄位,以及可在報表中修改該欄位的勾選方塊。
CrUX Dashboard 連接器

文字輸入欄位只接受來源,不接受完整網址。例如:

Origin (支援)
https://developer.chrome.com
網址 (不支援)
https://developer.chrome.com/docs/crux/guides/looker-studio-dashboard

如果您省略通訊協定,系統會預設採用 HTTPS。子網域很重要,例如 https://developers.google.comhttps://www.google.com 會被視為不同的來源。

來源發生的常見問題包括提供錯誤的通訊協定 (例如 http:// 而非 https://),以及在需要時省略子網域。部分網站會包含重新導向,因此如果 http://example.com 重新導向至 https://www.example.com,您應使用後者,這是來源的標準版本。一般來說,請使用使用者在網址列中看到的原始網址。

勾選核取方塊後,資訊主頁網址就會包含來源網址,日後只要變更這個網址參數,即可針對不同的來源使用同一個資訊主頁。

按一下「Connect」按鈕。如果您勾選了核取方塊,系統會要求您確認這項設定。

如果 CrUX 資料集未納入您的來源,您可能會收到下圖所示的錯誤訊息。資料集中有超過 1, 500 萬個來源,但您要的來源可能沒有足夠的資料可供納入。

彈出式錯誤訊息的螢幕截圖,當中顯示「這個資料集中有超過 1500 萬個起點,但 https://doesnotexist.origin 並非其中之一
當來源不存在時,CrUX 社群連接器的錯誤訊息

如果來源存在,系統會將你帶往資訊主頁的結構定義頁面。這會顯示所有包含的欄位:每個有效連線類型、每個板型規格、資料集發布月份、每個指標的績效分布,以及來源名稱。您不需要在這個頁面上執行或變更任何操作,只要按一下「建立報表」即可繼續。

CrUX Dashboard 結構定義編輯器的螢幕截圖,其中顯示各種欄位、類型、匯總和說明,可變更或新增欄位。
CrUX 資訊主頁結構定義

使用資訊主頁

每個資訊主頁都包含三種頁面:

  1. Core Web Vitals 簡介
  2. 指標成效
  3. 使用者客層

每個頁面都含有一張圖表,顯示各個每月發行版本的變化情形。當新資料集發布時,您可以重新整理資訊主頁來取得最新資料。

每月資料集會在每月的第二個星期二發布。舉例來說,如果資料集包含 5 月的使用者體驗資料,就會在 6 月的第二個星期二發布。

Core Web Vitals 總覽

第一頁會概略顯示來源網站的每月網站使用體驗核心指標成效。這些是 Google 建議您著重的重要使用者體驗指標。

CrUX 資訊主頁 Core Web Vitals 總覽的螢幕截圖,顯示 LCP、INP 和 CLS 指標資訊。
CrUX 資訊主頁 Core Web Vitals 總覽

您可以透過「Core Web Vitals」頁面,瞭解電腦和手機使用者對來源的體驗。根據預設,系統會選取您建立資訊主頁時的最近一個月。如要切換為較舊或較新的月度版本,請使用頁面頂端的「月」篩選器。

請注意,這些圖表預設會略過平板電腦,但如有需要,您可以移除柱狀圖設定中的「No Tablet」篩選器:

在 Looker Studio 中編輯「篩選器」選項的螢幕截圖。
編輯 CrUX 資訊主頁,在 Core Web Vitals 頁面上顯示平板電腦

指標效能

在「網站使用體驗核心指標」頁面之後,您會看到 CrUX 資料集中所有指標的獨立頁面。

CrUX 資訊主頁 LCP 頁面的螢幕截圖,顯示各個月份的各種堆疊條形圖表變化。
CrUX 資訊主頁 LCP 頁面

每個頁面的頂端都有「裝置」篩選器,可用於限制體驗資料中包含的板型規格。舉例來說,您可以深入探討手機體驗。這項設定會在各頁面中保留。

這些頁面上的主要圖表,是按「良好」、「需要改善」和「不良」分類,顯示每月體驗分布的情況。圖表下方的圖例以顏色標示各類別的體驗範圍。舉例來說,在先前的螢幕截圖中,您可以看到最大內容繪製 (LCP) 體驗中,近幾個月來出現波動並變得稍微惡化的百分比。

圖表上方會顯示最近一個月「良好」和「不佳」體驗的百分比,以及與上個月的百分比差異。針對這個來源網頁,每月「良好」LCP 體驗的比例從 3.2% 降至 56.04%。

此外,針對提供明確百分位數建議的 LCP 和其他 Core Web Vitals 等指標,「良好」和「不佳」百分比之間的「P75」指標會呈現在「良好」和「不佳」百分比之間。這個值對應於來源的使用者體驗第 75 百分位數。換句話說,75% 的體驗都優於這個值。請注意,這項設定適用於來源網頁上所有裝置的整體分發情形。使用「裝置」篩選器切換特定裝置不會重新計算百分比。

百分位數的技術注意事項

請注意,百分比指標是根據 BigQuery 的直方圖資料計算,因此精細程度較低:LCP 為 100 毫秒、INP 為 25 毫秒,CLS 為 0.05。換句話說,如果 P75 LCP 為 3800 毫秒,表示實際的 75 百分位數介於 3800 至 3900 毫秒之間。

此外,BigQuery 資料集採用「分箱」技術,將使用者體驗密度分組成粗略的分箱,並逐漸降低精細度。這樣一來,我們就能在分布的尾端加入精確度極高的密度,而不會超過四位數的準確度。舉例來說,如果 LCP 值小於 3 秒,就會歸入 200 毫秒寬的值區。3 到 10 秒之間的區間寬度為 500 毫秒。超過 10 秒,特徵分塊寬度為 5000 毫秒... 與其使用不同寬度的特徵分塊,分塊可以確保所有特徵分塊的寬度都是 100 毫秒 (最大公因數),而且每個特徵分塊的分佈都是線性內插。

PageSpeed Insights 等工具中的對應 P75 值並非根據公開的 BigQuery 資料集,因此可提供精確至毫秒的值。

使用者客層

使用者客層頁面包含兩個維度:裝置和有效連線類型 (ECT)。這些頁面會顯示各個客層使用者在整個來源網站上的網頁瀏覽數分布情形。

「裝置分布」頁面會顯示手機、電腦和平板電腦使用者的細目資料,許多來源的平板電腦資料通常很少,甚至沒有,因此您經常會看到「0%」出現在圖表邊緣。

CrUX 資訊主頁裝置頁面的螢幕截圖,顯示裝置細目每月變化情形。
CrUX 資訊主頁裝置頁面

同樣地,ECT 分布頁面會顯示 4G、3G、2G、慢速 2G 和離線體驗的分布情形。

系統會使用首次顯示內容所需時間 (FCP) 直方圖資料的區隔,計算這些維度的分布情形。

常見問題

以下是一些關於在 Looker Studio 中建立 CrUX 資訊主頁的常見問題:

什麼時候應該使用 CrUX 資訊主頁,而非其他工具?

CrUX 資訊主頁會根據 BigQuery 提供的相同基礎資料,但您不必撰寫任何 SQL 指令碼即可擷取資料,也不必擔心會超出任何免費配額。與查看查詢基礎資料相比,設定資訊主頁能更輕鬆快速,且系統會為您產生所有圖表,您也可以控管與任何想要共用的使用者共用資料。

使用 CrUX 資訊主頁是否有任何限制?

以 BigQuery 為基礎,Chrome 使用者體驗資訊主頁也會沿用所有限制。這項功能僅限於月度精細程度的原始資料。

CrUX 資訊主頁也簡化了 BigQuery 原始資料的多項用途,既簡單又方便。舉例來說,指標分布僅會以「良好」、「需要改善」和「不良」等評估,而不會顯示完整的直方圖。CrUX 資訊主頁提供的是全球層級資料,BigQuery 資料集則可讓您放大特定國家/地區。

我想進一步瞭解 Looker Studio,該怎麼做?

詳情請參閱 Looker Studio 功能頁面