faviconSEO Hub HK

JavaScript 搜尋引擎優化 JavaScript SEO

JavaScript SEO 是確保以 JavaScript 產生內容的網站,也能被搜尋引擎順利抓取、渲染和建立索引的技術 SEO 工作。重點是讓重要內容與連結在搜尋引擎處理頁面後仍然看得到。

Set SEO Hub HK as a preferred source on Google

JavaScript SEO 是技術 SEO的一個分支,目的是確保以 JavaScript 產生內容的網站,也能被搜尋引擎順利抓取、渲染和建立索引。許多現代網站使用前端框架,頁面內容在瀏覽器中才組合出來,如果處理不當,搜尋引擎可能看到的只是一個空白頁面。

JavaScript 頁面如何被處理

根據 Google 的說明,處理 JavaScript 頁面大致分三個階段:先抓取網址,接著渲染頁面(用接近瀏覽器的方式執行 JavaScript),最後才建立索引。Googlebot可能先讀取原始 HTML,再把頁面排入渲染;因此,需要等 JavaScript 執行後才出現的內容,被索引的時間可能較晚,也比較容易出問題。

常見問題

  • 封鎖資源:在 robots.txt 封鎖了 JavaScript 或 CSS 檔案,導致搜尋引擎無法正確渲染頁面。
  • 連結不可抓取:導覽只靠點擊事件跳轉,沒有使用帶有 href 的 a 標籤,搜尋引擎找不到其他頁面。
  • 網址只靠 # 區分:不同內容使用同一個網址,只在 # 後面改變,搜尋引擎難以把它們視為獨立頁面。
  • 狀態碼與中繼資料錯誤:單頁應用程式在頁面不存在時仍回傳 200,或所有頁面共用同一個標題與描述。

最佳實踐

  1. 重要內容優先使用伺服器端渲染(SSR)或預先渲染,讓原始 HTML 已包含主要文字與連結。
  2. 所有內部連結使用帶有 href 的 a 標籤,並為每個頁面提供獨立、乾淨的網址。
  3. 確保每個頁面有獨立的標題、描述與正確的狀態碼;不存在的頁面應回傳 404。
  4. 在 Google Search Console 用網址檢查工具查看渲染後的 HTML,確認重要內容確實出現。

網站改用新框架或改版前,建議先做一次技術 SEO 審核,確認渲染、連結與狀態碼沒有問題。

相關SEO術語

Technical SEO技術 SEO

Technical SEO(技術 SEO)是指優化網站的技術基礎,讓搜尋引擎能順利檢索、理解及建立索引,同時提供穩定、快速、安全的瀏覽體驗。它處理的是網站「能不能被讀到」的問題,而不是內容寫得好不好。

GooglebotGoogle 網頁爬蟲

Googlebot 是 Google 用來探索、讀取網頁的自動化爬蟲程式,負責把網頁內容交給 Google 建立索引。了解 Googlebot 如何運作、如何驗證及管理它的爬取行為,立即查看。

Crawl budget

Crawl Budget(檢索預算或抓取配額)指的是 Googlebot 在特定時間內願意抓取某個網站的頁面數量。這個配額取決於兩個主要因素:網站的「能力」與「需求」。如果你的網站內容很多,但檢索預算有限,可能會導致部分頁面無法被索引,影響 SEO 表現。