mcpField
A
addyosmani-quality

addyosmani-quality

github.com/podoTesting & quality29181 installsUpdated 1d ago
Repository

About addyosmani-quality

addyosmani-quality is a suite of six focused skills for assessing and improving web quality. It covers holistic audits as well as accessibility, Core Web Vitals, performance, SEO, and modern-web best practices.

Key features

  1. 01Run holistic web quality audits
  2. 02Review WCAG 2.2 accessibility
  3. 03Optimize Core Web Vitals
  4. 04Assess loading and runtime performance
  5. 05Improve SEO and structured data
  6. 06Check security and web best practices

Use cases

  1. 01Audit a website across quality areas
  2. 02Review a site for accessibility issues
  3. 03Investigate page speed and Core Web Vitals
  4. 04Improve search visibility and structured data

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/podo/design-agent-skills --skill addyosmani-quality

After installing, type/addyosmani-qualityin Claude Code to confirm it loaded.

Bundled filesstub.yaml

Details

From the project README

addyosmani-quality

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

Decision tree

  1. Is the full skill already installed? This package installs 6 skills (web-quality-audit, accessibility, core-web-vitals, performance, seo, best-practices); checking the first.

    • Global: f=~/.agents/skills/web-quality-audit/SKILL.md; [ -f "$f" ] && ! grep -q "^das:" "$f" && echo "installed" || echo "pointer"
    • Project: f=.agents/skills/web-quality-audit/SKILL.md; [ -f "$f" ] && ! grep -q "^das:" "$f" && echo "installed" || echo "pointer"
    • installed → the skill is installed as web-quality-audit, invoke it and proceed
    • pointer → go to step 2

  2. Detect scope, then install:

    [ -e ~/.agents/skills/addyosmani-quality ] && echo "global" || echo "project"

    Global:

    npx skills add addyosmani/web-quality-skills --skill web-quality-audit accessibility core-web-vitals performance seo best-practices -g -y

    Project:

    npx skills add addyosmani/web-quality-skills --skill web-quality-audit accessibility core-web-vitals performance seo best-practices -y

    Claude Code: send a command as a chat message starting with ! to run it without leaving the conversation.

Claude Code plugin route:

/plugin marketplace add addyosmani/web-quality-skills
/plugin install web-quality-skills@addy-web-quality-skills

Heads-up

  • License: MIT

Invoke after install

  • web-quality-audit — "Lighthouse audit", "web quality", "audit my site"
  • accessibility — "WCAG compliance", "screen reader", "keyboard nav"
  • 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) web quality suite. Each skill is a focused, evidence-led playbook: a holistic Lighthouse-style audit (performance, accessibility, SEO, best practices, agentic browsing), WCAG 2.2 accessibility, Core Web Vitals optimization using field and lab data, loading and runtime performance, search visibility and structured data, and security and modern-web best practices. Start with web-quality-audit and drop into a focused skill for the fixes.

When NOT to use

  • A single-purpose WCAG 2.2 guidance workflow (design through conformance docs) → use wcag-ai-skill
  • Targeted color-contrast and accessibility fixes in code → use fixing-accessibility
  • Motion-specific jank (layout thrashing, compositor properties) → use fixing-motion-performance

Comments

Markdown supported