JavaScript SEO 終極指南

已發表: 2020-03-26

SEO 作為一個整體最近轉向使用不同的前端語言已經不是什麼秘密了。 使用 Google Tag Manager (GTM) 需要 HTML 和（有時）Vanilla JavaScript 的基本知識。

說到 JavaScript，最近有一場關於 Google 爬蟲為何以及如何讀取 JavaScript 的討論。 出現的一些相關問題：

  • Google 會閱讀 JavaScript 嗎？
  • 如果我的網站大量使用 JavaScript，我到底應該改變什麼？
  • 什麼是服務器端渲染？
  • 我應該將它用於我網站上的每個 JavaScript 框架嗎？

我們在下面剖析了這些問題，並試圖詳細回答每個問題：

現代JavaScript應用於SEO的簡介

如果您不精通前端開發，JavaScript 是一種渲染編程語言，（今天）通過所謂的 DOM 方法將其用於動畫目的。 在其更複雜的形式中，它用於使用 React 和 Vue 等框架構建本機 Web 應用程序。 雖然 React 和 Vue 非常流行並且許多網站開始使用這些框架，但作為 SEO 專業人員，您更有可能遇到遺留架構，例如使用 Vanilla 和 jQuery 運行的 WordPress。 確切地說，JavaScript在此類CMS中的應用主要涉及幻燈片、手風琴和其他形式的文本動畫。

為什麼 JavaScript 是 SEO 問題？

谷歌表示，Googlebot 可以抓取、索引和排名任何形式的 JavaScript 中包含的每條內容。 然而，實際上，這個話題要復雜得多。 Googlebot 確實可以抓取靜態語言（即 HTML 和 CSS），但是當涉及到對象就緒的編程語言時，它的行為就不同了。 2017 年，技術 SEO 開始指出，今天稱為渲染隊列。 這是 Googlebot 用來為任何客戶端 JavaScript 中包含的任何形式的文本編制索引的假設時間範圍（我們稍後會介紹）。

考慮到這一點，就很容易理解為什麼 JavaScript 已成為 SEO 的一個微妙主題。 因為重要內容在渲染隊列中而被阻止可能會立即降低您的排名。 這個問題在 WordPress 等非常依賴 JavaScript 的 CMS 架構中很明顯。

那應該是我的首要任務嗎？

不，但同時是：一個常見的誤解是 JavaScript 中包含的內容會自動被 Google 刪除，但事實並非如此。 僅僅因為一段內容包含在 JavaScript 中，並不意味著它不會排名，它可能只需要更長的時間。 目前，第一次抓取後簡單文本片段的渲染隊列在 72 小時左右波動。 但是，在某些情況下，內容需要大約五到六週的時間才能被 Google 編入索引，因為它們被困在基於 jQuery 的手風琴中。 所以是的，從 JavaScript 中刪除以關鍵字為主導的內容，但前提是您 100% 確定其呈現隊列太長。

框架和渲染速度

JavaScript 在最近發生了很大的變化。 2014/15 年引入的 ECMA 腳本導致引入了更快、更高效的框架。 React（仍然）是最流行的 UI 框架 JavaScript 庫。 從谷歌的角度來看，很難追踪哪個庫在渲染速度方面表現更好。 有幾十個變量需要考慮； 使用的 CMS 類型、多個函數連接和其他不應真正與 SEO 相關聯的非常技術性的方面。

根據最近的數據，我們可以有把握地說 Rea​​ct 框架在渲染方面是最快的，因為它很簡單。 再一次，內容動畫等主要是基於 jQuery/Vanilla 的。 與 UI 和本機應用程序中更常見的 React 架構相比，SEO 技術專家更容易遇到這些框架。

在 Red Cow，我們始終推薦在構建 Web 應用程序時使用 React 組件，這就是為什麼我們是最值得信賴的曼徹斯特 SEO機構。

Javascript

Render/Fetch As Google：精確嗎？

不幸的是沒有。 要測試您頁面的 JavaScript 及其呈現隊列，最好的方法是分析您網站的訪問日誌文件。 這樣，您就可以準確評估爬蟲在您頁面上的點擊次數，從而了解哪些頁面具有更好的呈現隊列。 Search Console 上的舊“fetch as Google”功能對於檢查頁面的 HTML 層次結構可能仍然有用，但在理解 JavaScript 方面肯定不准確。 此外，Search Console 並不總能識別託管在外部 CDN 上的各個框架。 或者通過告訴你一段內容不是因為 JavaScript 而呈現，它忽略了這樣的腳本是外部託管的事實，這是PWA和其他形式的數據驅動插件的常見做法。

使用 JavaScript 資源構建內容的最佳方式

從 JavaScript 中分離內容是完全可行的，並且可以通過多種方式完成。 例如，您可以要求您的開發人員將所有 DOM 方法動畫和功能移動到非 HTML 標記，以將各種形式的內容從 JavaScript 中解放出來。 如果 JavaScript 用於架構和引擎（即 Node、一些 React、Vue），您可能需要考慮使用服務器端渲染庫 (SSR)，與客戶端渲染 (CSR) 相反。 此過程在您的服務器中執行 JavaScript 和動態資源，而不是在您選擇的瀏覽器中。 這不僅顯著有利於您的渲染隊列，而且大大加快了頁面加載時間。

Javascript 中的結構化內容

包起來

從前端的角度來看，JavaScript 是一件複雜的事情，而且在其應用程序 SEO 方面要復雜得多。 不幸的是，如今超過 90% 的互聯網都在 JavaScript 上運行或在其代碼中使用至少五個腳本。 在像 SEO 這樣不斷發展的領域，必須承認能夠分析和評估您網站的 JavaScript 的重要性。