Google PagesPeed Insights：平衡分數與站點功能的初學者指南

每一秒都在線計算，您的網頁速度直接影響SEO性能，流量和轉換。清楚了解您網站的性能的最簡單方法是在Google PagesPeed Insights（Google PSI）上對其進行測試。

這是一個免費的網絡性能分析工具，可提供總體得分（分別為100個）和可行的技巧，以提高您的性能。錦上添花的是，您會在幾秒鐘內獲得結果！

普通神話： “我需要在PSI上得分100/100才能擁有一個快速的網站。”

這是一個普遍的誤解。雖然高分很不錯，但最重要的是通過Google PSI的核心網絡生命力（CWV）評估。

但為什麼？

Core Web Vitals是Google創建的三個指標，以衡量頁面上的真實用戶體驗。這些指標已成為Google核心排名系統的一部分，直接影響您對搜索引擎的可見性。

本指南將幫助您在應用Web Performance最佳實踐和維護對訪問者重要的功能和設計之間找到適當的平衡。

什麼是Google PagesPeed Insights？

PagesPeed Insights（PSI）是由Google創建的免費工具，可分析網頁的性能，並為改進提供具體的建議。它提供了性能得分以及基於燈塔指標的詳細反饋。 Lighthouse是一種開源工具（也由Google開發），旨在改善網頁的質量和用戶體驗。

這是您可以在Google PSI上找到的全球分數的示例，也是一些重要的指標：

Google PagesPeed Insights中使用的關鍵燈塔指標

Google PSI使用燈塔來計算性能得分。這些分數主要基於核心網絡生命值和其他重要指標，這些指標有助於評估用戶體驗和加載行為。

對於每個KPI，以下是要分數的顏色：

• 0至49（紅色）：糟糕

• 50至89（橙色）：需要改進

• 90至100（綠色）：好

這是指標。

1. 最大的內容塗料（LCP）告訴您主內容負載的速度。

示例：當博客文章的英雄圖像和標題清楚地顯示在屏幕上時。

2. 與下一個油漆的互動（INP）指示您的網站在某人單擊或TAPS時的反應速度。

示例：您點擊“添加到購物車”，然後按鈕立即響應，或者可能有一個小滯後。

3. 累積佈局偏移（CLS） 衡量加載時頁面的穩定性。

示例：當佈局移動（如廣告）時，您即將單擊鏈接，然後不小心點擊其他內容。

4. 首先內容塗料（FCP）計算時間，直到出現內容的第一位。

示例：落在頁面上後不久出現徽標。

5. 是時候第一個字節（TTFB） 指示服務器響應需要多長時間。

示例：您單擊一個鏈接，並且在任何內容開始加載之前都有停頓。

6. 總阻塞時間（TBT）分析了瀏覽器響應輸入所需的時間。

示例：該頁面看起來已加載，但沒有立即對您的滾動或單擊。

7. Speed Index（SI）告訴您頁面上的所有內容在視覺上看起來很快。

示例：內容填充平滑而不是在塊中加載。

為什麼核心網絡生命值評估比性能得分更重要

核心Web Vitals（CWV）是Google排名信號的一部分，這意味著它們可以影響您的SEO以及您的網站在Google上的排名。在CWV評估上取得“良好”分數的任何努力都意味著您的網站為您的訪問者提供快速，穩定和響應的體驗，搜索引擎將為您帶來獎勵。

核心Web Vitals優化對WordPress機構也很重要。他們中的大多數人致力於交付在綠色中得分的網站。例如，在里昂，有Agence KN。它的創始人托馬斯·鮑德里（Thomas Baudry）解釋說：

核心網絡生命值是我們質量方法的核心：我們在開發過程中定期測試它們，以確保性能和光滑的用戶體驗。就在上線之前，我們激活WP火箭以最大化結果。我們始終與客戶共享PagesPeed Insights分數，以及性能保證：性能和可訪問性的90多分，最佳實踐和SEO的100分。

診斷部分：可行的提示，以提高網站的性能

PagesPeed Insights提供了一個詳細的診斷部分，列出了特定的操作，以提高網站的性能。它標記了問題，解釋了它們為什麼重要，並建議您應採取什麼措施來解決問題。 PSI檢測到您的網站何時建立在WordPress上，有時建議您使用插件輕鬆解決一些審核問題。

這是Web性能診斷部分的一個示例，其中包含應完成的工作列表，例如減少未使用的JavaScript，消除渲染障礙資源並啟用文本壓縮。

解決問題後，它將移至通過的審核部分並變為綠色。

通過平衡的鏡頭閱讀Google PSI

Google PagesPeed Insights可幫助您確定哪些元素會影響性能以及如何修復它們，而不是刪除它們。

