J’ai un client qui m’appelle lundi dernier, affolé. Son agent IA lui avait pondu un formulaire de contact avec un div pour chaque champ, un script de validation de 400 lignes et zéro attribut required. Le mec pensait avoir de l’or. Il avait surtout du code de 2012. Voilà pourquoi modern web guidance m’intéresse autant : les agents de code écrivent du JavaScript d’il y a dix ans alors que les navigateurs savent faire le boulot tout seuls depuis belle lurette.
Le principe est simple. Modern Web Guidance, c’est un ensemble de guides que vous glissez dans votre agent de codage (Cursor, Copilot, Claude Code, peu importe) pour qu’il arrête de réinventer la roue et utilise les fonctionnalités natives du navigateur. Installation, scan, télémétrie. Je vous raconte ce que j’en pense après deux semaines de tests en atelier.
Modern Web Guidance : le problème que personne ne veut voir
Vous avez déjà regardé le code généré par un agent IA récemment ? Moi oui, tous les jours. Et le constat est affligeant. On demande un simple carrousel, on récupère une bibliothèque de 80 ko minifiée, un polyfill pour Internet Explorer 11 et une gestion d’événements à l’ancienne. Autant dire que le web moderne, les agents en ont entendu parler mais de loin.
La raison est bête. Les modèles ont été entraînés sur des tonnes de code Stack Overflow des années 2015-2020. À l’époque, on faisait du document.querySelector partout et on chargeait jQuery pour un accordéon. Le résultat : vos agents pondent du code legacy avec une assurance de chirurgien. Sauf que le patient est sous perfusion.
Modern Web Guidance arrive avec une promesse simple : fournir aux agents des guides à jour sur les API natives du navigateur. Dialog natif, popover, validation de formulaires, View Transitions, container queries, :has(). Tout ce que Chrome, Firefox et Safari savent faire depuis deux ans et que vos assistants ignorent royalement.
Ce que ça change concrètement
Sur un projet de refonte pour un artisan, j’ai testé. Avant Modern Web Guidance, l’agent me sortait un modal custom avec 150 lignes de JS pour gérer le focus, l’échappement, l’accessibilité. Après installation des guides, il m’a proposé un simple <dialog> natif avec showModal(). Vingt lignes. Ça marchait. J’ai failli pleurer.
Mine de rien, c’est ça la vraie valeur. Pas de la magie, juste du bon sens qu’on avait oublié de transmettre aux modèles. Vous me direz, on aurait pu y penser avant. Oui. On aurait pu.
Installation : simple, mais lisez la doc
Pour être honnête, l’installation est plutôt bien pensée. Le projet se présente comme une collection de guides au format markdown que vous branchez dans votre agent. Selon l’outil que vous utilisez, ça passe par un fichier de configuration, une commande d’installation ou un import direct dans le contexte.
J’ai testé sur Cursor et sur Claude Code. Sur Cursor, deux commandes et c’était plié. Sur Claude Code, un peu plus de manipulation mais rien d’insurmontable pour un technicien qui a déjà configuré un serveur mail un dimanche soir. Autant dire que la barre est basse.
Le projet propose aussi un scan de votre codebase. L’idée : il analyse votre code existant et vous sort un rapport des endroits où vous pourriez utiliser des API modernes à la place de vos vieilles habitudes. Sur un projet React de 40 000 lignes que je maintiens chez un client, le scan m’a sorti 87 suggestions. J’en ai appliqué 60 sans rien casser. Les 27 autres, c’était du faux positif ou du cas tordu.
- Installation par ligne de commande : rapide, propre
- Scan de codebase : utile, mais à prendre avec des pincettes
- Télémétrie : activée par défaut, à désactiver si vous êtes paranoïaque (comme moi)
- Compatible avec les principaux agents du marché
- Guides en markdown, donc modifiables à la main
La télémétrie, parlons-en
Alors évidemment, la télémétrie est activée par défaut. Évidemment. Parce que sinon, ça ne serait pas drôle. Vous installez un outil pour coder mieux, et vous voilà en train d’envoyer des données d’usage à des gens que vous ne connaissez pas. Je ne suis pas certain à 100% de ce qui remonte exactement, mais d’après ce que j’ai lu dans la doc, ça reste des statistiques d’usage anonymisées. Cela dit, en atelier, on désactive systématiquement. Question de principe.
Un coup de --no-telemetry ou l’équivalent dans la config, et l’affaire est réglée. Dommage qu’il faille y penser, mais bon, c’est le jeu ma pauvre Lucette.
Les limites que personne ne vous dira
Bon, maintenant la partie qui fâche. Parce que Modern Web Guidance, ce n’est pas non plus la baguette magique. J’ai vu passer des articles dithyrambiques cette semaine qui vous vendent l’outil comme la solution à tous les maux du dev web. Foutaises.
Première limite : tous les navigateurs ne suivent pas au même rythme. Safari, par exemple, a sa propre interprétation de ce qu’est « moderne ». J’ai encore eu le cas la semaine dernière avec un client dont le site marchait nickel sur Chrome et affichait une page blanche sur Safari iOS 15. Du coup, les guides Modern Web Guidance ne vous protègent pas des vieux navigateurs. Ils vous aident à écrire du code propre pour les navigateurs récents. Nuance.
Deuxième limite : l’agent reste un agent. Il peut ignorer les guides, ou les appliquer de travers. Sur un projet, il m’a sorti un <dialog> natif avec un aria-modal en trop et un style inline qui cassait tout. Le guide était bon, l’exécution moyenne. C’est comme donner une recette de grand chef à un apprenti : ça aide, mais ça ne fait pas de lui un chef.
Troisième limite, la plus vicieuse : la dépendance. Vous installez Modern Web Guidance, votre agent code mieux. Vous le retirez, il recode comme avant. Logique, me direz-vous. Sauf que certains outils poussent pour que vous gardiez le paquet installé en permanence, avec mises à jour automatiques et tout le tintouin. Autant dire que vous dépendez d’un tiers pour la qualité de votre propre code. J’ai connu des dépendances plus saines.
Mon avis tranché (et je sais que je vais faire grincer des dents)
Je vais être direct : Modern Web Guidance est un bon outil, mais ce n’est pas une révolution. C’est un pansement sur une plaie plus profonde. La vraie question, c’est pourquoi nos agents IA codent comme en 2018. Et la réponse, c’est que les modèles sont entraînés sur des données périmées et que personne ne se presse pour corriger le tir.
Ce projet a le mérite d’exister, de proposer quelque chose de concret et de gratuit. Pour un indépendant comme moi qui passe ses journées à rattraper du code généré à la va-vite, c’est utile. Pas indispensable. Utile.
Ce que je recommande, du coup :
- Installez-le dans un projet perso d’abord, pas chez un client
- Désactivez la télémétrie dès le départ
- Testez le scan sur une petite codebase avant de le lancer sur votre monolithe de 200 000 lignes
- Gardez un œil sur ce que produit votre agent : les guides ne corrigent pas tout
- Documentez pourquoi vous l’installez, sinon dans six mois vous aurez oublié
Et Windows dans tout ça
Ah, j’allais oublier. Petite digression nécessaire. J’ai installé le bazar sur mon poste Windows pour tester. Devinez quoi ? La MAJ cumulative de la semaine dernière a encore pété le terminal. Évidemment. J’ai passé 45 minutes à comprendre pourquoi la commande d’installation restait bloquée sur « fetching metadata ». C’était pas Modern Web Guidance, c’était Windows qui avait décidé de reconfigurer PowerShell dans mon dos. Une fois le terminal réparé, tout a roulé. Mais quand même. Windows, quoi.
Moralité : sur macOS ou Linux, vous n’aurez probablement pas ce souci. Sur Windows, prévoyez une marge. Et un café. Voire deux.
Le vrai sujet : reprendre la main sur le code généré
Au-delà de l’outil lui-même, ce que Modern Web Guidance met en lumière, c’est un problème plus large. On a externalisé notre réflexion de code à des agents qui ne savent pas ce qu’est une API native récente. Résultat : on produit du code qui marche mais qui est techniquement obsolète à la sortie.
Franchement, ça devrait nous interroger. Moi le premier. J’ai passé quinze ans à expliquer à mes clients qu’il fallait écrire du code propre, maintenable, moderne. Et voilà que je laisse un agent me pondre du jQuery déguisé en React sans broncher. La honte.
Modern Web Guidance ne résout pas ce problème de fond. Il le masque un peu. Mais c’est déjà ça. Pour un indépendant qui n’a pas envie de relire chaque ligne générée, c’est un filet de sécurité. Pas parfait, mais présent.
Le projet est open source, les guides sont modifiables, et c’est ce qui me plaît. Vous pouvez adapter le contenu à votre stack, à vos conventions, à votre époque. Histoire de ne pas dépendre entièrement de la bonne volonté de mainteneurs que vous ne connaissez ni d’Ève ni d’Adam.
Testez-le. Sur un projet perso, sans pression. Regardez ce que votre agent produit avec et sans. Vous serez surpris. Moi, j’ai été surpris. Pas dans le bon sens au début, mais surpris quand même.
Pour creuser le sujet et voir la source d’origine, c’est par ici : Modern Web Guidance sur Korben.
Source : article original
