Modern Web Guidance 日本語解説

コーディングエージェントに、Webの専門知識とブラウザ互換データを直接覚えさせる仕組み「Modern Web Guidance」の安定版1.0が出た、という公式発表です。5月のGoogle I/Oで先行公開されたものの正式版になります。

プレイリスト「Modern Web Guidance in your AI workflow」の1本目で、Modern Web Guidanceそのものを短く紹介する動画です。

「知識を与える道具」と「実際のブラウザで確かめる道具」を組み合わせた、エージェントによるWeb開発の流れを紹介する動画です。

「新しいモデルはもうベストプラクティスを知っているのでは」という問いへの答えとして、評価で実際に測れた知識の穴を10分野にまとめた記事です。

「ガイドがあると本当に良くなるのか」を、同じ課題をガイドあり／なしで解かせて実ブラウザで採点し、結果を公開しているページです。

エージェントに書かせる時代に、自分の理解をどう伸ばすか。Modern Web Guidanceを「速く書く道具」ではなく「学ぶ道具」として使う方法をまとめた記事です。

200件超のガイドから、目の前の課題に合う1件を、トークンを無駄にせず、オフラインで、ミリ秒で見つける。その検索の仕組みを3世代の作り替えから解説した技術記事です。

既存コードの中の古い書き方を、決まった手順で見つけ、確かめ、書き換える。1.0で入った「モダナイズ」の流れの公式ドキュメントです。

新しい機能を使うコードを書いても、未対応のブラウザで壊れる。逆に古い書き方に逃げると標準機能の利点が消える。その間を、Baselineの対応データと4つのフォールバックの型で埋める仕組みの解説です。

Modern Web Guidanceの動画をまとめた、Chrome for Developersの公式プレイリストです。個別の動画の解説ページへの入口として使えます。

インドの保険プラットフォームPolicybazaarと、姉妹サービスのPensionbazaarが、「書く→ブラウザで確かめる→直す」の輪をエージェントに回させた事例です。

全プルリクエストをModern Web Guidanceでレビューするボットを、たった3行の指示で運用した事例です。指摘が何を直し、何がノイズだったかまで数字で公開されています。

Tencentの国際向け動画配信WeTVが、リリースの性能チェックの失敗を、CI/CDの中でエージェントに診断と修正まで任せた事例です。

月間9,000万人超が使う日本のnoteが、自社のデザインシステムとModern Web Guidanceの役割分担を、180回の比較評価で決めた事例です。

本体の公開リポジトリです。入れ方、試し方、更新の方法と、ガイドが対象にする250のWeb機能の一覧がここにあります。

検索、自動で伸びる入力欄、ポップオーバー、ダイアログ、検索できるFAQ、行のバランス、テーマ切り替え、場所の予約。8つの作例がその場で動きます。