例如，諸如聊天小部件，滑塊和嵌入式視頻之類的功能功能為您的網站增加了價值，但是它們通常是資源繁重的，如果不正確優化，它們可能會損害性能。

想像一下，PSI會標記您的主頁滑塊。

它可能突出顯示：

• 圖像未壓縮或正確優化

• 圖像未以下一代格式（例如WebP或AVIF）提供

• 未使用的CSS正在增加負載時間
  

PSI並不建議您刪除滑塊。取而代之的是，它指出，圖像需要為網絡做好更好的準備：正確的格式，合適的尺寸和良好的壓縮。

可以使用專門設計用於刪除不必要的代碼的在線工具或WordPress插件清理未使用的CSS。這些Web性能優化完成後，再次運行測試；您可能會發現問題已解決或改進。

WPCHEF.FR的WordPress專家Nicolas Richer說：

在Google PSI上獲得70或80已經是一個好兆頭：您知道您已經做得很好！問題是，實驗室數據與用戶如何真正體驗您的網站之間存在真正的區別。請記住，與簡單的小冊子網站相比，某些網站（例如復雜的WooCommerce商店或頁面建設者繁重的網站）的綠色分數可能會更加困難。因此，如果您的分數在橙色中，請不要驚慌。將事情置於上下文中；這仍然可能意味著您的網站的優化不佳。最後一件事是：移動性能最重要，因此請確保從“移動”選項卡進行測試。桌面是次要的。

什麼影響您的Google PSI分數

這5個常見問題通常會損害您的Google PSI分數，並對您的整體績效結果產生最大影響：

1。缺乏緩存和壓縮

如果沒有適當的緩存和文本壓縮，您的網站就必須每次從頭開始重新加載所有內容，增加服務器負載並放慢頁面交付。

示例：一個沒有瀏覽器緩存的站點使每個返回的訪問者都會重新下載整個CSS和JS文件，即使它們沒有更改。這會減慢您的網站，Google PSI確定了改進的空間。

2。不優化的代碼（CSS和JS）

腫的或未使用的CSS和JavaScript文件可以延遲您的主要內容出現的速度。

示例：一個主頁上加載了600 kb未使用的JavaScript延遲，在移動設備上呈現幾秒鐘的可見內容。 Google PSI可能會要求您優化JS並優先考慮基本腳本。

3。大圖像和視頻

重型媒體文件加載需要更長的時間，尤其是在較慢的連接上，都會影響速度和視覺穩定性。

示例：以JPG格式的3 MB英雄圖像導致最大的內容加載，但最大的內容塗料（LCP）度量失敗。 Google PSI可能建議您壓縮此圖像並將其轉換為較輕的格式，例如WebP或AVIF。

4。太多的外部HTTP請求（包括第三方腳本）

每個外部請求都會為瀏覽器添加更多工作，尤其是當文件託管在慢速或遙遠的服務器上時。

示例：多個第三方腳本，例如廣告，聊天小部件和社交供稿塊渲染並拖延您的Google PSI分數。

5。插件過多或管理不良

太多的插件，尤其是過時或效率低下的插件，可能會膨脹您的代碼並相互衝突，從而降低性能。

示例：一個具有20多個活動插件的WooCommerce商店包括冗餘腳本和样式，這些腳本和样式減慢了每個頁面加載。 Google PSI可能會要求您減少未使用的代碼或最大程度地減少主線程工作。

Google PSI的實用優化以普通英語

Google PagesPeed Insights通常會向您提供技術術語，但這是它們真正的含義以及如何使用兩個WordPress插件輕鬆修復它們：WP Rocket和Fimify。這些工具共同解決PSI標記的大多數問題，並幫助您更輕鬆地達到綠色分數。

WP Rocket是WordPress最強大但最簡單的性能插件，可以立即改善您的核心網絡生命線。激活後，它應用了80％的Web性能最佳實踐，例如緩存，壓縮，縮小和懶惰的加載。您無需觸摸一行代碼。對於高級調整，您可以簡單地啟用性能功能，例如延遲的JavaScript加載或一鍵刪除未使用的CSS。

想像是WordPress最簡單的圖像優化插件。它可以在沒有質量損失的情況下壓縮您的圖像，並自動將其轉換為WebP和Avif等下一代格式。結果：較小的圖像文件，更快的加載時間和更平滑的用戶體驗，而無需舉起手指。

現在，您了解了這兩種工具的更多信息，讓我們看看它們如何幫助修復和優化一些PSI建議。

1。實施緩存

Google PSI的性能警告：通過有效的緩存策略提供靜態資產。

它的含義是：保存您的網站頁面版本，以便為反复訪問者加載更快。

