第 1 步:貼上你想改善的頁面網址

  1. 打開 Google PageSpeed Insights。
  2. 從瀏覽器複製一篇文章或產品頁的完整網址,貼進頁面最上方的輸入框。
  3. 按「Analyze」(介面若顯示中文,按「分析」),等待報告完成。

先測你真正想改善的那一頁。首頁快,不代表文章頁也快。請記下測試網址和日期,稍後才能用同一頁比較。

怎樣算完成:畫面出現行動裝置與電腦兩個結果頁籤;若顯示無法分析,先確認網址能公開打開,再重試。

PageSpeed Insights 實際畫面:上方輸入本站網址,旁邊有藍色「分析」按鈕。
本站實際操作截圖|把要測的文章網址貼進上方欄位,再按「分析」。 點圖可看原尺寸。
  1. 找畫面最上方的網址輸入框。
  2. 貼上完整網址。
  3. 按右側藍色「分析」按鈕。

第 2 步:先點「行動裝置」

在報告上方選「行動裝置」(Mobile)。先看手機,是因為很多讀者用手機閱讀;如果你的網站主要在電腦上使用,也要再切到「電腦」比較。兩個分數可能不同,這是正常的。

頁面通常有兩塊資料:上方的「瞭解實際使用者體驗」整理實際訪客的使用情況;下方的「診斷效能問題」是工具當下模擬測試,會給出可以排查的項目。新站或訪客很少時,上方可能寫「沒有資料」,不代表網站沒被收錄,也不代表零分。這時先讀下方的測試建議。

怎樣算完成:你知道自己正在看手機或電腦報告,也知道上方有沒有真實訪客資料。

本站 PageSpeed 實際報告:行動裝置頁籤已選取,實際使用者體驗顯示沒有資料,下方列出診斷結果。
本站實際報告截圖|先選「行動裝置」;新站上方顯示「沒有資料」很常見,再往下看「診斷效能問題」。分數與畫面會隨時間改變。 點圖可看原尺寸。
  1. 確認「行動裝置」有藍色底線。
  2. 看「瞭解實際使用者體驗」右側是否寫「沒有資料」。
  3. 往下查看「診斷效能問題」,找一項能先改善的內容。

第 3 步:先找看得懂的症狀

不用一次研究所有數字。先看報告中哪一項顯示黃色或紅色,再對照讀者看到的情況:

  • 大圖片很晚才出現:先檢查首頁首圖或文章圖片是否太大。報告中常標作「LCP」。
  • 按了按鈕很久才有反應:檢查是否有過多外掛或互動程式。報告中常標作「INP」。
  • 文字或按鈕突然跳動:檢查圖片、影片或廣告有沒有預留位置。報告中常標作「CLS」。

接著往下找「診斷」或「改善建議」。點開一項,記下它指出的圖片、檔案或頁面元件。看不懂檔名時,先把問題和網址交給網站管理者,不必直接購買更大的 VPS。

第 4 步:只改一件事,再測一次

  1. 先挑自己能處理的一項,例如縮小一張過大的圖片。
  2. 修改後重新打開同一個網址,按「Analyze/分析」。
  3. 仍選相同的「行動裝置」或「電腦」頁籤,對比同一項問題有沒有改善。
  4. 若分數一次高一次低,稍後再測;不要因為一次分數就立刻換主機。

上方的真實使用者資料彙整一段時間的體驗,改完後不會立刻全部更新。若報告指出的是伺服器回應慢,而且你已排除圖片與外掛問題,再看 是否需要換主機。沒有真實訪客資料時,先用下方診斷找方向。

讀完能做什麼:你能自己測一頁、找到第一個問題、記錄修改前後的結果。

常見問題

一定要把分數做到 100 才能上線嗎?

分數是診斷參考。先改善讓真實讀者卡住的問題,例如主圖太大、版面跳動或按鈕回應慢,再觀察變化。

官方參考資料

本文依下列官方文件整理。實際操作前,請打開來源核對最新版指令與需求。

本文由 Cloud Atlas 編輯整理;操作來源與圖片出處列於文中。查看編輯原則