[2026年5月第3週] Web業界ウィークリー：Google I/O直前、LighthouseにAIエージェント向けSEOが始動

2026年5月17日

当ページのリンクには広告が含まれています。

今週（5/11〜5/17）はGoogle I/O 2026（5/19〜20）の前哨戦となる「Android Show」が開催され、ChromeへのGemini統合や新デバイスが発表されました。LighthouseにはAIエージェントがサイトを使えるかを計測する新カテゴリが追加され、「AIに読まれるSEO」という概念が現実のものになってきています。

Lighthouse 13.3「Agentic Browsing」— AIエージェント向けSEOが始まった

Googleが開発するパフォーマンス計測ツールLighthouse（v13.3）に、「Agentic Browsing」という新カテゴリが追加されました。これはAIエージェント（Gemini in Chromeなど）がサイトを操作できるかどうかを評価する初めての公式指標です。

出典: DebugBear — Lighthouse Agentic Browsing / Chrome for Developers

評価されるのは主に4項目です。

アクセシビリティツリーの品質: aria-label・role属性が正しく設定されているか。AIが要素を識別するために必須
CLS（レイアウトシフト）: 描画後に要素が動くとAIがクリック位置を誤認するリスクがある
WebMCP実装: MCP（Model Context Protocol）がサイトに正しく設定されているか。AIエージェントがサイトの機能やデータにアクセスするための接続仕様
llms.txt対応: ドメインルートに機械可読なサマリーが存在するか

なお、他のLighthouseカテゴリとは異なり、Agentic Browsingは0〜100のスコアではなく、「AIエージェント適合性のチェックリスト」として機能します。現時点では「開発中」フラグが付いており、Chrome 150のDevToolsと2週間以内のPageSpeed Insightsに順次反映予定です。

アクセシビリティ対応とパフォーマンス改善が「人間のためだけでなくAIのためにもなる」という二重の価値を持つ時代になってきました。特にaria属性やrole属性は「きちんとやっている現場」と「なんとなく省略している現場」で大きな差がついてくる可能性があります。

💡 今すぐ試せる: Chrome DevToolsのLighthouseでサイトを計測し、「Agentic Browsing」カテゴリが表示されているか確認する（Chrome 150+ が必要）

Google Android Show: I/O Edition（5/12）— ChromeにGemini、Googlebook発表

Google I/O 2026（5/19〜20）の前哨戦として5月12日に開催された「Android Show: I/O Edition」で、Web制作者にも関係する複数の発表がありました。

出典: TechCrunch / Google Blog

Web制作者として注目しておきたい発表は3点です。

Gemini in Chrome: Gemini 3.1ベースのツールがAndroid上のChromeに統合され、ウェブコンテンツの調査・要約・比較を横断的に支援します。ユーザーが検索せずにGeminiに「このサイトの内容を整理して」と頼む場面が増えると、サイトのコンテンツ構造・意味的なマークアップがより重要になってきます。

Android 17の新機能: Noto 3D（3D絵文字）・プライバシー強化・精度設定の細分化など。WebサイトのUI/UXデザインに使用する絵文字がAndroid端末でどう見えるかが変わる可能性があります。

Googlebook: Google初のプレミアムAI PCライン。ChromeブラウザとGeminiの統合が加速する流れを端的に示しています。

「Gemini in Chrome」が広まると、ユーザーは検索結果に行く前にブラウザ内でコンテンツを消費するようになります。ページの直帰率やセッション数の意味が変わってくる予感があります。

💡 今すぐ試せる: Googleの開発者ドキュメントで「Gemini in Chrome API」の提供予定を確認し、自社サイトのコンテンツ構造を見直すきっかけにする

WordPress 7.0 RC4 公開（5/14）— 来週5/20リリース確定

5月14日にWordPress 7.0のRC4が公開されました。これが最後のRC候補で、5月20日の正式リリースが確定です。

出典: WordPress.org News — RC4

先週のRC3でリアルタイム共同編集（RTC）が削除されて以来、RC4はRTCなしの安定版として仕上げられています。今回の7.0に含まれる機能は新ブロック（パンくず・アイコン）、グリッドのレスポンシブ化、Web Client AI APIなど。RTCは7.1サイクルで再検討予定です。

RC4のリリースノートでは「ハード文字列フリーズ」が設定されており、翻訳ファイルの最終確定が行われています。日本語版も含め翻訳チームの作業が完了する見込みです。

今週末から来週頭にかけてがステージング環境でのテスト最終タイミングです。特にキャッシュプラグイン・セキュリティプラグイン・カスタムブロックを使っている案件は、RC4でもう一度確認しておきたいところです。

💡 今すぐ試せる: WP Staging等でRC4の動作確認を実施し、使用中のプラグインの7.0対応状況をページごとに最終チェックする

CSS `@scope` — 全主要ブラウザ対応完了、BEM不要の時代へ

CSSのコンポーネントスコープ機能「@scope」が、Firefox 146でのサポートによりChrome・Safari・Firefoxすべてで使用可能になりました。

出典: web.dev — New to the web platform / LogRocket CSS in 2026

@scope を使うと、特定のコンポーネント内にだけCSSを閉じ込めることができます。これまでBEM（.card__title）やCSS Modulesでやっていたセレクタのスコープ管理が、ネイティブCSSだけで実現できます。

@scope (.card) {
  :scope { background: #1e293b; border-radius: 12px; }
  h3     { color: #e2e8f0; }   /* .card 内のh3のみに適用 */
  a      { color: #6366f1; }   /* .card 内のaのみに適用 */
}

@scope (.alert) {
  a { color: #f97316; }        /* .alert 内のaのみ — 干渉ゼロ */
}

See the Pen Untitled by BaseKENT (@basekent) on CodePen.

:scope 疑似クラスでルート要素自身にスタイルを当てられ、外側の @scope (.コンポーネント) ブロックが「スコープの境界」を定義します。BEMが「命名規則でスコープを擬似的に実現していた」のに対し、@scope はブラウザが構造的にスコープを保証します。

「BEM記法を廃止してもコンポーネント干渉が起きない」というのは、CSS設計の根本的な変化です。新規プロジェクトではBEMより @scope を選ぶ理由が十分あります。既存プロジェクトへの段階的な移行も現実的になってきました。

💡 今すぐ試せる: 現在BEMで書いているコンポーネントの1つを @scope で書き直してみて、セレクタの量がどれだけ減るか確認する

Google Stitch「DESIGN.md」オープンソース化 — AIエージェントにブランドを教える新フォーマット

GoogleのAIデザインツール「Stitch」が採用している DESIGN.md フォーマットが、Apache 2.0ライセンスでオープンソース化されました（4/21公開）。今週に入り主要なOSSプロジェクトへの採用・GitHub上のスター数急増が相次いでおり、業界標準として定着しつつある兆しが出ています。

出典: Google Stitch Blog — DESIGN.md / Creative AI News

DESIGN.md は、Claude Code・Cursor・GitHub Copilotなどのコーディングエージェントに「このプロジェクトのブランドルール」を機械可読な形で伝えるためのMarkdownファイルです。YAML frontmatterにデザイントークン（カラー・フォント・スペーシング等）を記述し、Markdown本文で設計の意図や使い分けのルールを説明します。

---
colors:
  primary: "#2563EB"
  background: "#0f172a"
typography:
  heading: "Inter, sans-serif"
---
# DESIGN.md — Brand Guide
## Color Usage
Use `primary` only for CTAs. Never use on body text.

これをプロジェクトルートに置くだけで、コーディングエージェントがブランドに沿ったコンポーネントを生成してくれます。llms.txt がサイト全体の要約を提供するのに対し、DESIGN.md はデザインシステムに特化した仕様書として機能します。

AIエージェントに「好き勝手にスタイルを作らせない」ための仕組みが標準化されてきた、という意味でこれは大きな前進です。特にデザインシステムを持つプロジェクトでは、今年中に導入を検討する価値があります。

💡 今すぐ試せる: Stitch（stitch.withgoogle.com）でプロジェクトの DESIGN.md を生成し、Claude CodeやCursorのプロジェクトルートに配置して動作を確認する

今週のひとこと

今週を押さえるなら「Lighthouse Agentic Browsing」が最重要です。SEOの評価軸が「人間のための読みやすさ」から「AIエージェントのための構造的な明確さ」へと静かに拡張されています。aria属性やllms.txtの整備が、来年の検索表示に差をつける可能性があります。来週はいよいよGoogle I/O本番（5/19〜20）とWordPress 7.0正式リリース（5/20）が重なります。