addyosmani/web-quality-skills

해결하는 문제

AI 코드 에이전트를 위한 전문적인 "스킬" 세트를 제공하여 개발자가 웹 프로젝트의 성능, 접근성, 검색 엔진 최적화(SEO), 일반적 품질을 최적화하는 데 도움을 줍니다. 일반적인 조언이 아니라, Lighthouse 심사 및 핵심 웹 지표(Core Web Vitals)과 같은 측정 기반 증거를 사용하여 실제 문제를 진단하고 수정할 수 있도록 합니다.

작동 방식

이 스킬들은 Claude Code, Codex, Gemini CLI와 같은 AI 에이전트에 설치할 수 있는 지침 세트입니다. 에이전트가 네 가지 유형의 증거를 포함하는 특정 측정 모델을 사용하도록 안내합니다: CrUX 현장 데이터(실제 사용자 경험), 제1자 RUM, DevTools 트레이스/Lighthouse 랩 실행, 정적 소스 검사. 에이전트가 Chrome DevTools MCP에 접근할 수 있으면 실시간 심사를 수행할 수 있으며, 그렇지 않으면 CLI 도구와 정적 분석으로 대체합니다.

대상 사용자

React, Vue, Svelte, Astro와 같은 프레임워크를 사용하는 상관없이 사이트의 속도, 접근성(WCAG 2.2), 검색 엔진 가시성을 전문 수준 기준에 맞추고자 하는 AI 코드 에이전트를 사용하는 웹 개발자.

주요 특징

• 측정 중심 접근법: 가설보다 실제 사용자 데이터(CrUX)와 랩 트레이스를 우선시합니다.
• 포괄적인 품질 솔루션: 핵심 웹 지표(LCP, INP, CLS), WCAG 2.2 접근성, 기술적 SEO 전용 스킬을 포함합니다.
• 프레임워크 독립성: 모든 주요 웹 프레임워크 및 순수 HTML에서 작동합니다.
• 에이전트 통합: Claude Code, Codex, Gemini CLI 등 다양한 에이전트 플랫폼과 호환됩니다.