AIに伝わるサイト構造の作り方|内部リンク設計

AIに伝わるサイト構造の作り方|内部リンク設計の解説イメージ

「記事の中身は良いはずなのに、ChatGPTやGoogleのAI Overviewにまったく引用されない」——こう感じている中小企業・個人事業主の方は少なくありません。
原因はコンテンツの質ではなく、サイトの「構造」がAIに正しく伝わっていないことにあるケースが多くあります。

AI検索(LLMやAI Overview)は、人間のように画面を眺めて理解しているわけではありません。
サーバーが最初に返すHTMLを読み、見出しの階層やリンクのつながりから「このページは何で、サイトのどこに位置するのか」を推測しています。
つまり、見た目が整っていても、構造のマークアップが曖昧だったりJavaScriptで後から描画していたりすると、AIには中身が空っぽに見えてしまうことがあります。

この記事では、AIに伝わるサイト構造の作り方を、セマンティックHTML・パンくず・内部リンク設計という3つの軸で具体的に解説します。
一次情報(Google公式・各AI公式)にもとづき、2026年6月時点で確認できる事実だけをまとめました。

この記事でわかること
  • 主要なAI検索のクローラーはJavaScriptを実行せず、サーバーが返す生HTMLを読むため、構造はHTML側に持たせる
  • 見出しタグ(h1〜h3)の階層とセマンティックHTMLが、AIにページの論理構造を伝える土台になる
  • パンくずリストとBreadcrumbList構造化データは、ページのサイト内位置をAIに明示する手段になる
  • 内部リンクは「内容を表すアンカーテキスト」で関連ページをつなぐと、AIに文脈が伝わりやすくなる

本記事の執筆者
ホームページ制作担当の執筆者・高橋丈太郎|中小企業のホームページ制作とWeb集客を支援する代表取締役

執筆者|高橋 丈太郎

株式会社SORAQ|代表取締役

株式会社SORAQ代表取締役。「成果につながるホームページ制作」をテーマに、中小企業のホームページ制作とWeb集客を数多く支援してきました。

「ホームページ制作担当」では、制作現場で培った経験をもとに、中小企業の経営者・ご担当者がそのまま実践できるホームページ制作とWeb集客のノウハウを、わかりやすく執筆しています。
(詳しくは代表挨拶をご覧ください)

目次

なぜAIに「サイト構造」を伝える必要があるのか?

AI検索のクローラーは人間と違い、HTMLの構造から意味やページ同士の関係を推測しているため、構造が曖昧だと内容を正しく理解しにくくなるからです。

従来のSEOでも構造は重要でしたが、AI検索の時代になってその重要性はさらに増しました。
理由は、AIがページを「文章のかたまり」ではなく「構造化された情報」として処理しているためです。

人間はデザインや色、配置を見て直感的に「ここが本文、ここがメニュー」と判断できます。
しかしAIクローラーはそうした視覚情報を持ちません。
代わりに、HTMLのタグ(見出し、リスト、表、リンクなど)を手がかりに「どこが重要か」「何と何が関連しているか」を組み立てています。

ここで決定的に効いてくるのが、後述するJavaScript依存の問題です。
2026年6月時点で、主要なAI検索のクローラーはJavaScriptを実行しません。
そのため、構造の情報は「最初に返るHTML」に書かれている必要があります。
見た目が立派でも、構造がHTMLに表現されていなければAIには伝わりにくい——これがAI時代のサイト構造の出発点です。

AI検索全体の考え方は、総論記事のAI検索(LLMO/GEO/AIO)対策とはで整理しています。
本記事はその「構造の伝達性」に絞った各論版です。

AIに伝わるサイト構造の作り方|内部リンク設計のイメージ写真

AIクローラーはJavaScriptを読めるのか?

2026年6月時点で、主要なAI検索のクローラーはJavaScriptを実行せず、サーバーが返す生のHTMLだけを読み取ります。

ここが最も誤解されやすいポイントです。
Googleの通常検索(Googlebot)と、AI検索のクローラーでは、JavaScriptの扱いが根本的に異なります。

GooglebotとAIクローラーの違い

