Google Pagespeed Insights for Publishers - 提高網站頁面速度的技巧

頁面加載速度是谷歌搜索結果排名的主要考慮因素。 Google 一直在增加對整體訪問者體驗的關注，並創建了 Google Core Web Vitals 來跟踪頁面加載速度、頁面佈局穩定性以及用戶開始與頁面互動的速度。

谷歌最近開始在通過/失敗的基礎上衡量頁面速度和體驗，作為搜索排名的一個因素。 頁面體驗越來越成為在線發布商的基準，他們已經感受到廣告屏蔽用戶對頁面加載時間和帶寬敏感的影響。

尤其是發布商可能會受到谷歌新的頁面速度測試和評分方法的負面影響，因為廣告、標題出價、定位和廣告技術工具會進一步影響整體頁面體驗和速度。 您的 Google PageSpeed Insights 與您的覆蓋面有著內在的聯繫。 如果您的頁面加載緩慢，則新聞將繼續傳播 - 並將您拋在後面。

Google PageSpeed Insights 和 Core Web Vitals 得分

Google 開發了 PageSpeed Insights 工具來分析網站的內容和加載速度，對網站的性能進行評分，並提供信息以幫助發布商提高網站速度。 Google 使用名為 Lighthouse 的網站速度工具對您的網站進行桌面版和移動版分別從 1 到 100 的評分，其中 90+ 是一個不錯的分數。



最初 PageSpeed Insights 主要關注加載速度因素，但最近谷歌轉向關注整體網站體驗。 谷歌表示：“優化用戶體驗質量是網絡上任何網站長期成功的關鍵。”

PageSpeed Insights 最初是由網站的實驗室測試驅動的，但最近 Google 將重點轉移到更多的整體網站體驗上，並包括網站性能的現場數據。 他們精心設計了 Google Core Web Vitals (CWV)，它側重於用戶體驗的三個指標：頁面穩定性、內容加載速度和頁面參與速度。

SEO專家認為，搜索排名只使用谷歌字段數據，質量內容在排名因素中仍然起著很大的作用。

Google 的核心 Web Vitals 指標是什麼？

Google 的 Core Web Vitals 是評估頁面穩定性、頁面加載速度以及頁面響應用戶交互的速度的三個指標。 Core Web Vitals 針對桌面和移動體驗進行測量和報告，可從 Google Search Console 及其開發人員 PageSpeed Insights 頁面訪問。 任何想衡量自己網站或任何網站的人都可以輸入頁面 url 並查看報告。

• 最大內容繪製 (LCP) -此評級是指頁面加載頁面主要內容的速度。 2.5 秒或更短的 LCP是一個不錯的分數。
  
  
• 首次輸入延遲 (FID) -此評級衡量網頁對用戶採取的操作做出反應所需的時間。 此測量的計時器在頁面上有視覺內容供用戶做出反應時開始，並在頁面能夠響應訪問者的操作時結束。 如果頁面無法響應用戶，因為它正在響應它首先加載的許多其他腳本，那麼 FID 分數將受到影響。 對於及格分數， 100 毫秒或更短的 FID是一個很好的分數。
  
  
• 累積佈局偏移 (CLS) - CLS 測量頁面和佈局的視覺穩定性。 如果你按下標籤，事情會移動嗎？ 您是否有稍後加載並導致頁面佈局發生變化的廣告、圖像或頁面元素？ 這導致較差的 CLS 分數。 CLS 評分為 0.1或更低是一個不錯的分數。

Google 開發組的這個視頻示例說明了 CLS 問題。 用戶試圖拒絕購買，但在點擊時佈局在他身上發生了變化，他不小心點擊了購買，導致非常不愉快的體驗。

谷歌對發布者進行自己的頁面速度審核的指導： “如果頁面滿足上述所有三個指標的第 75 個百分位的推薦目標，則認為該頁面通過。”

頁面加載速度和核心 Web Vitals 指標已集成到 Chrome 的開發人員工具中，可從 Chrome 瀏覽器中獲取。 Chrome 開發者模式甚至會在整個加載過程中拍攝頁面快照，以幫助精確定位問題發生的位置。


更新：Moz 的 Tom Capper 最近的研究數據表明，如果網站排名未通過所有 3 個 Core Web Vitals 閾值（LCP、FID、CLS），則主要影響網站排名，但未通過 1 或 2 與對排名。

發布商如何提高頁面加載速度和核心 Web Vitals？

發布商應定期至少執行以下三個步驟來提高網站性能：首先，定期運行頁面速度和交互測試並查看報告； 其次，確定加載了哪些未使用或不必要的元素，例如舊字體或 css 腳本。 第三，注意圖像、CSS、視頻和 JavaScript，它們都可以通過壓縮、縮小或連接來優化大小和加載速度。

以下是發布商可改善網站加載時間、核心網絡生命力和訪問者體驗的其他步驟和資源。

實施延遲加載以改善 FID Web Vital

延遲加載將圖像或其他元素的加載推遲到主頁內容和佈局加載並可用之後。 這可以提高帶寬和 FID 指標。 想想那些永遠不會出現在首屏的圖像和元素，這些元素可以被推遲，以確保最初的體驗是快速和互動的。

Wordstream 提供了一篇關於何時以及如何實現延遲加載的好文章，但您可能需要查看圍繞您的 CMS 系統構建的特定社區。 Hubspot 的一些功能內置了延遲加載，並且有一些用於延遲加載自動化的 Wordpress 插件。

