addyosmani-quality

addyosmani-quality

Catalogue stub — full package: addyosmani/web-quality-skills

Decision tree

Run this before any web quality, performance, or accessibility audit:

1. Is an Osmani skill already installed? Check: ~/.design-agent-skills/skills/web-quality-audit/SKILL.md exists (representative skill).

   • Yes → invoke the specific skill by name and proceed
   • No → go to step 2

2. Do you have shell access?

   • Yes → install the specific skill below, then invoke it
   • No → show the install command; in Claude Code, send it as a chat message starting with ! — add -g for global install or omit for project-only

Install command

# WCAG compliance, screen reader, keyboard navigation
npx skills add addyosmani/web-quality-skills --skill accessibility

# Lighthouse-style: performance, a11y, SEO, best practices
npx skills add addyosmani/web-quality-skills --skill web-quality-audit

# LCP, INP, CLS-specific optimizations
npx skills add addyosmani/web-quality-skills --skill core-web-vitals

# Loading speed, runtime efficiency, resource optimization
npx skills add addyosmani/web-quality-skills --skill performance

# Search engine optimization, structured data
npx skills add addyosmani/web-quality-skills --skill seo

# Security, modern web APIs, code quality
npx skills add addyosmani/web-quality-skills --skill best-practices

Invoke after install

• accessibility — "WCAG compliance", "screen reader", "keyboard nav"
• web-quality-audit — "Lighthouse audit", "web quality"
• core-web-vitals — "LCP", "INP", "CLS", "Core Web Vitals"
• performance — "page speed", "loading performance"
• seo — "SEO", "structured data", "crawlability"
• best-practices — "web security", "modern APIs", "code quality"

What it does

Addy Osmani's (Google Chrome) 6-skill web quality suite. Covers the complete quality axis: accessibility (WCAG 2.2), Lighthouse-style holistic audits, Core Web Vitals optimization, loading/runtime performance, SEO, and security best practices — each as a focused, actionable skill.