この瞬間、AIエージェントがあなたのウェブサイトを使うとき、実際に何が起きているか知っていますか?
スクリーンショットを撮り、ピクセルを分析し、「ボタンはこのあたりにあるはず」と推測します。レイアウトが少し変わっただけで失敗するんです。業界ではこれを「ビジョンベース自動化」と呼びますが、正直に言えば、AIが目を閉じたままサイトを手探りしているようなものです。
Googleがこの構造をGoogle I/O 2026で根本から覆しました。Chromeがエージェント時代のウェブを宣言し、3つの発表がAIエージェントとウェブの関係を書き換えたんです。
今のAIエージェントはどうやってサイトを使っているの?
多くのAIエージェントがウェブ自動化をするとき、こんな方法を使っています。DOM全体をダウンロードしてパースするか、スクリーンショットから座標を推測するか。「予約ボタンは右下の青いボタンのはず」という推測を繰り返しながらトークンを消費するんです。
問題は、この方式が非決定論的であることです。サイトのデザインが少し変われば失敗し、エージェントごとに同じタスクを異なる方法で処理します。そして目的を推測するだけでトークンのほとんどが消費されてしまいます。
Chromeが覆したもの — 「推測」から「宣言」へ
WebMCP(Web Model Context Protocol)は、GoogleとMicrosoftが共同提案したオープンウェブ標準です。核心的なアイデアはシンプルです。エージェントにボタンの目的を推測させるのではなく、ウェブサイトが先に宣言すればいいじゃないですか。
航空券予約サイトを例に取ると、これまではエージェントがページを分析しながら「出発地入力欄はここだろう、日付選択は向こうだろう」を繰り返していました。WebMCPではサイトがこう宣言します:
WebMCP方式:エージェントが関数を直接呼び出す
book_flight({ origin: "ICN", destination: "JFK", date: "2026-08-01" }) — サイトがこの関数を宣言すれば、エージェントは画面を見ずに直接呼び出せます。
2025年9月にW3C Web機械学習コミュニティグループの公式標準として採択され、Chrome 146 Canary(2026年2月)で最初のブラウザ実装が登場しました。Chrome 149 Origin Trialで誰でも実際のサイトでテストできるようになりました。
Expedia、Booking.com、Shopify、TurboTax、Targetなどがすでに実験中です。エージェントのタスク完了速度がビジョン基準の8〜12倍に向上し、トークン使用量は約90%削減されたという報告が出ています。
実装方法は2つあります:
| Declarative API | Imperative API | |
|---|---|---|
| 方法 | HTMLフォームにdata-mcp-tool属性を追加 | JSでdocument.modelContext.registerTool()登録 |
| 適したケース | 既存フォームを素早くエージェント対応する場合 | カスタムロジックや複雑な入出力が必要な場合 |
| 柔軟性 | 基本レベル | JSON Schemaで入出力を完全制御 |
注意:Chrome 150からAPIの名前が変わりました
navigator.modelContextはdeprecated。document.modelContextを使ってください。
一緒に来た2つのもの — DevToolsとコーディングガイド
Google I/O 2026でWebMCPだけが発表されたわけではありません。AIエージェント時代のための開発ツールがあと2つ登場しました。
Chrome DevTools for Agents 1.0が正式リリースされました。AIコーディングエージェントが実際のブラウザでコードを実行しながら、コンソールログ、ネットワークトラフィック、アクセシビリティツリーに直接アクセスできます。LY Corporationはこれを使って手動パフォーマンス分析業務の96〜98%を自動化したと発表しました。Claude Codeマーケットプレイス、Gemini CLI、Antigravity 2.0から今すぐ使えます。
Modern Web Guidanceは、AIコーディングエージェントが最新のウェブ標準に従ってコードを書けるよう導くブループリントです。npx modern-web-guidance installの一行インストールで、100以上の検証済みパターンをAIが参照できます。Baselineと統合されているためアクセシビリティ、パフォーマンス、セキュリティが自動的に考慮されます。
エージェントがウェブ自動化の方法を変えたのではなく、ウェブがエージェントのために自らを宣言する方向へパラダイムが根本から変わったんです。
今すぐ始める方法
- Chrome 149 Origin Trialに登録する
Chrome 149以上でChrome Origin Trial登録ページにドメインを登録します。ローカルテストはchrome://flags/#enable-webmcp-testingフラグを有効にするだけです。 - Declarative APIで既存フォームをマークする
既存のHTMLフォームにdata-mcp-tool="予約"のような属性を追加するだけで、エージェントがツールとして認識します。コード変更最小で最速スタートできる方法です。 - Imperative APIでカスタムツールを登録する
document.modelContext.registerTool()で名前、説明(500文字以内)、JSON Schema入出力、実行コールバックを登録します。エージェントがこれを読んで正確に呼び出します。 - セキュリティ設定を忘れずに
金融・破壊的アクションにはrequiresUserApproval: trueが必須。外部データにはuntrustedContentHint、読み取り専用操作にはreadOnlyHintを付けます。Cross-origin iframeはallow="tools"でのみ許可。 - Chrome DevTools for Agentsで検証する
Claude CodeマーケットプレイスでChrome DevToolsプラグインをインストールすると、エージェントが自分のツールをどう呼び出しているかリアルタイムでデバッグできます。