利用內容交付網絡 CDN

利用 CDN 並確保對其進行正確配置以提高性能。 內容交付網絡 (CDN) 可以通過在地理上更靠近用戶的地方託管媒體副本來減少帶寬和頁面加載時間。 例如，加拿大的訪問者可能會通過多倫多的 CDN 服務器交付您的內容，而同時訪問印度的訪問者可能會從欽奈交付內容，所有這些都由 CDN 進行最佳管理。

壓縮圖像和視頻以加快頁面加載速度

大型媒體文件是導致頁面加載速度變慢的主要原因之一，也是最容易解決的問題之一。 您應該按大小對您網站上的所有圖像進行排名，並立即註意那些 100k 或更大的圖像。 您可以使用 Screaming Frog 之類的工具來抓取您的網站，以便在幾分鐘內識別所有大圖像。 Wordpress 和現代 CMS 系統通常內置有圖像壓縮工具，但請自行驗證。 有時，您可以使用專門為圖像壓縮構建的 3rd 方工具做得更好，例如 tinypng 或 jpeg-optimizer。

刪除未使用的 JavaScript 文件以提高頁面渲染速度

你的網頁有 JavaScript 膨脹嗎？ 如果 JavaScript 是渲染阻塞的，則需要在頁面完成渲染之前調用、下載、解析和執行它。 您有未使用的 JavaScript 文件嗎？ JavaScript 文件可以堆積用於定位、CMS 系統、設置跟踪像素、社交標籤、加載字體等。 您可以使用 Chrome DevTools 中的 Coverage 功能詳細確定有多少 JavaScript 未被使用。

運行 Google 頁面速度工具時，它會識別任何包含超過 20 KB 未使用代碼的 JavaScript。

組合或縮小 CSS 和腳本以提高頁面速度

縮小這些腳本可以保留它們的機器可讀性，但會使它們加載得更快。 有幾種工具可用於縮小腳本； RankRed 匯集了各種各樣的腳本縮小工具和描述。 如果您連接 JavaScript 或 CSS 文件，您還可以節省一些到服務器的行程。

優化 Core Web Vitals 的緩存

應針對您擁有的站點類型，跨緩存 PI 功能（例如 Cache-control 和 Last-Modified）審查緩存策略。 Google 開發人員提供了一些指導和緩存選項清單，以及流行服務器的配置選項。 您可能需要預加載緩存，以便在 Googlebot 到達以評估性能之前頁面已經優化。

WP 工具製造商 WP Rocket 建議預加載緩存是提高頁面速度的關鍵幫助，並製作了這個視頻來解釋。

幫助瀏覽器分配空間以避免佈局移位

• 指定圖像的高度和寬度屬性，以便瀏覽器可以規劃它們的空間，即使它們稍後延遲加載。
• 為廣告、iframe 和動態內容預留空間。 使用容器來幫助避免渲染時的佈局變化。
• 考慮使用鏈接 rel="preload"優化字體顯示  和字體顯示：可選。
  
  

運行分析

運行頻繁的 PageSpeed 測試可以讓您更深入地了解您的核心網絡生命力。 您不僅可以查看頁面速度分數，還可以查看正在加載的元素數量以及它們的加載速度。 深入您的報告以確定可能阻礙您的頁面速度的元素。 以下是一些流行的工具，用於查看不同級別的詳細信息並報告頁面加載、頁面速度和搜索引擎優化：

• 谷歌 PageSpeed 見解
• GTmetrix
• Pingdom 頁面速度監控
• 網頁測試

以下是有關頁面速度優化的更多技術和詳細討論的一些建議：

• 如何提高網站速度 Wordpress
• Nitropack：如何衡量和改進核心網絡生命力
• SearchEngineWatch - 為您的網站增壓的 28 種方法
• Toptal - 在 Google 的 PageSpeed Insights 評估中勝出
• Smashing Magazine - 衡量核心網絡生命力的指南
• Web.dev - 通過快速加載時間提高站點性能
  
  

您未來的計劃中有付費訂閱嗎？

Admiral 如何幫助提高出版商績效

Admiral 是早期倡導者，特別是頁面體驗對出版商的重要性，撰寫和談論頁面速度、廣告體驗、更好的廣告與壞廣告等。 改善網站體驗有助於減少消費者對廣告攔截軟件的使用。

此外，雖然許多廣告技術供應商都專注於單點解決方案，但 Admiral 已經建立了一個橫向參與自動化平台，可在整個訪問者關係之旅中提供解決方案，旨在減少發布商的技術負擔。

點解決方案為出版商增加技術債務

使用單點解決方案，發布者最終可以得到許多標籤、集成、定位決策引擎、與他們的開發團隊討論等。如果他們使用單獨的系統進行通訊增長、廣告攔截，他們實質上是在創造一個具有頁面速度和 UX 影響的科學怪人怪物恢復、同意管理、付費訂閱、註冊牆、社交粉絲增長等。

Admiral 經第三方速度測試驗證，超過 100 種客戶場景

Admiral 一直積極主動地幫助出版商優化 Core Web Vitals，並與國家認可的數字機構 (Anvil Media) 簽訂合同，以嚴格測試 Admiral 的單標籤解決方案的速度和對 Core Web Vitals 的影響。

Anvil 的頁面速度專家在 15 個客戶站點、所有 Admiral解決方案模塊、桌面和移動設備上測試了 Admiral 標籤，測試時間超過 5 天、前後測量以及所有 3 個 CWV 指標； 總共超過 300 個數據點。