視覺化速度指標,提升SEO、使用者體驗和營收 - Whiteboard Friday
Table of Contents
1. Introduction 🌟
2. How Google Understands Speed 🕒
### 2.1 Relevance vs Speed ⚡
### 2.2 Lab and Field Data Mix 📊
### 2.3 Chrome User Experience Report (CrUX) 📝
3. Accessing CrUX Data 🔍
### 3.1 PageSpeed Insights 📈
### 3.2 CrUX Dashboard 📊
### 3.3 Querying Raw Data 🗃️
4. Visualizing CrUX Data 📊
### 4.1 The Importance of Visualization 💡
### 4.2 Tools for Visualization 🛠️
### 4.3 Use Cases for CrUX Data 📑
#### 4.3.1 Getting Buy-in for Optimization 📈
#### 4.3.2 Using the Revenue Impact Calculator 💰
#### 4.3.3 Informing Developers about Problem Areas 🚧
#### 4.3.4 Communicating the Impact of Optimization 📢
5. Conclusion 🎉
1. Introduction 🌟
歡迎來到另一期Whiteboard Friday!我是Sam Arden,是一名在網站爬蟲平台Deep Crawl擔任SEO員工。今天我們將討論Google如何理解網頁速度,以及如何可視化一些性能指標,從而改善使用者體驗並從你的網站獲得更多收益。
2. How Google Understands Speed 🕒
2.1 Relevance vs Speed ⚡
我們都知道快速的網站通常意味著更好的使用者體驗,但直到最近,Google並未將速度直接納入其算法中。直到去年7月的移動速度更新後,Google才真正開始關注速度。儘管速度現在只是次要的排名信號,因為相關性始終比頁面加載速度更重要,但這次更新中的有趣之處在於,Google確認了一些關於他們如何理解速度的細節。
2.2 Lab and Field Data Mix 📊
我們知道,Google對速度的理解是基於實驗室數據和實際用戶數據的混合。他們將來自Lighthouse和Chrome開發工具的實驗室數據與匿名Chrome用戶的數據相結合。這些數據可以在Chrome用戶體驗報告(CrUX)中找到,這是一個公開可用的數據庫。CrUX數據包含五個不同的指標,分別是First Paint、First Contentful Paint、DOM Content Loaded、Onload和First Input Delay。
2.3 Chrome User Experience Report (CrUX) 📝
要訪問CrUX數據,你有多種不同的方式。最簡單的方式是使用PageSpeed Insights工具,只需輸入你感興趣的頁面,它將返回一些CrUX指標以及Lighthouse的建議。但這只是對速度的快照,不適用於持續監控。你還可以通過CrUX儀表板訪問CrUX數據。該儀表板顯示CrUX數據庫中的五個指標,將頁面加載速度分為緩慢、普通和快速。你還可以查看月度趨勢,以了解網站的改善或惡化情況。然而,該儀表板對數據的可視化方式有限。為了更好地利用CrUX數據,你需要查詢原始數據。由於這是一個公開可用的數據庫,你可以創建SQL查詢,將其放入BigQuery中運行,然後將其導出到Google Sheets中,並將其帶入Data Studio中。這樣你就能創建出豐富的圖形來可視化網站的性能以及隨時間改善的情況。
3. Accessing CrUX Data 🔍
3.1 PageSpeed Insights 📈
PageSpeed Insights是一個簡單易用的工具,用於快速檢查頁面的性能。只需輸入你要檢測的頁面,它將返回一些基本的CrUX指標以及Lighthouse的建議,幫助你優化網站的性能。
3.2 CrUX Dashboard 📊
CrUX儀表板提供了更全面的CrUX數據。它顯示CrUX數據庫中的五個指標,並將頁面加載速度分為緩慢、普通和快速。此外,它還提供了月度趨勢圖,讓你了解網站性能的改善或惡化情況。
3.3 Querying Raw Data 🗃️
如果你想更深入地分析CrUX數據,你可以查詢原始數據。有一些指南可以幫助你開始進行這一過程,並使用SQL查詢來提取特定的數據。這樣你就可以將數據導出到Google Sheets或Google Cloud Storage中,並使用Data Studio進行更高級的數據可視化。
4. Visualizing CrUX Data 📊
4.1 The Importance of Visualization 💡
數據可視化對於理解網站性能和效果至關重要。通過將CrUX數據可視化,你可以更清楚地看到網站的問題區域以及效果改善的情況。這使你能夠更好地與管理層、客戶或開發人員溝通,推動優化工作。
4.2 Tools for Visualization 🛠️
有幾個工具可以幫助你可視化CrUX數據,例如Data Studio、Google Sheets和其他數據分析工具。通過使用這些工具,你可以創建各種圖表和圖形,直觀地展示網站的性能,並與其它業務指標進行對比。
4.3 Use Cases for CrUX Data 📑
4.3.1 Getting Buy-in for Optimization 📈
通過使用CrUX數據可視化,你可以向管理層或客戶展示你的網站在性能方面與競爭對手存在差距。這為推動優化項目和改進倡議提供了強有力的依據。
4.3.2 Using the Revenue Impact Calculator 💰
利用Google的收益影響計算器,你可以輸入有關你的網站的一些詳細信息,它將顯示如果網站速度提高了一定百分比,你可以獲得多少更多的收益。這將是一個有說服力的方式來向管理層展示優化的價值。
4.3.3 Informing Developers about Problem Areas 🚧
通過向開發人員展示你的網站存在哪些問題區域,例如首次內容渲染的延遲,你可以促使他們優化這些問題並改善網站性能。對於他們可能不認為存在問題的方案,你可以指出CrUX數據是來自真實的用戶體驗,這是他們真正需要關注的。
4.3.4 Communicating the Impact of Optimization 📢
一旦優化項目開始實施,你可以使用CrUX數據和業務指標進行對比,以展示優化對網站性能和業務指標的影響。你可以比較不同時間段的數據,並通過將它們對比來顯示改善。
5. Conclusion 🎉
通過理解Google如何理解頁面速度,以及如何使用CrUX數據進行可視化,你可以更好地改善網站性能,提供更好的使用者體驗,並獲得更多的收益。優化網站速度不僅對SEO有益,還對業務運營和客戶忠誠度有重要影響。快速的網站將吸引更多的用戶,並保持他們的忠誠,這在競爭激烈的市場中至關重要。
Highlights:
- Google understands page speed and considers it as a ranking signal.
- Chrome User Experience Report (CrUX) provides valuable data on speed metrics.
- CrUX data can be accessed through tools like PageSpeed Insights and CrUX Dashboard.
- Querying raw CrUX data allows for in-depth analysis and visualization.
- Visualizing CrUX data helps in gaining buy-in, informing developers, and communicating the impact of optimization.
- Optimizing website speed improves user experience and can lead to more revenue.
FAQ:
Q: What is CrUX data?
A: CrUX data is the Chrome User Experience Report, which provides insight into speed metrics based on real user experiences.
Q: How can CrUX data be visualized?
A: CrUX data can be visualized using tools like Data Studio, Google Sheets, and other data analysis tools.
Q: Why is website speed important?
A: Website speed is important for better user experience, customer loyalty, and potential SEO benefits. It can also impact business metrics like conversion rates.
Q: How can CrUX data be used to inform developers?
A: CrUX data can be used to identify problem areas on a website, such as delays in first contentful paint, and communicate these issues to developers for optimization.
Q: What tools can be used to access CrUX data?
A: Tools like PageSpeed Insights and the CrUX Dashboard provide access to CrUX data, while querying raw data allows for more advanced analysis.
Resources: