addyosmani/web-quality-skills

Agent Skills for optimizing web quality based on Lighthouse and Core Web Vitals.

何を解決するか

AIコーディングエージェント向けの専門的な「スキル」のセットを提供し、開発者がウェブプロジェクトのパフォーマンス、アクセシビリティ、SEO、および一般的な品質を最適化するのを支援します。一般的なアドバイスではなく、Lighthouseの審査やコアウェブビタルなどの測定に基づく証拠を使用して、実際の問題を診断・修正できるようにします。

仕組み

これらのスキルは、Claude Code、Codex、Gemini CLIなどのAIエージェントにインストール可能な指示セットです。エージェントが、4種類の証拠(実ユーザー体験のCrUXフィールドデータ、第一者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など、複数のエージェントプラットフォームと互換性があります。

関連

  • プロジェクト
  • プロジェクト
  • プロジェクト
  • プロジェクト