Googlebotは、ページを「クロール → レンダリング → インデックス」の3段階で処理します。
レンダリング段階ではヘッドレスChromiumがJavaScriptを実行するため、JSで後から描画したコンテンツも最終的には読めます。
ただしGoogle公式も、すべてのボットがJavaScriptを実行できるわけではないため、サーバーサイドレンダリングや事前レンダリングは依然として有効だと案内しています。

一方、AI検索のクローラーは挙動が異なります。

クローラーJavaScript実行読み取る対象
Googlebot(通常検索)する(ヘッドレスChromium)レンダリング後のHTML
GPTBot / OAI-SearchBot(OpenAI系)しない最初に返る生HTML
ClaudeBot / Claude-User / Claude-SearchBot(Anthropic系:学習・ユーザー取得・検索インデックス)しない最初に返る生HTML
PerplexityBot(Perplexity)しない最初に返る生HTML

出典:Google Search Central「JavaScript SEO の基本」、各AI公式のクローラー仕様(2026年6月時点)

Anthropicの公式ドキュメント(2026年6月時点)でも、Claudeのウェブ取得ツールは「JavaScriptで動的にレンダリングされるウェブサイトに現在対応していない」と説明されています。
つまりClaudeはサーバーが返した初期HTMLしか取得しません。

JavaScript依存を避ける実務ポイント

注意
  • 本文・見出し・価格・FAQの回答が、JavaScript実行後にしか表示されないサイトは、AIから見ると中身が空に近い状態になる
  • 構造化データ(JSON-LD)やメタ情報をJSで後から差し込んでいると、AIクローラーには届かないことがある
  • ブラウザで「ページのソースを表示」したとき、本文テキストがそこに含まれているかが簡易チェックの目安になる

対策はシンプルです。
重要なコンテンツと構造は、サーバーサイドレンダリング(SSR)または事前レンダリングで、最初のHTMLに含めておくこと。
WordPressのような従来型CMSは基本的にサーバー側でHTMLを生成するため、この点で有利です。
SPA(シングルページアプリ)構成のサイトほど注意が必要になります。

担当・髙橋

担当・髙橋です。
「おしゃれなサイトにしたのに検索に弱い」というご相談の多くは、装飾過多のJS依存が原因です。
中小企業のサイトなら、まずは生HTMLに本文が出ているかを確認するだけで、改善の入口が見えてきます。

セマンティックHTMLとは何で、なぜAIに効くのか?

セマンティックHTMLとは「タグそのものが意味を持つHTMLの書き方」で、AIにページの論理構造を正確に伝えるための土台になります。

セマンティック(意味的な)HTMLとは、見た目ではなく役割でタグを選ぶ考え方です。
たとえば、ただ文字を大きくするのではなく「これは見出しである」と示す見出しタグを使う、「これはナビゲーションである」と示す領域タグを使う、といった具合です。

AIクローラーはこのタグの意味を手がかりに、ページの骨格を理解します。
役割が明示されていれば、本文・補足・ナビゲーションを正しく区別でき、引用すべき中心的な内容を抽出しやすくなります。

見出しタグの階層を正しく使う

最も基本かつ効果が大きいのが、見出し(h1〜h3)の階層です。

  1. h1はページに1つだけ。ページ全体のテーマ(多くの場合タイトル)を表す
  2. h2は大きな章立て。読者の疑問や検索クエリに対応させると、AIが「問いと答え」の対応を取りやすい
  3. h3はh2の下位の細目。h2を飛ばしてh3を使わない(階層を飛ばさない)
  4. 見出しを「文字を大きくする装飾」として使わない。意味の単位で使う

この階層がきれいに整っていると、AIは「この問いに対する答えはこの段落」という対応関係を把握しやすくなります。
AI Overviewやチャット型AIが回答を生成する際、抽出元として選ばれやすくなる土台がここにあります。

リスト・表・段落で要素を分解する

AI検索は、情報が構造化されているコンテンツを抽出しやすい傾向があります。

  • 手順や順序があるもの → 番号リスト
  • 並列の要素・特徴の列挙 → 箇条書き
  • 比較・条件分岐 → 表
  • 結論や定義 → 短い段落で言い切る

