JavaScript SEO とは？ | SEO 用語集

JavaScript SEO は、JavaScript でレンダリングされるウェブサイトが、検索エンジンによって適切にクロール・レンダリング・インデックスされるようにすることに焦点を当てたテクニカル SEOの一分野です。React、Vue、Next.js のような SPA フレームワークが現代のウェブ開発を席巻するなかで、その重要性が高まっています。

なぜ重要なのか

Googlebot は JavaScript を実行できますが、レンダリングのステップが加わるためインデックス登録が遅れ、プレーンな HTML よりも多くのリソースを消費します。Ahrefs の調査では、JS でレンダリングされたコンテンツの 10〜25% が検索結果で欠落するか遅延しています。Bing や多くの AI 検索クローラーは JS の実行能力がより限られているため、サイトが JS に依存すればするほど、GEO 時代に可視性を失うリスクが高まります。

Google の 2 段階インデックス登録

クロールキュー: Googlebot はまず初期 HTML を取得します。この段階では JS が生成するコンテンツは見えません。
レンダーキュー: Web Rendering Service（WRS）が後でページを Chromium でレンダリングし、最終的な DOM を生成します。この 2 つの段階の間隔は数秒から数日に及ぶことがあります。

その結果、JS でのみ挿入されるコンテンツやリンクは「見えるが、遅れて見える」状態になります。

中核となるチェックリスト

レンダリング戦略: SSR（サーバーサイドレンダリング）、SSG（静的サイト生成）、またはハイブリッドのアプローチは、クライアントサイドレンダリングよりはるかに安全です。Next.js の getStaticProps と getServerSideProps は定番の解決策です。

内部リンクには実際の <a href> を使う: JS の onClick ハンドラだけに頼るリンクはクローラーにたどってもらえません。必ず実際の href を含めましょう。

重要なコンテンツは初期 HTML に: タイトル、本文、メタタグ、構造化データは、最初の HTML レスポンスに含める必要があります。JS でのみ挿入するのは避けましょう。

遅延読み込みの注意点: スクロールに応じた遅延読み込みは問題ありませんが、クリック（タブ、アコーディオン）でのみ表示されるコンテンツはクローラーに見られないことがあります。

robots.txt で JS/CSS をブロックしない: Googlebot がページをレンダリングするには JS と CSS のファイルへのアクセスが必要です。

検証ツール: Google Search Console の URL 検査、モバイルフレンドリーテスト、リッチリザルトテストを使い、実際のレンダリングを確認しましょう。

Sources: