安装
npx skills add addyosmani/web-quality-skills适合谁
适合要按测量结果优化网页质量，而不是只凭感觉改样式的人。官方写明：这是一套非官方、测量优先的 Agent Skills 合集，用来配合 Google Lighthouse、面向 agent 的 Chrome DevTools、Core Web Vitals、WCAG 和搜索相关指引，优化网页项目。
更合适的人，是已经有一个可打开的站点或本地项目，想先做一次以证据为准的质量检查的人。原文点名的技能是 web-quality-audit：跨 Lighthouse 与源码类别做检查。触发说法包括 “Audit my site”、“Review this for quality”、“Check web quality”。
它宣称与技术栈无关，可与 React、Vue、Angular、Svelte、Next.js、Nuxt、Astro、纯 HTML 等一起用。不要把这份名单理解成“只支持这些框架”。
开始前要能运行 npx skills add。主路径不要改成其他安装器。
3 分钟完成第一次尝试
只走仓库给出的 npx 主路径。第一次只做检查，不改线上代码。
前置条件：本机已有 npm/npx，并且手头有一个已存在的网页项目或可访问的站点。不要发明要检查的网址。
安装位置：在工作区执行：
npx skills add addyosmani/web-quality-skills
官方仓库：
https://github.com/addyosmani/web-quality-skills
技能说明锚点：
https://github.com/addyosmani/web-quality-skills#web-quality-audit
Lighthouse 概览：
https://developer.chrome.com/docs/lighthouse/overview/
低风险触发：安装后，对已有项目说 “Check web quality” 或 “Review this for quality”。官方把这描述为以证据为准的检查。先看报告，再决定要不要改文件。Agent Skills 规范页仅作原文指向：
https://agentskills.io/
成功信号：助手按 Lighthouse 与源码类别给出检查结果，而不是直接提交补丁。若下一步要改性能或无障碍代码，先确认将改哪些文件。
使用案例
案例一：对现有站点做 web-quality-audit。用官方触发句之一，让助手做跨 Lighthouse 与源码类别的检查。适合已经有站点、想先拿到测量依据的人。证据只描述这一个技能行，没有列出其他技能名。把输出当检查结果，不要自动发布。
案例二：在不同框架的项目里做同一种测量优先检查。官方写明与技术栈无关，并举例 React、Vue、Angular、Svelte、Next.js、Nuxt、Astro 和纯 HTML。适合项目栈已经固定、只想加质量检查的人。不要推断“必须用其中某个框架”，也不要补写未出现的技能名。
使用边界
主安装命令是 npx skills add addyosmani/web-quality-skills。原文另外写了 Claude Code 插件命令：/plugin marketplace add addyosmani/web-quality-skills，再 /plugin install web-quality-skills@addy-web-quality-skills。第一次不要把两条路径混在一次操作里。
本页点名的技能只有 web-quality-audit。其他技能名不要自行补全。
这是非官方合集。官方没有保证它覆盖全部 WCAG 条款，也没有要求必须同时打开搜索指引和 DevTools。