Choisissez parmi les compétences listées dans les conseils pour le Web moderne, en fonction de votre étape actuelle dans le cycle de vie du développement Web, allant du style initial à l'implémentation finale de la sécurité.
Disciplines Web de base
Des orchestrateurs pour vous aider à affiner et à concentrer votre travail par discipline Web.
accessibility
/modern-web-guidance accessibility
Il s'agit de votre guide d'audit central pour évaluer, corriger et implémenter des modèles d'accessibilité efficaces dans l'ensemble de votre application.
Afficher la compétence accessibility sur GitHub
performance
/modern-web-guidance performance
Vous aide à optimiser les Core Web Vitals, à réduire la latence du temps de chargement des pages et à améliorer la réactivité aux entrées utilisateur.
Afficher la compétence performance sur GitHub
user-experience
/modern-web-guidance user-experience
Il sert de boîte à outils d'interface utilisateur pour implémenter rapidement des éléments personnalisés réactifs, des transitions fluides et des modèles de style modernes.
Afficher la compétence user-experience sur GitHub
Technologies Web
Ces compétences de base fournissent des composants de base essentiels pour toute application moderne, en veillant à ce que votre projet commence avec les bonnes pratiques modernes en matière de HTML sémantique, de vitesse et d'interopérabilité.
html
/modern-web-guidance html
Consignes axées sur l'action pour l'architecture HTML moderne, la sémantique, les API interactives natives (Dialog, Popover, Details), la gestion de la mise au point et la priorisation des ressources. Utilisez ce guide pour structurer des documents Web, implémenter des superpositions natives ou optimiser l'ordre de chargement des ressources.
Afficher la compétence html sur GitHub
css
/modern-web-guidance css
Consignes axées sur l'action pour l'architecture, les mises en page et les performances CSS modernes. Utilisez ce guide lorsque vous créez des styles, gérez des systèmes de conception ou optimisez le rendu Web.
Afficher la compétence css sur GitHub
css-layout
/modern-web-guidance css-layout
Mises en page CSS modernes telles que flexbox, grid, subgrid, les requêtes de conteneur, le positionnement d'ancrage et le dimensionnement intrinsèque. Utilisez cette compétence lorsque vous concevez des composants d'UI ou des mises en page responsives.
Afficher la compétence css-layout sur GitHub
forms
/modern-web-guidance forms
Bonnes pratiques pour créer des formulaires Web accessibles, sécurisés et conviviaux. Utilisez ce guide lorsque vous créez ou modifiez des formulaires, des entrées et des flux d'envoi.
Afficher la compétence forms sur GitHub
cpp-on-the-web
/modern-web-guidance cpp-on-the-web
Compiler du code C et C++ pour le Web moderne à l'aide de WebAssembly. Utilisez cette compétence lorsque vous devez porter du code C++, créer des bibliothèques C++ avec Emscripten ou configurer des composants C++ hautes performances dans le navigateur.
Afficher la compétence cpp-on-the-web sur GitHub
Fonctionnalités du navigateur (activation)
Ces compétences vous aident à développer des extensions Chrome qui suivent les normes modernes comme Manifest V3 et à simplifier la publication sur le Chrome Web Store en vous aidant à préparer vos métadonnées, vos règles de confidentialité et vos justifications d'autorisation. Ces compétences sont facultatives et ne sont pas activées par défaut.
chrome-extensions
/modern-web-guidance chrome-extensions
Créez des extensions Chrome sécurisées et conformes à Manifest V3, qui évitent les pièges courants liés au cycle de vie des service workers et au bac à sable. Pour l'activer, vous devez spécifier la skill chrome-extensions :
npx skills add GoogleChrome/modern-web-guidance --skill chrome-extensions
Afficher la compétence chrome-extensions sur GitHub
Sécurité, confiance et identité
Ces compétences sont axées sur la confiance des utilisateurs en sécurisant les applications contre les failles côté client telles que les scripts XSS grâce à des en-têtes HTTP défensifs et à l'isolation de l'origine. Les développeurs peuvent également créer des flux d'authentification avec des clés d'accès, minimiser le suivi par un tiers et utiliser des compétences pour transférer des bibliothèques C/C++ vers des modules WebAssembly.
security
/modern-web-guidance security
Consignes de sécurité préventives pour les développeurs Web (XSS, CSP, cookies, isolation multi-origine). Utilisez cette compétence pour guider le processus d'audit, de test et de déploiement des règles de sécurité en toute sécurité.
Afficher la compétence security sur GitHub
passkeys
/modern-web-guidance passkeys
Principes d'orientation et transversaux complets pour implémenter WebAuthn et les clés d'accès dans les applications Web. Utilisez ce guide pour gérer l'enregistrement, l'authentification, la gestion ou la réauthentification des clés d'accès.
Afficher la compétence passkeys sur GitHub
privacy
/modern-web-guidance privacy
Consignes orientées action pour les développeurs Web afin d'implémenter la confidentialité dès la conception, la minimisation des données, les audits tiers et la gestion sécurisée des données. Utilisez cette compétence lorsque vous concevez des applications, intégrez des services tiers, gérez des données utilisateur ou configurez des en-têtes de sécurité.
Afficher la compétence privacy sur GitHub
Systèmes agentiques
Ces compétences permettent de combler le fossé entre votre application Web et les workflows d'IA avec WebMCP. En exposant les fonctionnalités du navigateur côté client sous forme d'outils interactifs, vous pouvez demander aux agents d'IA d'interagir directement avec les fonctionnalités de l'application.
webmcp
/modern-web-guidance webmcp
Implémentez WebMCP pour exposer les fonctionnalités du navigateur côté client en tant qu'outils interactifs pour les agents d'IA.
Afficher la compétence webmcp sur GitHub
Étapes suivantes
Maintenant que vous avez compris les consignes pour le Web moderne, essayez-les vous-même ! Découvrez les fonctionnalités et les cas d'utilisation compatibles avec les conseils pour le Web moderne, et essayez quelques exemples de requêtes pour commencer.