BEACON レンダーギャップ分析

AIクローラーは JavaScript を実行しません。あなたのサイトは?

GPTBot と PerplexityBot はあなたの生の HTML を読み、JavaScript を完全にスキップします。Beacon は本物のヘッドレスブラウザでページをレンダリングし、AIエンジンが決して見ないコンテンツ — そしてキーワード — を正確に示します。

https://
静的 vs レンダリング後の比較生の HTML と、完全に JavaScript レンダリングされた DOM を並べて表示 — GPTBot が取得するものとブラウザが見せるものの差そのものです。
JS のみに存在するコンテンツの割合1 つの数値:表示テキストのうちどれだけが JavaScript 実行後にのみ存在し、ゆえにレンダリングしない AIクローラーに見えないか。
AIクローラーが見逃すキーワードレンダリングされた DOM には現れるが静的 HTML には存在しない特定の語 — 製品名、価格、FAQ の回答、重要な文言。
レンダーモードの分類Beacon は各ページをサーバーレンダリング、ハイブリッド、クライアントレンダリングと分類するので、どれだけ無防備かが即座に分かります。
本物のヘッドレスレンダー実際のヘッドレスブラウザでページを読み込み、その JavaScript を実行し、結果を差分比較します — ヒューリスティックも、クローラーが何を見るかの当て推量もありません。
修正ガイダンス(SSR/プリレンダー)具体的な次の一手:サーバーサイドレンダリング、静的生成、AIボット向け動的プリレンダリング — あなたのスタックに合わせて。

なぜ AIクローラーは利用者より空のページを読むのか

GPTBot(OpenAI/ChatGPT)、PerplexityBot、ClaudeBot、Amazonbot のような AIクローラーは、あなたの URL をリクエストし、返ってくる生の HTML — 「ソースを表示」で見えるのと同じバイト — を解析します。彼らはブラウザエンジンを起動したり、スクリプトを実行したりしません。だから、ほぼ空のルート div を送り、実際のコンテンツをすべて JavaScript で注入するシングルページアプリは、人間には完全に見え、ボットには空白に見えます。Google でランクし、訪問者には完璧に見えても、買い手が推薦を求める AIエンジンには見えないままでありうるのです。

Beacon は推測せず — レンダリングする

レンダリングしないクローラーと同じように静的 HTML を取得し、同じ URL を本物のヘッドレスブラウザで読み込んでレンダリング後の DOM を捕捉し、両者を差分比較します — JavaScript 実行後にのみ存在するコンテンツの割合、静的版に欠けている正確なキーワード、そしてレンダーモード(サーバーレンダリング、ハイブリッド、クライアントレンダリング)を報告するので、どれだけ無防備かが即座に分かります。

レンダーギャップを埋める方法

修正の原則は常に同じです。重要なコンテンツを、JavaScript が実行される前にサーバーが送る HTML に入れること — サーバーサイドレンダリング、静的生成、ボット向け動的レンダリングによって。最低限、見出し、本文、価格、FAQ の回答が、クライアント JavaScript で取得・注入されるのではなく、静的 HTML に存在することを確認してください。

FAQ

AIクローラーは JavaScript を実行しますか?

ほとんど実行しません。GPTBot(ChatGPT/OpenAI)、PerplexityBot、ClaudeBot、Amazonbot やその他大半の AIクローラーは、生の HTML を取得してそのまま解析します。JavaScript を実行するためにブラウザエンジンを起動しないので、読み込み後に JS で注入されたコンテンツは事実上彼らに見えません。

レンダーギャップとは何ですか?

レンダーギャップとは、静的 HTML(AIクローラーがダウンロードするもの)と JavaScript でレンダリングされた DOM(ブラウザ内の人間が見るもの)の差です。Beacon はそれを、JavaScript 実行後にのみ存在する表示コンテンツの割合と、その語の集合として表します。大きなレンダーギャップは、AIエンジンがほぼ空のページを読んでいることを意味します。

私の React や Next.js のサイトにはレンダーギャップがありますか?

レンダリング方法によります。純粋なクライアントサイドの React アプリ(例:Vite SPA や create-react-app)はほぼ空の HTML シェルを送り、すべてを JS で構築します — これは最大のレンダーギャップです。Next.js、Remix、Astro などのフレームワークはページをサーバーレンダリングまたは静的生成でき、ギャップを埋められます — ただし、実際にそう設定したルートに限ります。Beacon は仮定ではなく実際の出力をチェックします。

レンダーギャップはどう直せばよいですか?

重要なコンテンツを、サーバーが送る HTML に入れます。主な選択肢は、サーバーサイドレンダリング(SSR)、静的サイト生成(SSG/ビルド時のプリレンダリング)、そしてボットにプリレンダリングした HTML スナップショットを提供する動的レンダリングです。最低限、見出し、本文、価格、FAQ の回答が、クライアント JavaScript で取得・注入されるのではなく、静的 HTML に存在することを確認してください。

Google は JavaScript のコンテンツを見ますか?

おおむね見ます — Googlebot は最新のレンダリングエンジンを実行し、2 回目のパスで JavaScript を実行するので、クライアントレンダリングのコンテンツでもランクしえます(ただしレンダリングは遅く、後回しになることがあります)。決定的な違いは AI検索です。GPTBot、PerplexityBot、そして大半の LLM クローラーは JavaScript を一切レンダリングしません。だから Google の JS-SEO チェックに合格しても、ChatGPT や Perplexity には見えないままでありうるのです。

AIクローラーがあなたのサイトで本当に読むものを確認

無料アカウント — レンダーモードの分類、ボットが見逃すキーワード、ギャップの埋め方。

無料で始める 無料チェックを実行