WP Rocket會自動進行。激活插件時，在台式機和移動設備上啟用了緩存。

2。啟用壓縮

Google PSI中的性能警告：啟用文本壓縮。

它的含義是：將文件縮小文件，例如HTML，CSS和JavaScript，然後將其發送到瀏覽器。

WP Rocket可以自動啟用GZIP壓縮，以減少文件大小和加載時間。

3。代碼縮小

Google PSI中的性能警告：縮小CSS和JS。

這意味著：在代碼中刪除不必要的字符（例如空格或評論），以使其更輕。

WP Rocket自動減小CSS和JavaScript文件。

4。消除渲染阻滯資源

Google PSI的性能警告：消除渲染阻滯資源。

它的含義是：防止某些腳本或樣式延遲網站的可見部分。

WP Rocket使用“ LOAD JS延期”，“延遲JS執行”和“刪除未使用的CSS”選項來解決此性能問題。

5。實施懶惰加載

Google PSI中的性能警告：推遲屏幕圖像。

它的含義是：僅當用戶向其滾動時，加載圖像，視頻和iframe。

WP Rocket包括一個懶惰功能，您可以單擊一次。它通過推遲屏幕外元素的加載來提高加載速度，包括圖像，CSS背景圖像，視頻和iFrame，直到用戶向它們滾動。

6。以下一代格式提供圖像

Google PSI中的性能警告：以下一代格式提供圖像。

它的含義是：使用諸如WebP或AVIF之類的現代格式，而不是較舊的，例如JPG或PNG等較重的格式。

Fmimify會自動將您的圖像轉換為WebP，並為您提供將其轉換為AVIF的選項。該插件使用智能壓縮模式，該模式可以壓縮圖像，同時保持視覺質量完整。

如何將Google PSI用於您的網站

請按照以下6個步驟正確準備，保持批判性的注意，並採取分步方法來改善網站的性能：

1。了解您的需求和網站類型

從您的網站的目的開始：它是內容豐富，注重圖像，電子商務還是簡單的博客？期望和要求大不相同。一個帶有一些帖子的個人博客與具有列表，地圖集成和用戶生成的內容的房地產平台的需求相同。在潛入性能報告之前，請記住此上下文。

2。去Google PSI並輸入您的URL

前往PagesPeed Insights並粘貼網站的URL以啟動審核：

3。仔細解釋結果

使用PSI來識別改進的領域，但不要盲目地刪除對業務必不可少的功能。

示例：如果您運行房地產網站並將psi標記為javaScript較重的地圖集成，那並不意味著您應該將其刪除。聊天插件或出售房屋的高質量圖像也是如此。優化這些功能，而不是刪除它們。

4。採取行動並開始優化

有了正確的工具和插件，改善核心網絡生命力並解決PSI問題變得更加容易。

如果您的報告顯示了圖像問題，例如“以下一代格式使用圖像”或“有效編碼圖像”或“縮小JS”，“以有效的高速緩存策略服務靜態資產”，請嘗試使用Fimify和WP Rocket來修復它們。

重複PagesPeed Insights標記的每個問題的步驟，您的核心網絡生命力肯定會改善。

5。監視您的更改

幾天或幾週後，進行另一項PSI測試以跟踪改進。您還可以監視您的SEO進度 - 檢查您的排名是否有所提高，因為您的核心網絡生命值綠色。

6。與真實用戶進行測試

超越數字。向您的訪客或客戶詢問他們的經歷：

• 彈出窗口太多了嗎？

• 採購過程平穩嗎？

• 網站感覺快嗎？

在您的網站收集了足夠的流量之後，PSI還將開始顯示現場數據，這意味著基於實際用戶行為的現實世界績效指標。

隨時保存此備忘單以供以後進行，這樣您就會知道在決定進行第一個審核時該怎麼辦：

超越Google PSI測試的替代工具

雖然Google PagesPeed Insights是一個很好的起點，但其他兩個Web性能工具在更深入的性能測試中脫穎而出：GTMetrix和WebPageTest。兩者都提供了更多的顆粒數據和自定義選項，這些選項超出了PSI在Web性能監視方面提供的內容。

用GTMetrix測試性能

GTMETRIX是一個免費的工具，也由燈塔提供動力。它是了解每個資源如何影響性能以及站點在不同條件下的行為的理想選擇。像Google PSI一樣，它顯示了所有關鍵的Web性能指標（包括核心網絡生命力），但它走得更遠。

GTMETRIX提供了詳細的見解，例如以秒為單位的滿載時間，總頁面重量以及內容類型（JavaScript，Images，css等）的分解以及可視瀑布圖表，可讓您確切查看每個元素的何時以及如何加載。您還可以並排測試多個URL，以比較結果並模擬40多種移動設備和多種連接類型（4G，LTE等）。

