使用網頁開發人員工具對 Google 搜尋中的 JavaScript 問題進行偵錯

如何偵錯個別網頁或整個網站的 SEO 問題。

Martin Splitt
Martin Splitt

Google 提供許多工具,協助您在 Google 搜尋中偵錯 JavaScript SEO 問題。本指南將概略介紹可用的工具,並建議使用各項工具的時機。

使用 Lighthouse 找出基本的搜尋引擎最佳化問題

請使用 Lighthouse 進行第一次調查。 這項工具提供許多 SEO 稽核

Lighthouse 搜尋引擎最佳化稽核的螢幕截圖。

Lighthouse 搜尋引擎最佳化稽核是針對網站單一網頁進行的基本初步檢查。這項工具會找出最常見的錯誤,並提供初步印象,瞭解網站的搜尋引擎可探索性。請注意,Lighthouse 是在瀏覽器中執行,因此無法準確呈現 Googlebot 可能看到的網頁。舉例來說,瀏覽器 (和 Lighthouse) 不會使用 robots.txt 判斷是否可從網路擷取資源,但 Googlebot 會。因此,當 Lighthouse 找出潛在問題時,您應該修正這些問題,但可能需要使用其他工具進一步偵錯。

使用 Google 搜尋測試工具驗證網頁

Google 搜尋提供一系列工具,可測試 Googlebot 如何檢視您的網頁內容
從開發環境進行測試時,部分工具特別實用:

搭配本機通道或 ngrok 等工具,您可以在本機開發環境中建立暫時公開網址,並使用 Google 的測試工具進行測試,快速完成疊代。

這些測試工具可提供多項實用資訊,例如:

  • Googlebot 用於建立索引的轉譯 HTML
  • 載入的資源總覽,以及無法載入資源的原因說明
  • 控制台記錄訊息和 JavaScript 錯誤 (含堆疊追蹤)
行動裝置相容性測試的螢幕截圖。

Google Search Console 的網址檢查工具也能提供網頁狀態的詳細資訊。

網址檢查工具的螢幕截圖。

你可以查看:

  • 網址已編入 Google 搜尋索引,或日後可編入索引
  • 最近一次檢索作業轉譯的 HTML 內容
  • 網頁重新檢索後,轉譯的 HTML 內容
  • 網頁資源相關資訊
  • JavaScript 記錄訊息和錯誤 (含堆疊追蹤)
  • 螢幕截圖
  • 行動裝置可用性問題
  • 系統在網頁上偵測到的結構化資料,以及資料是否有效

使用這些工具,您就能找出並解決大部分問題。Google 搜尋也提供修正 Google 搜尋相關 JavaScript 問題的文件,協助您在找出問題原因後採取適當行動。

使用 Google Search Console 檢查網站健康狀態

上一節的工具非常適合解決網站單一網頁的特定問題,但如果想更全面地瞭解整個網站,請前往 Google Search Console

涵蓋範圍報表

涵蓋範圍報表會顯示網站上哪些網頁已建立索引,以及哪些網頁有問題。

涵蓋範圍報表的螢幕截圖。

網站使用體驗核心指標報告

網站使用體驗核心指標報告可協助您瞭解網站網頁的網站使用體驗核心指標成效。

網站使用體驗核心指標報告的螢幕截圖。

將這些工具納入開發人員工具組

本文介紹了一系列工具,可用於各種用途,包括在發布網頁前進行測試,以及監控實際網站上的網頁,讓您清楚瞭解 Google 搜尋的網站探索成效。其中有些工具可能會成為您開發工具組的實用部分,有些則可能更像是臨時工具,用於找出問題原因並修正受影響的網頁。如要進一步瞭解 Google 搜尋開發人員或 JavaScript 搜尋引擎最佳化 (SEO),請參閱官方的開發人員專用搜尋說明文件。