長文をだらだら書くより、要素を分解してリストや表で示したほうが、AIは「ここに答えがある」と認識しやすくなります。
HTMLの基本的な考え方はSEOの基礎と共通する部分が多いので、土台から押さえたい方はホームページのSEO対策の基礎知識もあわせてご覧ください。

ポイント

セマンティックHTMLは特別な技術ではありません。
「見た目のためにタグを選ぶ」のをやめ、「中身の役割でタグを選ぶ」だけで、AIへの伝達性は大きく変わります。

無料相談受付中

その問い合わせ、もっと増やせます。

こんなお悩み、ありませんか?

  • 問い合わせや集客につながらなくて…
  • 何から手をつければいいか分からない…
  • 費用相場や自社に合うプランが知りたい…

「作って終わり」にしない。ホームページ制作担当が企画から運用までまるごとサポートします。

ご相談・お見積りは何度でも無料/無理な営業は一切しません

フォームは1分で送信完了。最短当日にご返信します。

パンくずリストはAIにどう効くのか?

パンくずリストとBreadcrumbList構造化データは、ページがサイト内のどこに位置するのかをAIに明示し、コンテンツの文脈理解を助けます。

パンくずリストとは「ホーム > コラム > マーケティング > この記事」のように、ページの階層上の位置を示すナビゲーションです。
人間にとっては迷子防止の道しるべですが、AIにとっては「このページはサイトのどの分類に属するか」を読み取る手がかりになります。

BreadcrumbList構造化データの基本

パンくずは、見た目のリンクだけでなく、構造化データ(JSON-LD形式のBreadcrumbList)でも記述しておくのが効果的です。
Google公式のガイドラインでは、次の点が示されています。

要件内容
最低要素数ListItem(階層項目)を2つ以上含める
各項目の必須プロパティposition(順番)・name(名称)。item(URL)は各項目に推奨だが、最後(現在ページ)の項目では省略可(省略時はそのページのURLが使われる)
設計の考え方URL構造の模倣ではなく、ユーザーの典型的な遷移経路を表す
最上位・現在ページ最上位パスや現在ページの項目は含めなくてもよい

出典:Google Search Central「パンくずリスト(BreadcrumbList)構造化データ」(2026年6月時点)

ポイントは、パンくずはURLの形ではなく「人がたどる道筋」を表すという設計思想です。
AIはこの階層情報から「この記事はマーケティングカテゴリの中の1本」といった関係を把握し、関連トピックの中での位置づけを理解します。

パンくず設計でやってはいけないこと

  • 全ページで同じパンくず(位置を表していない)
  • 構造化データだけ書いて、画面上にパンくずを表示していない(表示と一致させる)
  • 階層が深すぎてユーザーにもAIにも分かりにくい構造

パンくずは「人にもAIにも一貫した階層情報を渡す」ことが目的です。
表示と構造化データを一致させ、シンプルな階層を保つことが基本になります。

内部リンクはAIへの文脈伝達にどう使うべきか?

内部リンクは「内容を表すアンカーテキスト」で関連ページをつなぐことで、AIにページ同士の関係性とサイト全体のテーマを伝えます。

AIは、リンクのつながり方からサイトの「知識の地図」を読み取ります。
どのページがどのページを補足しているか、何が中心テーマか——これを判断する材料が内部リンクです。

効くアンカーテキストと効かないアンカーテキスト

最も大事なのはアンカーテキスト(リンクの文字)です。

アンカーテキスト評価理由
「AI検索(LLMO/GEO/AIO)対策とは」良いリンク先の内容が一目で分かる
「ホームページのSEO対策の基礎知識」良いキーワードと内容が一致している
「こちら」「詳しくはこちら」弱いリンク先が何かAIに伝わらない
「→」やボタン画像のみ弱いテキスト情報がなく文脈が渡らない

「こちら」のような曖昧なアンカーは、人間にはクリックできても、AIには「何へのリンクか」が伝わりません。
リンク先の内容をそのまま表す言葉をアンカーにするのが基本です。

トピッククラスタで関係性を示す