用WebPagetest測試性能

WebPagetest是一個免費的工具，可提供用於深入分析的高級功能，並且在開發人員的靈活性和詳細見解方面是最受歡迎的功能。它提供瀑布圖表和完整的內容故障，以幫助您確切了解頁面的加載方式。

您可以在視覺上比較多個URL甚至導出性能報告，使其非常適合與客戶進行更深入的分析或共享。 WebPageTest每月支持300次免費測試，可讓您訪問30多個全球測試地點。它還使您可以在所有主要瀏覽器和連接速度上進行測試，以更準確地模擬現實情況（類似於GTMetrix）。

Google PSI限制

總而言之，Google PSI有三個主要限制，由GTMetrix和WebPagetest涵蓋：

1. 設備特異性：您無法選擇確切的設備（例如iPhone 12）進行測試。

2. 位置控制：您不能選擇特定位置來模擬用戶的體驗（例如巴黎）。

3. 缺少KPI：PSI不會顯示滿載的時間，內容分解或提供視覺瀑布圖表。

這是一個比較三個工具的摘要表：

Google PagesPeed Insights常見問題解答

Google PSI如何工作？

Google PagesPeed Insights是一個免費的工具，可以評估您在移動設備和桌面上的網頁的速度和穩定性。它使用燈塔技術進行了性能測試，並根據關鍵性能指標（例如加載速度和視覺穩定性）為您提供100分的總體得分。它還提供詳細的診斷和建議，以幫助您了解什麼正在減緩事情以及如何修復它。

如何利用Google PSI進行移動優化？

使用Google PSI進行移動優化的最佳方法是在運行PSI測試時簡單單擊移動選項卡。它模擬了您的網站在實際移動條件下的性能，包括較慢的連接和降低的設備功率。這是查看移動訪問者真正經歷的最佳方法，以及首先要優化的地方。

如何提高我的Google PSI分數？

專注於大型影響區域：瀏覽器緩存，最大程度地減少未使用的JavaScript和CSS，壓縮和調整圖像，並減少第三方腳本。 WP Rocket和Fimify等工具可以輕鬆解決最常見的問題，而無需接觸代碼。

如何下載PagesPeed Insights報告？

PSI接口上沒有一個單擊的下載按鈕。但是，如果您有點精通技術，則可以使用PagesPeed Insights API以JSON格式獲取結果，以報告或集成到工具中。對於日常用戶，最好的選擇是屏幕截圖或手動複製結果。

為什麼我的PSI手機和桌面得分不同？

PagesPeed Insights分別測試移動和桌面，結果通常不同。由於設備和網絡節流模擬現實世界條件，移動分數通常較低。移動視圖還可以加載不同的CSS規則，從而影響速度和佈局。

如何測量表現評分？

PagesPeed Insights根據幾個關鍵的燈塔指標，計算您的網頁性能得分100，包括第一個內容的油漆，速度索引，最大的內容塗料，總阻塞時間和累積佈局變化。這些中的每一個在最終成績中都起著不同的作用。 Google的燈塔評分計算器指出，哪個KPI在最終成績中的重量最高。

Google PagesPeed Insights中實驗室數據和現場數據有什麼區別？

實驗室數據是在具有固定條件（設備，網絡）的受控測試環境中生成的，可用於調試和發現性能問題。另一方面，現場數據反映了過去28天的真實用戶體驗，從而更準確地了解了您的網站在現實世界中的表現。

Google PSI為什麼在實驗室和現場數據中顯示不同的分數？

由於實驗室數據模擬了預設設備和連接上的加載，而字段數據基於帶有不同設備，位置和網絡的實際訪問，因此兩者之間的PSI分數可能會有所不同，具體取決於用戶實際與網站的交互方式。

哪個更重要：實驗室數據或現場數據？

現場數據通常更有價值，因為它基於真實的用戶體驗。但是，實驗室數據對於在開發過程中測試和解決性能問題仍然至關重要。理想情況下，一起使用兩者指導改進。

總結

Google PagesPeed Insights（PSI）是衡量網站性能並確定影響速度和用戶體驗的最可靠的免費工具之一。它著重於關鍵的Web性能指標和核心網絡生命值，它們直接與您的SEO和排名息息相關。

本文應該幫助您更好地了解PSI的工作原理，如何閱讀其報告以及在不犧牲設計或功能的情況下可以採取哪些實際步驟來提高分數。

現在是時候採取行動了：
在Google PagesPeed Insights上進行審核，並使用WP Rocket優化您的核心網絡生命力 - 由於14天退款保證，沒有風險！