Browse the following disciplines to explore the areas of guidance.
Core disciplines
Best practices for building safe, high-quality experiences on the web.
accessibility
Assess, fix, and implement effective accessibility patterns across your entire application.
View the accessibility guide on GitHub
performance
Optimize Core Web Vitals, reduce page load times, and improve responsiveness to user input.
View the performance guide on GitHub
privacy
Implement privacy by design, data minimization, third-party audits, and secure data handling.
View the privacy guide on GitHub
security
Implement preventative security guidelines to safeguard against common web vulnerabilities (XSS, CSP, Cookies, Cross-Origin Isolation).
View the security guide on GitHub
Web technologies
Best practices for using core web languages, technologies, and runtime environments.
html
Implement modern HTML architecture, semantics, native interactive APIs (Dialog, Popover, Details), focus management, and resource prioritization.
css
Apply modern CSS architecture, layouts, and performance best practices.
css-layout
Build responsive layouts using modern CSS features such as flexbox, grid, subgrid, container queries, anchor positioning, and intrinsic sizing.
View the css-layout guide on GitHub
forms
Build accessible, secure, and user-friendly web forms.
View the forms guide on GitHub
passkeys
Implement WebAuthn and Passkeys in web applications following cross-cutting modern principles.
View the passkeys guide on GitHub
webmcp
Implement WebMCP to expose client-side browser functionality as interactive tools for AI agents.
View the webmcp guide on GitHub
Browser capabilities (opt-in)
Best practices for working with specialized browser APIs and platforms. These are separate skills from modern-web-guidance and must be individually installed.
chrome-extensions
Build secure and compliant Chrome extensions under Manifest V3 that avoid common service worker lifecycle and sandboxing pitfalls, and streamline publishing to the Chrome Web Store with help preparing your metadata, privacy policies, and permission justifications. To opt in, select the chrome-extensions skill when installing Modern Web Guidance:
npx modern-web-guidance@latest install --choose
View the chrome-extensions skill on GitHub
Next steps
Now that you understand Modern Web Guidance, try it for yourself! Discover features and use cases supported in Modern Web Guidance, and try out a few sample prompts to get started.