内部リンクは、関連するページ群を相互につなぐ「トピッククラスタ」の発想で設計すると効果的です。

  1. 中心となる総論記事(柱)を決める
  2. 各論記事(枝)から総論へリンクする
  3. 総論からも主要な各論へリンクし返す
  4. 関連する各論同士も、文脈が合えばつなぐ

この構造があると、AIは「このサイトはこのテーマに体系的に詳しい」と判断しやすくなります。
1記事だけで勝負するより、テーマのまとまりで評価される設計が、AI検索では有利に働きやすくなります。

弊社が制作・支援したコラム運用サイトでは、関連記事へ内容を表すアンカーで内部リンクを張った記事ほど、サイト内回遊とインデックスの早さに好影響が見られました(当社調べ/2026年時点)。
具体的な制作事例は制作実績で公開しています。

予算・リスクに合わせた依頼先の選び方

ここまでの構造設計は、自社で取り組める部分も多くありますが、「セマンティックHTMLの実装」「JS依存の見直し」「構造化データの記述」までを自力で行うのは負担が大きい場合もあります。
外部に依頼する場合は、予算とリスク許容度に応じて選ぶのが現実的です。

どのプランが合うか分からない場合も、まずは現状のサイト構造の課題からご相談いただけます。
無料のお問い合わせで、構造の伝達性チェックの観点をお伝えします。

まとめ:AIに伝わるサイト構造の要点

  • 主要なAI検索のクローラーはJavaScriptを実行せず生HTMLを読むため、本文・構造・価格・FAQは最初のHTMLに含める
  • セマンティックHTMLと見出し(h1〜h3)の正しい階層が、AIにページの論理構造を伝える土台になる
  • パンくずリストとBreadcrumbList構造化データで、ページのサイト内位置をAIに明示する
  • 内部リンクは「内容を表すアンカーテキスト」で関連ページをつなぎ、トピッククラスタで体系性を示す
  • 「こちら」など曖昧なアンカーや、表示と一致しない構造化データは避ける

AIに伝わるサイト構造に関するよくある質問

AIクローラーはJavaScriptを読めますか?

2026年6月時点で、GPTBotやClaudeBot、PerplexityBotなど主要なAI検索のクローラーはJavaScriptを実行せず、サーバーが返す生HTMLだけを読みます。
重要な情報は最初のHTMLに含めておくのが安全です。

WordPressならAIに伝わる構造になっていますか?

WordPressはサーバー側でHTMLを生成するため有利です。
ただし見出し階層の整理やパンくず、内部リンクの設計は別途必要で、構造化データの確認も推奨します。

パンくずリストは必ず設置すべきですか?

サイト階層がある場合は推奨です。
ページのサイト内位置をAIに明示でき、BreadcrumbList構造化データを併用すると階層情報がより正確に伝わります。

内部リンクのアンカーは「こちら」でも問題ありませんか?

避けるのが無難です。
「こちら」ではリンク先の内容がAIに伝わりません。
リンク先の内容を表すキーワードをアンカーにすると文脈が正しく渡ります。

無料相談受付中

その問い合わせ、もっと増やせます。

こんなお悩み、ありませんか?

  • 問い合わせや集客につながらなくて…
  • 何から手をつければいいか分からない…
  • 費用相場や自社に合うプランが知りたい…

「作って終わり」にしない。ホームページ制作担当が企画から運用までまるごとサポートします。

ご相談・お見積りは何度でも無料/無理な営業は一切しません

フォームは1分で送信完了。最短当日にご返信します。

本記事の監修者
ホームページ制作担当の監修者・川人大展|ホームページ制作とSEO対策・Web集客の専門家

監修者|川人 大展

株式会社SORAQ|Webディレクター・SEOコンサルタント

ホームページ制作会社のWebディレクター・SEOコンサルタントとして、
中小企業のホームページ制作とSEO対策・Web集客の支援に従事。

「ホームページ制作担当」では、ホームページ制作やSEO対策、Web集客に関する記事を専門的な観点から監修し、最新の検索エンジン動向とWebマーケティングの実務を踏まえた、正確で信頼できる情報発信を支えています。

こんな記事も読まれています。

シェアしていただけると励みになります
目次