addyosmani/web-quality-skills
6 skills153k installs15.3k starsGitHub
Install
npx skills add https://github.com/addyosmani/web-quality-skillsSkills in this repo
1AccessibilityThe accessibility skill from web-quality-skills provides WCAG 2.2 aligned guidance for auditing and improving web accessibility. It organizes recommendations around POUR: perceivable, operable, understandable, and robust content, targeting Level A minimum, AA standard compliance, and AAA enhancements where feasible. Perceivable rules cover alt text, icon button names, color contrast ratios, non-color error cues, and media captions. Operable guidance enforces keyboard access, visible focus, skip links, 24px minimum targets, dragging alternatives, and session timing warnings. Understandable sections address predictable navigation, input labels, and error identification. Robust patterns ensure semantic HTML and ARIA used correctly with assistive technologies. The skill includes concrete HTML, CSS, and JavaScript examples marked incorrect versus correct, plus references to modal focus traps, skip links, and dragging movement patterns. Invoke it for a11y audits, screen reader support, keyboard navigation, and WCAG compliance reviews.39.6kinstalls2SeoSearch engine optimization skill covering technical SEO (robots.txt, sitemaps, canonical URLs), on-page best practices (title tags, meta descriptions, heading hierarchy), and structured data markup (JSON-LD for Organization, Article, Product). Helps developers implement SEO fundamentals based on Lighthouse audits and Google Search guidelines.35.5kinstalls3PerformanceThe performance skill from Addy Osmani's Web Quality Skills collection focuses on loading speed and runtime efficiency optimization for web projects. Developers use it when optimizing page load times, reducing JavaScript bundle sizes, and fixing slow-running code. The skill encodes real-world performance engineering expertise and covers critical rendering paths, image optimization, and caching strategies.25.4kinstalls4Web Quality AuditComprehensive web quality audit covering performance, accessibility, SEO, and best practices. Based on Google Lighthouse v13, covers 150+ checks including Core Web Vitals (LCP, INP, CLS), WCAG compliance, crawlability, on-page SEO, structured data, security, and modern standards. Categorizes findings by severity (Critical to Low) with actionable fixes. Use when asked to audit site quality, review web performance, optimize for ranking factors, or prepare for launch.18.2kinstalls5Core Web VitalsCore Web Vitals is a specialized skill for optimizing Largest Contentful Paint (LCP <2.5s), Interaction to Next Paint (INP <200ms), and Cumulative Layout Shift (CLS <0.1). Developers use it to improve page experience signals that directly affect Google Search ranking. Works across React, Vue, Nuxt, Astro, and plain HTML.17.6kinstalls6Best PracticesA code quality skill from the web-quality-skills suite covering security and modern development standards. Audits HTTPS configuration, security headers, modern JavaScript APIs, browser compatibility, error handling patterns, and console cleanliness. Works with any web framework (React, Vue, Angular, Svelte, Next.js, Nuxt, Astro, plain HTML). Part of a 6-skill orchestration suite covering Lighthouse, Core Web Vitals, accessibility, SEO, and performance.16.6kinstalls