Install
npx skills add addyosmani/web-quality-skillsPara quién
Encaja en quien mejorará la calidad web a partir de mediciones, no por instinto en el estilo. Texto oficial: es una colección Agent Skills no oficial, priorizando medición, para optimizar proyectos web con Google Lighthouse, Chrome DevTools orientados a agent, Core Web Vitals, WCAG e indicaciones relacionadas con búsqueda.
Mejor encaje: quien ya tiene un sitio que se puede abrir o un proyecto local y quiere primero una comprobación de calidad basada en evidencia. La skill nombrada en la fuente es web-quality-audit: comprueba a través de categorías Lighthouse y de código fuente. Las frases de disparo incluyen “Audit my site”, “Review this for quality”, “Check web quality”.
Afirma ser independiente de la pila y usable con React, Vue, Angular, Svelte, Next.js, Nuxt, Astro, HTML puro y similares. No leer ese conjunto como «solo estos frameworks».
Antes de empezar hay que poder ejecutar npx skills add. No cambiar la vía principal por otro instalador.
Completar un primer intento en 3 minutos
Seguir solo la vía principal npx del repositorio. El primer intento es solo comprobación; no cambiar código de producción.
Condición previa: esta máquina ya tiene npm/npx y tienes un proyecto web existente o un sitio alcanzable. No inventar una URL a comprobar.
Ubicación de instalación: ejecutar en el espacio de trabajo:
npx skills add addyosmani/web-quality-skills
Repositorio oficial:
https://github.com/addyosmani/web-quality-skills
Ancla de las notas de la skill:
https://github.com/addyosmani/web-quality-skills#web-quality-audit
Resumen de Lighthouse:
https://developer.chrome.com/docs/lighthouse/overview/
Disparo de bajo riesgo: tras instalar, decir “Check web quality” o “Review this for quality” en un proyecto existente. El texto oficial lo describe como comprobación basada en evidencia. Leer primero el informe y luego decidir si cambiar archivos. La página de especificación Agent Skills es solo un puntero de la fuente:
https://agentskills.io/
Éxito: el asistente da resultados por categorías Lighthouse y de código fuente, en vez de entregar un parche de inmediato. Si el siguiente paso cambiara código de rendimiento o accesibilidad, confirmar primero qué archivos cambiarán.
Casos de uso
Caso 1: ejecutar web-quality-audit en un sitio existente. Usar una de las frases oficiales y hacer comprobar a través de Lighthouse y código fuente. Encaja en quien ya tiene un sitio y quiere primero bases de medición. La evidencia solo describe esta fila de skill y no nombra otras. Tratar la salida como resultado de comprobación; no enviarla automáticamente.
Caso 2: hacer la misma comprobación priorizando medición en proyectos de distintos frameworks. El texto oficial dice independiente de la pila y cita React, Vue, Angular, Svelte, Next.js, Nuxt, Astro y HTML puro. Encaja en quien ya tiene la pila fija y solo quiere añadir una comprobación de calidad. No inferir que uno de esos frameworks es obligatorio ni inventar nombres de skills que no aparecieron.
Límites de uso
El comando principal de instalación es npx skills add addyosmani/web-quality-skills. La fuente también escribe comandos de plugin de Claude Code: /plugin marketplace add addyosmani/web-quality-skills, luego /plugin install web-quality-skills@addy-web-quality-skills. No mezclar ambas vías en una sola primera operación.
La única skill nombrada en esta página es web-quality-audit. No completar otros nombres de skills.
Es una colección no oficial. El texto oficial no promete cubrir todas las cláusulas WCAG ni exige abrir a la vez las indicaciones de búsqueda y DevTools.