Modern Web Guidance : ton agent code avec le web moderne

Ton agent de code écrit vite, mais il écrit souvent comme il y a dix ans. Il a appris sur des montagnes de vieux code, alors il sort des centaines de lignes de JavaScript pour un menu déroulant que le navigateur sait gérer tout seul. Modern Web Guidance, un projet de l'équipe Chrome de Google, corrige ça : il donne à ton agent une mémoire à jour des bonnes pratiques du web.

Concrètement, c'est un ensemble de « skills », des fiches de savoir-faire que ton agent consulte avant d'écrire du code web. Le projet est soutenu par les équipes de Google Chrome, Microsoft Edge, Mozilla Firefox et MDN, avec la communauté.

Pourquoi c'est utile

• Ton agent arrête de recoder à la main ce que le navigateur fait nativement : fenêtres modales, info-bulles, animations de transition, champs qui s'adaptent à leur contenu.
• Moins de code à écrire, donc moins de code à relire, à maintenir et à corriger plus tard.
• Les pages chargent plus vite, car le navigateur optimise ses propres outils mieux qu'une bibliothèque ajoutée par-dessus.
• L'accessibilité est mieux prise en compte : les composants natifs embarquent déjà la navigation au clavier et la compatibilité avec les lecteurs d'écran.
• L'outil tient compte de la compatibilité entre navigateurs, avec des solutions de secours légères quand un navigateur est trop ancien.

Ce que l'outil contient

Le projet couvre les nouveautés de la plateforme web de ces dernières années, jusqu'aux plus récentes. Le README annonce 250 fonctionnalités web, réparties en 140 sur le CSS et la mise en page, 36 sur le HTML et 74 sur JavaScript et les API du navigateur.

Les guides sont rangés par grands domaines : expérience utilisateur, mise en page, performance, formulaires et composants, accessibilité, et IA intégrée au navigateur (traduction, résumé, détection de langue directement sur l'appareil). Chaque guide donne des modèles de code, les pièges connus et les solutions de repli. Les auteurs affirment avoir retiré ce que les modèles savent déjà, pour ne pas gaspiller la mémoire de travail de ton agent.

Un exemple parlant : tu demandes « fais-moi un menu latéral » et l'agent ne reprend pas un vieux plugin. Il consulte le guide dédié et s'appuie sur les éléments natifs du navigateur.

Comment ça marche

L'installation tient en une commande : npx modern-web-guidance@latest install. Un assistant te pose quelques questions et configure l'outil pour ton agent. Le README liste aussi d'autres méthodes pour Claude Code, GitHub Copilot, OpenAI Codex, Google Antigravity et d'autres.

Ensuite, le fonctionnement se fait en trois temps :

1. Ton agent reconnaît une tâche web et active la skill.
2. Il cherche le guide adapté avec un moteur de recherche local. D'après le README, celui-ci n'a besoin ni de connexion ni de clé d'API.
3. Il récupère le guide et l'ajoute à son contexte avant d'écrire le code.

Tu peux aussi l'essayer sans rien installer. La commande search cherche un guide, retrieve l'affiche, et legacy-scan parcourt un projet pour repérer les vieux réflexes à moderniser. Pour une équipe qui traîne un site ancien, ce scan donne une première liste de chantiers.

Les preuves, avec une réserve

Le projet publie ses propres tests. Des tâches réalistes sont confiées à des agents, avec et sans le guidage, puis corrigées automatiquement dans un navigateur. Les invites ne nomment pas les technologies à utiliser, pour vérifier que l'agent trouve seul le bon guide.

Dans le tableau du README, trois agents sont mesurés le 8 novembre sur environ 215 tâches. Les taux de réussite passent de 57 % à 88 % pour l'agent Claude Code, de 54 % à 82 % pour Codex et de 58 % à 94 % pour Antigravity. Le gain va de 28 à 36 points selon l'agent.

La réserve est simple : ces chiffres viennent des auteurs eux-mêmes, sur leurs propres tâches. Ils indiquent une tendance sérieuse, pas une garantie pour ton projet. Le tableau de bord public des évaluations te permet de regarder le détail par guide.

À savoir avant de te lancer

L'outil est bien présentable en entreprise, mais voici ce qu'il faut regarder avant de le déployer.

Les données d'usage. Google collecte des informations anonymes : nombre d'installations, nom de l'agent, identifiants des guides consultés et requêtes de recherche générées par l'agent. Les messages que tu écris à l'agent ne sont pas collectés, d'après le README. Si ta politique interne l'exige, la variable DISABLE_TELEMETRY=1 coupe cette collecte. Le code de collecte est lisible dans le repo.

Le périmètre. L'outil parle de web : CSS, HTML, JavaScript, navigateur, plus un pack dédié aux extensions Chrome. Si tes projets sont des applications mobiles natives ou du back-end pur, il ne te sera d'aucune aide.

Les fonctions très récentes. Les guides sur des API expérimentales ou réservées à un seul navigateur sont verrouillés par défaut. Tu les débloques avec un fichier de configuration .mwgrc, que tu peux partager dans ton dépôt pour que toute l'équipe ait les mêmes règles.

Le relecteur reste nécessaire. L'outil oriente l'agent, il ne supprime pas les erreurs. Le code produit doit toujours être relu et testé.

Une base récente. Le dépôt a été créé en janvier 2026 et reste très actif, avec de nombreuses demandes ouvertes. Prévois de mettre l'outil à jour régulièrement, ce que la commande update permet.

Ce que ça change pour une équipe ou une PME

Pour une petite équipe web, le gain est surtout dans la durée. Chaque ligne de code évitée est une ligne de moins à maintenir. Un site construit avec des standards du navigateur vieillit mieux qu'un site bâti sur un empilement de bibliothèques.

Il y a aussi un effet de cohérence. Quand plusieurs personnes utilisent un agent de code, chacune obtient des résultats différents. Avec un guidage commun et un fichier de configuration partagé, l'équipe part des mêmes bonnes pratiques.

Enfin, le coût d'entrée est faible : une commande, un code sous licence Apache-2.0, des guides sous licence CC-BY 4.0. Tu peux tester sur un petit projet en une après-midi et juger sur pièces.

Pour qui c'est

• Le dirigeant d'une PME avec un site ou une application web : ton prestataire ou ton équipe produit un code plus léger et plus facile à reprendre.
• L'équipe technique qui utilise déjà un agent de code : tu ajoutes une couche de qualité sans changer tes habitudes.
• Le responsable d'un site ancien : le scan de motifs obsolètes t'aide à préparer une modernisation.
• Le développeur junior : les guides expliquent aussi pourquoi telle approche est préférable.

Bottom line

Modern Web Guidance ne remplace ni ton agent ni ta relecture. Il lui évite de s'appuyer sur de vieilles habitudes, et il le fait avec un outil gratuit, ouvert et soutenu par les acteurs du navigateur. Les résultats chiffrés viennent des auteurs, la collecte de données est à connaître, et le périmètre se limite au web. Si tu fais du web avec un agent, l'essai coûte une commande. Le repo est ici : github.com/GoogleChrome/modern-web-guidance-src, avec le guide d'installation et le tableau de bord des évaluations.