SEO・AIO
JSサイトの本文がクローラーに届くか
初期HTMLに本文が無いと、検索やAIに読まれないことがあります
この記事の要点
JavaScriptで本文を後から描画するサイトは、初期HTML(サーバーが最初に返すHTML)に本文が含まれていないと、検索クローラーやAIに読まれないことがあります。
確認は、curlで生HTMLを見る、Search ConsoleのURL検査でレンダリング後を見る、Rich Results Testで補助確認する、という手順で進めます。
本文が届いていない場合は、主要ページをSSR/SSG化し、初期HTMLに本文を含める対策が有力です。変更後は再検証します。
— 01
結論
JavaScriptで本文を後から描画するサイトは、初期HTML(サーバーが最初に返すHTML)に本文が含まれていないと、検索クローラーやAIに読まれないことがあります。curlで生HTMLを見る、Search ConsoleのURL検査でレンダリング結果を見る、という2つの方法で、自社の本文が届いているかを確認できます。
— 02
検証目的
- 主要ページの本文が、初期HTMLに含まれているか
- 含まれていない場合、クローラーがレンダリング後に取得できているか
— 03
前提知識(レンダリング方式)
本文をどこで組み立てるかによって、クローラーへの届き方が変わります。
| 方式 | 本文の組み立て方 | クローラーへの届き方 |
|---|---|---|
| SSR / SSG | サーバー側で本文を含むHTMLを返す | クローラーに届きやすい |
| CSR | ブラウザ側でJSが本文を描画する | 初期HTMLに本文が無く、届かないことがある |
検索クローラーはレンダリングする場合がありますが、遅延や制限があります。AI向けクローラーはJavaScriptを実行しないものもあります(公開前に最新情報で要確認)。
— 04
確認方法(3手順)
1. 初期HTMLに本文が含まれるか(curl)
ページの本文の一節が、JS実行前の生HTMLに含まれるかを確認します。
curl -s https://example.com/target-page | grep -o '本文の特徴的な一節'- ヒットする → 初期HTMLに本文がある(届きやすい)
- ヒットしない → JS描画に依存している可能性(次を確認)
構造化データ(JSON-LD)が初期HTMLにあるかも同様に確認できます。
curl -s https://example.com/target-page | grep -o 'application/ld+json'2. レンダリング後を確認する(Search Console URL検査)
- Search Consoleの「URL検査」で対象URLを検査し、「クロール済みのページ」からレンダリング後のHTMLやスクリーンショットを確認します。
- 本文が表示されていれば、GoogleのURL検査上では、検査時点でレンダリング後に本文を確認できています。
なお、画面のボタン名・導線は変わることがあります。最新のUIで操作してください。
3. リッチリザルトテストで補助確認
Rich Results Testでレンダリング後のHTMLと構造化データの認識状況を確認できます。ここでもUIは変わりうるため、最新の画面で操作してください。
— 05
よくある原因と対策
CSRのみで描画している
主要ページをSSR/SSG化し、初期HTMLに本文を含める
本文がクリック後に展開する(アコーディオン等)
クリック操作に依存する本文は取得が不安定です。HTML上に存在させ、CSSで開閉します(DOMに存在しない本文は取得されないことがあります)
無限スクロールで本文が後読み込みされる
重要な本文は初期表示に含める
— 06
本番適用の条件
- フレームワーク(Next.js等)のレンダリング方式を、ページ単位で確認します。
- 変更後は再度curlとURL検査で、本文が初期HTMLに載ったかを検証します。
— 07
公式ドキュメント
- Google 検索セントラル(JavaScript SEO / レンダリング)
- 各AIサービスのクローラー仕様(JavaScriptの実行可否は公開前に最新を参照してください)
よくあるご質問
CSR(クライアント側描画)だと、必ずインデックスされないのですか?
必ずインデックスされないわけではありません。検索クローラーはレンダリングする場合があり、レンダリング後に本文を取得できることもあります。ただし遅延や制限があり、確実ではありません。初期HTMLに本文が含まれていれば、より届きやすくなります。
AI向けのクローラーはJavaScriptを実行しますか?
JSを実行するものと、実行しないものがあり、各社・時期によって異なります。実行しないクローラーでは、初期HTMLに本文が無いと読まれないことがあります。最新の挙動は各サービスの公式情報で確認してください。
アコーディオンで隠した本文は読まれますか?
HTML上に本文が存在し、CSSで開閉しているだけであれば、取得される場合があります。一方、クリック操作をきっかけにJSでDOMへ挿入する本文は、取得が不安定になることがあります。重要な本文はHTML上に存在させる構成が無難です。
本文が届いていない場合、SSG化すべきですか?
SSR/SSGは初期HTMLに本文を含めやすい方式で、有力な選択肢です。ただし全ページを一律に変える必要はなく、ページ単位でレンダリング方式を確認し、本文が届いていないページを優先して見直すと現実的です。変更後はcurlとURL検査で再検証します。
Netsujo SIGNALはこの領域で何をしますか?
公開情報の確認をもとに、本文が初期HTMLに含まれているかを診断し、HTML化・構造化データ・計測までを実装できる成果物として整理します。本番実装は社内・既存の制作会社・提携エンジニアから選べます。検索順位やAIの掲載を保証するものではありません。
この記事の著者
この記事が向いている方
SPAやJSサイトが検索・AIに出ているか不安なBtoB企業の担当者
本文がクローラーに届いているかを自分で確認したい方
CSRからSSR/SSG化を検討している開発・Web担当者
構造化データや本文のHTML化を含めて改善したい方
— 壁打ち相談
読者のよくある相談
記事を読んだ後に「自分の状況だとどう判断すべきか」を整理するための壁打ち相談を受け付けています。下記のような相談例が当てはまる方は、お気軽にご連絡ください。
Q. 自社サイトの本文はクローラーに届いていますか?
curlで初期HTMLを見る手順と、URL検査でのレンダリング後確認を一緒に進めます。
Q. CSRのままだと検索やAIに載りませんか?
レンダリング可否と、初期HTMLに本文を含める対策の考え方を整理します。
Q. 本文のHTML化や構造化データも含めて相談したいです。
無料Web診断から、HTML化・構造化データ・計測までの着手順を壁打ちできます。
上記いずれかが該当する場合、初回30分の壁打ち相談で論点整理に対応します。記事に書ききれない個別事情を踏まえた判断材料が必要な段階こそ、壁打ちが活きやすいフェーズです。
関連するサービス
SEO/AIO支援|Netsujo SIGNAL
本文のHTML化・構造化データ・計測まで一貫して整える
公開情報からの無料Web診断で、本文がクローラーに届いているかを確認し、HTML化・構造化データ・計測の実装まで伴走します。検索順位やAIの掲載を保証するものではありません。
