Kies uit de vermelde vaardigheden van Modern Web Guidance de fase waarin u zich bevindt in de webontwikkelingscyclus, van de eerste vormgeving tot de uiteindelijke beveiligingsimplementatie.
Kernprincipes van het web
Orchestrators helpen je om je werk te verfijnen en te focussen per webdiscipline.
accessibility
/modern-web-guidance accessibility
Dient als uw centrale auditgids om effectieve toegankelijkheidspatronen in uw gehele applicatie te beoordelen, te corrigeren en te implementeren.
Bekijk de accessibility op GitHub.
performance
/modern-web-guidance performance
Hiermee optimaliseert u de Core Web Vitals , verkort u de laadtijd van pagina's en verbetert u de responsiviteit op gebruikersinvoer.
Bekijk de performance op GitHub
user-experience
/modern-web-guidance user-experience
Het fungeert als uw toolkit voor de gebruikersinterface (UI) om snel responsieve, aangepaste elementen, vloeiende overgangen en moderne stijlpatronen te implementeren.
Bekijk de user-experience skill op GitHub.
Webtechnologieën
Deze kernvaardigheden vormen de essentiële bouwstenen voor elke moderne applicatie en zorgen ervoor dat uw project begint met moderne best practices, waarbij semantische HTML, snelheid en interoperabiliteit centraal staan.
html
/modern-web-guidance html
Actiegerichte richtlijnen voor moderne HTML-architectuur, semantiek, native interactieve API's (dialoogvenster, pop-upvenster, detailsvenster), focusbeheer en resourceprioritisering. Gebruik deze handleiding bij het structureren van webdocumenten, het implementeren van native overlays of het optimaliseren van de laadvolgorde van resources.
Bekijk de html skill op GitHub.
css
/modern-web-guidance css
Actiegerichte richtlijnen voor moderne CSS-architectuur, lay-outs en prestaties. Gebruik deze handleiding bij het schrijven van stijlen, het beheren van ontwerpsystemen of het optimaliseren van webrendering.
Bekijk de css skill op GitHub.
css-layout
/modern-web-guidance css-layout
Moderne CSS-lay-outs zoals flexbox, grid, subgrid, containerqueries, anchor-positionering en intrinsic sizing. Gebruik deze vaardigheid bij het ontwerpen van responsieve UI-componenten of paginalay-outs.
Bekijk de css-layout skill op GitHub
forms
/modern-web-guidance forms
Aanbevelingen voor het bouwen van toegankelijke, veilige en gebruiksvriendelijke webformulieren. Gebruik deze handleiding bij het maken of wijzigen van formulieren, invoervelden en verzendprocessen.
Bekijk de forms skill op GitHub.
cpp-on-the-web
/modern-web-guidance cpp-on-the-web
C- en C++-code compileren voor het moderne web met WebAssembly. Gebruik deze vaardigheid wanneer u C++-code moet overzetten, C++-bibliotheken moet bouwen met Emscripten of krachtige C++-componenten in de browser moet instellen.
Bekijk de cpp-on-the-web skill op GitHub.
Browserfunctionaliteiten (optioneel)
Deze vaardigheden helpen je bij het ontwikkelen van Chrome-extensies die voldoen aan moderne standaarden zoals Manifest V3 en stroomlijnen het publiceren naar de Chrome Web Store door je te helpen bij het voorbereiden van je metadata, privacybeleid en toestemmingsverklaringen. Deze vaardigheden zijn optioneel en niet standaard ingeschakeld.
chrome-extensions
/modern-web-guidance chrome-extensions
Ontwikkel veilige en conforme Chrome-extensies onder Manifest V3 die veelvoorkomende valkuilen in de levenscyclus van service workers en sandboxing vermijden. Om deel te nemen, moet u de skill chrome-extensions specificeren:
npx skills add GoogleChrome/modern-web-guidance --skill chrome-extensions
Bekijk de chrome-extensions skill op GitHub.
Veiligheid, vertrouwen en identiteit
Deze vaardigheden richten zich op het vergroten van het gebruikersvertrouwen door applicaties te beveiligen tegen client-side exploits zoals XSS met behulp van defensieve HTTP-headers en origin isolation. Ontwikkelaars kunnen ook authenticatiestromen met wachtwoorden ontwikkelen, tracking door derden minimaliseren en vaardigheden gebruiken om C/C++-bibliotheken naar WebAssembly-modules te converteren.
security
/modern-web-guidance security
Preventieve beveiligingsrichtlijnen voor webontwikkelaars (XSS, CSP, cookies, cross-origin isolation). Gebruik deze vaardigheid om het proces van auditeren, testen en veilig implementeren van beveiligingsbeleid te begeleiden.
passkeys
/modern-web-guidance passkeys
Een uitgebreide handleiding en overkoepelende principes voor de implementatie van WebAuthn en Passkeys in webapplicaties. Gebruik deze handleiding bij het registreren, authenticeren, beheren of opnieuw authenticeren van passkeys.
Bekijk de passkeys skill op GitHub.
privacy
/modern-web-guidance privacy
Actiegerichte richtlijnen voor webontwikkelaars om privacy by design, dataminimalisatie, audits door derden en veilige gegevensverwerking te implementeren. Gebruik deze vaardigheid bij het ontwerpen van applicaties, het integreren van diensten van derden, het verwerken van gebruikersgegevens of het configureren van beveiligingsheaders.
Bekijk de privacy skill op GitHub.
Agentische systemen
Deze vaardigheden helpen de kloof tussen uw webapplicatie en AI-workflows met WebMCP te overbruggen. Door client-side browserfunctionaliteit als interactieve tools beschikbaar te stellen, kunt u AI-agenten instrueren om rechtstreeks met applicatiefuncties te interageren.
webmcp
/modern-web-guidance webmcp
Implementeer WebMCP om client-side browserfunctionaliteit beschikbaar te stellen als interactieve tools voor AI-agenten.
Bekijk de webmcp skill op GitHub.
Volgende stappen
Nu je Modern Web Guidance begrijpt, kun je het zelf uitproberen! Ontdek de functies en gebruiksscenario's die Modern Web Guidance ondersteunt en probeer een paar voorbeeldvragen uit om aan de slag te gaan.