AIエージェントに読まれやすいWebサイトのポイント5選｜Google公式情報も解説
AIが台頭してきた現在。WebサイトもAIに最適化しないと、AIエージェントに読み取ってもらえず、Webマーケティングで成果を出すのが難しい時代です。
「AIに読み取ってもらいやすいWebサイト設計って、具体的に何をすればいいの？」
「自社のWebサイトのAI対策を強化するためにできることはあるのだろうか」
本記事では、弊社（株式会社GIG）にて複数メディアの編集長を経験してきたMarketing事業部長の内田が、AIエージェントに読み取ってもらいやすいWebサイトのポイントを解説します。
- Googleの公式情報に基づいたAIエージェントの巡回の仕組み
- AIエージェントに読んでもらいやすいWebサイトのポイント5つ
- AI検索との違い
AI対策をはじめとするデジタルコミュニケーションのポイントについては、株式会社GIGのYouTubeでも詳しく解説しています。
内田 一良（うちだ かづよし）早稲田大学および同大学院卒。株式会社GIGにてMarketing事業部長。Workship、LeadGrid、コンマルクなどの自社プロダクトマーケから顧客支援まで行う。複数メディアの編集長を経験し、これまで5,000記事以上の編集・ディレクションに携わる。書籍『デザインの言語化』『フリーランスの進路相談室』『ADHD会社員、フリーランスになる。』『マンガでわかる！フリーランスの生き残り戦略』などの監修・編集も。
Google公式が最新情報を公開
Google社が公式に運営しているブログweb.devにて、「エージェント フレンドリーなウェブサイトを構築する」という記事が公開されています。
Google社員のKasper Kulikowski氏、Omkar More氏によって執筆された本記事では、GoogleがAIエージェントとしてサイトをどう巡回しているのかが解説されています。WebサイトをAIに最適化するためには、ぜひ押さえておきたい内容です。
このブログの内容について内田のXで投稿したところ、大きな反響がありました。本記事でもポイントを解説します。
AIエージェントがWebサイトを巡回する3つの方法
web.devの記事では、GoogleのAIエージェントは以下に紹介する3つの方法でWebサイトを巡回していると明かされています。
Google以外のエージェントでも、概ね同じような仕組みで情報を収集しているものと推測できます。まずは、AIエージェントがWebサイトを巡回・探索する、具体的な3つの方法を紹介しましょう。
1. スクリーンショット
AIエージェントがWebサイトを巡回する手段として、まずスクリーンショットがあります。
最新技術であるAIが画像から情報を読み取っているのは意外ですが、AIエージェントがWebサイトを訪れると、画面のスクリーンショットを撮影して画像から内容を読み取ります。
AIエージェントを使っている人にはイメージしやすいかもしれません。
2. HTMLの解析（DOM解析）
2つ目はHTMLです。AIエージェントは、DOMの解析によってHTMLの内容を読み取ります。
DOMとは、Webページの構造をAIが理解しやすくするよう、ツリー構造として表現する仕組みです。
AIエージェントは、HTMLの階層構造を把握したうえで、Webサイトの要素を認識しています。
3. アクセシビリティツリー
3つ目はアクセシビリティツリーです。
アクセシビリティツリーの解析とは簡単に言えば、メインのコンテンツのみを集約した、シンプルな読み上げ用モードで内容を解析する方法です。
スクリーンリーダーをイメージしてもらうと近いかもしれません。
AIエージェントが読み取りやすいサイト設計のポイント5つ
AIエージェントがWebサイトを分析する方法を踏まえ、AIエージェントが読み取りやすいWebサイトのポイントを考えていきましょう。
具体的なポイントは、以下の5つです。
- CTAボタンの配置を固定化する
- 透明なオーバーレイ要素を削除する
- ボタンサイズを最適化する
- HTMLタグを最適化する
- フォームにラベルを設置する
それぞれについて具体的なポイントを解説します。
1. CTAボタンの配置を固定化する
まず、CTAボタンの位置を固定しましょう。
AIエージェントにWebサイトを読み取ってもらうには、CTAボタンの位置が不規則であると望ましくありません。
たとえば、ホバーして出てくるCTAボタンや、スクロールして出てくるCTAボタン。AIエージェントはスクリーンショットによってWebサイトを読み取っているため、スクリーンショットの段階で見えないCTAボタンは認識されない可能性が高いでしょう。
また、ページごとにCTAボタンの配置にばらつきがあると、AIエージェントが読み取りにくくなります。
CTAボタンは、Webサイトの上部や下部などのファーストビューで見えやすい位置に毎回固定することが有効だと考えられます。
2. 透明なオーバーレイ要素を削除する
人間には見えなくてもAIには認識できるオーバーレイ要素は削除するのが無難です。
モーダルやポップアップなどは、実装の仕方によっては透明な要素がサイト上に残り、AIにとって壁となるケースが考えられます。
人間の目には透明に見えても、AIがその裏の要素を読み取ることを遮ってしまい、本来読み取ってほしい情報が読み取られないリスクがあります。
3. ボタンサイズを最適化する
AIエージェントに読み取ってもらうために、CTA要素は8×8ピクセル以上のサイズで作成しましょう。
8×8ピクセルに満たない小さすぎるパーツは、人間にとっても見にくく、AIエージェントの視覚分析でも無視される可能性があります。WebサイトのスクリーンショットをAIが分析する際に、ボタンなのか判断がつかなくなるためです。
web.devの記事中でも、8×8ピクセル以上という具体的な基準について言及されています。サイズは必ず守りましょう。
ユーザー ジャーニーを続行するために必要なインタラクティブ要素は、視覚分析で除外されないように、表示領域が 8 ピクセル四方より大きくなるようにしてください。
（出典：エージェント フレンドリーなウェブサイトを構築する）
4. HTMLタグを最適化する
続いて、div要素でボタンを作らないことも非常に重要です。
AIエージェントに「ボタンである（押せる要素である）」と正しく認識させるには、<div>ではなく「buttonタグ」や「aタグ」を使うのが望ましいとされます。CSSで見た目だけをボタンらしくしても、AIエージェントからはただの箱としか認識されない可能性があるためです。
どうしても<div>要素を使う必要がある場合は、role="button"やtabindexを付与してください。
意識しないと忘れがちですが、HTML上でも、ボタンがボタンであることを必ず表現しましょう。
5. フォームにラベルを設置する
問い合わせフォームにはラベルを付与するのが、AIエージェントに正しく読み取ってもらうポイントです。
フォームのプレースホルダーだけでは、AIエージェントは内容を理解できません。何を入力するフォームなのかが伝わらないためです。
問い合わせフォームを配置する場合、各入力フィールドに対してlabel for="email"やlabel for="name"のようなラベルを付与し、何を入力させるフォームなのかがAIエージェントにもわかるようにします。
近い将来、AIエージェントがフォームを読み取って問い合わせしてくるケースも増えることが想定されます。つまり、ラベル情報を正しく付与することがCVに寄与する可能性があるのです。
逆に言えば、最近増えているAI営業による悪質な自動送信を防ぐため、あえてAIに読み取られにくいフォーム構造にするのも手段です。事業の状況や方向性に合わせて判断してください。
AI検索とは異なるため注意
本記事では、AIエージェントに最適化するサイト構造について解説しました。あくまでAIエージェント向けであり、AI検索とは別の話であることは認識しておいてください。
ChatGPTなどの生成AIに質問をすると返答がくるAI検索では、検索拡張生成（RAG）という仕組みで検索が行われています。
弊社（GIG）の調査研究によると、AI検索の結果を出力する際にWebサイトのスクリーンショット撮影やHTMLコードの読み込みはあまり行われていないと推測できます。画像の中に入っている情報はあまり読み取られないのがいい例です。
検索拡張生成では、画面解析ではなくサイト上の「テキスト情報」をメインに読み取って回答を生成するため、あくまでWebサイト上にテキストとして必要情報が書かれているかが重要なのです。
このように、AIエージェントによる読み取りとLLMによる検索生成では対策が異なります。念頭に置いておきましょう。
まとめ｜人間にとってわかりやすいことが一番
web.devの記事内で、以下の言及がありました。
サイトを「エージェント対応」にするために提案するすべてのことは、人間にとってもサイトを改善することにつながります。
（出典：エージェント フレンドリーなウェブサイトを構築する）
「人間にとってわかりやすい」ことが、結果的にAIエージェントにとってもわかりやすい。この原則は今後も変わらないでしょう。
人間にとってわかりやすく、アクセシビリティを高めたサイトをつくることが、結果的に価値となり成果を生み出していくのです。
コンテンツマーケティング支援は「コンマルク」にお任せください
AI検索やSEOなど、コンテンツマーケティングに関連するあらゆる領域に、最新の生成AI技術が影響を及ぼしています。
GoogleのAIエージェントをはじめ、プラットフォームや技術の提供元から発信される最新の情報にアンテナを張っておかないと、ゲームルールの変化に置いていかれかねません。Webマーケティングで成果を出し続けるには、常に変化する最新動向にキャッチアップすることが不可欠です。
コンテンツマーケティング総合パートナーの「コンマルク」は、年間4,000件以上の法人リード / 年間10,000件以上の個人リードの安定獲得実績を持つ専門家集団であるGIGのマーケティングチームが、AIO・LLMO対策を含めたコンテンツマーケティングを力強く支援します。外注から伴走、内製化支援まで、ぜひお気軽にご相談ください。
- インタビュー記事制作 / 設計
- SEOコンテンツ制作 / 設計
- ホワイトペーパー制作 / 設計
- 動画制作 / 設計
- アクセス解析基盤設計
- アクセス解析・Webコンサルティング
- Web広告・SNS広告
- コンセプト / ペルソナ / CJM設計
- コンテンツマーケティング伴走支援 など
早稲田大学および同大学院卒。株式会社GIGにてMarketing事業部長。Workship、LeadGrid、コンマルクなどの自社プロダクトマーケから顧客支援まで行う。複数メディアの編集長を経験し、これまで5,000記事以上の編集・ディレクションに携わる。書籍『デザインの言語化』『フリーランスの進路相談室』『ADHD会社員、フリーランスになる。』『マンガでわかる！フリーランスの生き残り戦略』などの監修・編集も。
