Skip to content
mcp/skillhub

Agent Skill

Best Practices skill

best-practicesaddyosmani/web-quality-skillsskills/best-practices/SKILL.md

Apply modern web development best practices for security, compatibility, and code quality. Use when asked to "apply best practices", "security audit", "modernize code", "code quality review", or "check for vulnerabilities".

3.0kMIT

always on

49 tokname + description

once used

2,913 tokSKILL.md body

bundled files

17 KB

repo stars

3.0kGitHub

Install the Best Practices skill

Skills CLI (Claude Code, Codex, Cursor and others)

npx skills add https://github.com/addyosmani/web-quality-skills --skill best-practices

Claude Code, by hand (all projects)

git clone --depth 1 https://github.com/addyosmani/web-quality-skills.git /tmp/web-quality-skills
mkdir -p ~/.claude/skills
cp -R /tmp/web-quality-skills/skills/best-practices ~/.claude/skills/best-practices

For one project only, copy the folder into .claude/skills/ in that project instead. The agent picks it up when a task matches its description.

What it costs your context

Agent Skills load in three steps. Tokens counted with the o200k tokenizer; your model's count will differ a little.

WhenWhat loadsCost
Every sessionName and description49 tok
When the agent uses itThe SKILL.md instructions2,913 tok
Only if opened1 bundled files (7 KB)varies

Until it is used, best-practices costs about 28× less than the median MCP server we measured (1,362 tokens on every turn). Installing all 6 skills from addyosmani/web-quality-skills would load 320 tokens of descriptions. Skills vs MCP study

Checks

Our checks found nothing to flag: it follows the Agent Skills specification's naming and size guidelines and doesn't pipe downloads into a shell.

Checked 2026-10-22 · method

What's inside

The headings of its SKILL.md. Read the full file on GitHub.

  • Best practices
  • Evidence-led audit workflow
  • Security
  • Browser compatibility
  • Doctype declaration
  • Character encoding
  • Viewport meta tag
  • Feature detection
  • Polyfills (when needed)
  • Deprecated APIs
  • Avoid these
  • Event listener passive
  • Console & errors
  • No console errors
  • Error boundaries (React)
  • Global error handler
  • Source maps
  • Production configuration
  • Performance best practices
  • Avoid blocking patterns
  • Efficient event handlers
  • Memory management
  • Code quality
  • Valid HTML

More skills from addyosmani/web-quality-skills

All skills in this repo
  1. accessibilityaddyosmani/web-quality-skills

    Audit and improve web accessibility following WCAG 2.2 guidelines. Use when asked to "improve accessibility", "a11y audit", "WCAG compliance", "screen reader support", "keyboard navigation", or "make accessible".

    63k51 tok idle · 3,541 in use
  2. core-web-vitalsaddyosmani/web-quality-skills

    Optimize Core Web Vitals (LCP, INP, CLS) for better page experience using field and lab evidence. Use when asked to "improve Core Web Vitals", "fix LCP", "reduce CLS", "optimize INP", "page experience optimization", or "fix layout shifts".

    3.0k67 tok idle · 2,181 in use
  3. performanceaddyosmani/web-quality-skills

    Optimize web performance for faster loading and better user experience. Use when asked to "speed up my site", "optimize performance", "reduce load time", "fix slow loading", "improve page speed", or "performance audit".

    3.0k49 tok idle · 3,214 in use
  4. seoaddyosmani/web-quality-skills

    Optimize for search engine visibility and ranking. Use when asked to "improve SEO", "optimize for search", "fix meta tags", "add structured data", "sitemap optimization", or "search engine optimization".

    3.0k46 tok idle · 3,160 in use
  5. web-quality-auditaddyosmani/web-quality-skills

    Run an evidence-led web quality audit covering performance, accessibility, SEO, best practices, and agentic browsing. Use when asked to "audit my site", "review web quality", "run lighthouse audit", "check page quality", or "optimize my website".

    3.0k158 tok idle · 2,242 in use