■ 1. 概要
- GoogleはGoogle I/O 2026に合わせ、モダンなWeb開発を支援するエージェントスキル「Modern Web Guidance」を早期プレビューとして公開
- アクセシビリティ、パフォーマンス、セキュリティを考慮したWebアプリ実装をコーディングエージェントに支援させることを目的とする
■ 2. コーディングエージェントへのガイダンス提供
- モダンなWeb開発に関するガイダンスをコーディングエージェントに読み込ませるスキルとして提供
- 開発者はターミナルから用途に応じたガイドを検索・取得し、エージェントのコンテキストへ渡すことが可能
- 解決する課題:
- コーディングエージェントはモデルの学習データにレガシーコードが多く含まれるため、JavaScriptを多用する実装や古い回避策を生成しやすい
- モデルがAPIの存在を知っていても、本番向けの具体的な実装パターンが不足しやすい
- 誘導対象の機能: Popover API、CSS Anchor Positioning、
<dialog>要素、パスキー、Content Security Policy、Core Web Vitalsの改善などのモダンなWeb機能- 対象領域: ユーザーインターフェイス、CSSレイアウト、パフォーマンス、フォームとUI、アクセシビリティ、ブラウザ内蔵AIなど
■ 3. Baselineとの連携
- Webプラットフォーム機能の対応状況を示す「Baseline」と連携し、使用する機能とフォールバックをエージェントが判断できるよう支援
- フォールバック方針:
- 追加的な改善と代替実装が必要な処理を区別して扱う
- 50行未満の軽量な個別実装や条件付きポリフィルを優先
- fetchLater()の64KBペイロード上限やmacOS固有のスクロールバー挙動など、実装時の注意点も収録
- 実際のユーザーが使っているブラウザデータからBaselineターゲットを検討できる「Baseline Checker」も関連ツールとして紹介
■ 4. 導入方法
- Google Antigravityへのワンクリックインストールに対応
- npx経由での導入も可能
- 推奨コマンド:
npx modern-web-guidance@latest install- インストール後に導入先のエージェント環境を選択する画面が表示される
- 対応エージェント環境: npx skills、GitHub CLI、Antigravity CLI、Gemini CLI、GitHub Copilot CLI、Claude Codeなど
■ 5. 収録コンテンツと機能
- 数十の新しいWeb機能を扱い、100以上の実装場面に対応
- ガイドの検索・取得:
npx modern-web-guidance@latest searchでユースケースIDを検索npx modern-web-guidance@latest retrieveでガイドMarkdownをターミナルに表示- 検索はオフラインのTensorFlow.jsモデルを使いローカルで動作（ネットワーク呼び出しやAPIキー不要）
- Chrome拡張開発向けのchrome-extensionsスキルパックも提供
npx modern-web-guidance@latest install --chooseでchrome-extensionsも選択可能- 開発・評価用ソースリポジトリ「GoogleChrome/modern-web-guidance-src」も公開
- スキルとして配布されるガイダンスの作成、調整、評価が可能
- Google ChromeチームとMicrosoft Edgeチーム、Web開発コミュニティが支援
■ 6. Chrome DevTools for agentsとの連携
- Chrome DevTools for agentsと組み合わせた使い方が可能
- 役割分担:
- Modern Web Guidance: 実装方針やコードパターンを提供
- Chrome DevTools for agents: コンソールログ、ネットワーク通信、アクセシビリティツリーなど実行中のページ情報を提供
- 両者を組み合わせることで、パフォーマンス監査、アクセシビリティツリーの確認、コンソールログの取得を行い、その結果をもとにモダンなWebコードへ修正する流れを構築可能
■ 7. Google I/O 2026のその他の発表
- WebMCP:
- WebサイトがJavaScript関数やHTMLフォームなどの構造化ツールをブラウザベースのエージェントへ公開するためのオープンWeb標準として提案
- MCPの代替ではなく、Webサイト側からブラウザエージェントに操作手段を渡す仕組み
- Chrome 149でオリジントライアルを開始し、Gemini in ChromeもWebMCP APIに対応予定
- Chrome DevTools更新:
- AIアシスタンスがLighthouseデータにアクセス可能に
- より自由度の高い質問に答えるため、追加の文脈を自動検索する機能を追加
- Webプラットフォーム新API:
- HTML-in-Canvas API、Soft Navigations API、Declarative Partial Updates、Immediate UI modeなどを発表
- AI関連:
- Built-in AIのPrompt API安定版を公開
- 要約などの用途別APIを端末の幅広い層で動かすための小型モデル「Gemma 197M」を紹介
- Gemini in Chrome:
- Android対応
- ブラウザ上の面倒な作業を自動化する「auto browse」
- 閲覧中のページから画像を生成・編集する「Nano Banana」
- よく使うAIプロンプトを保存して再利用する「Skills in Chrome」
- 画面上の要素を選んでGeminiに質問する機能
- 音声入力支援