mcpField
A
addyosmani-quality

addyosmani-quality

github.com/podoテスト・品質29181 回インストール1 日前に更新
リポジトリ

addyosmani-quality について

addyosmani-qualityは、ウェブ品質の評価と改善に使う6つの専門スキル群です。総合監査に加え、アクセシビリティ、Core Web Vitals、性能、SEO、モダンウェブのベストプラクティスを扱います。

主な機能

  1. 01ウェブ品質の総合監査
  2. 02WCAG 2.2アクセシビリティの確認
  3. 03Core Web Vitalsの最適化
  4. 04読み込み時と実行時の性能評価
  5. 05SEOと構造化データの改善
  6. 06セキュリティとウェブのベストプラクティス確認

活用シーン

  1. 01複数の品質領域にわたるウェブサイト監査
  2. 02サイトのアクセシビリティ上の問題確認
  3. 03ページ速度とCore Web Vitalsの調査
  4. 04検索での可視性と構造化データの改善

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/podo/design-agent-skills --skill addyosmani-quality

インストール後、Claude Code で/addyosmani-qualityを入力して読み込まれたか確認します。

同梱ファイルstub.yaml

詳細

addyosmani-quality

カタログのスタブ — 完全なパッケージ:addyosmani/web-quality-skills

判断ツリー

  1. 完全なスキルはすでにインストールされていますか? このパッケージは6つのスキル(web-quality-audit、accessibility、core-web-vitals、performance、seo、best-practices)をインストールします。まずは最初のスキルを確認します。

    • グローバル:f=~/.agents/skills/web-quality-audit/SKILL.md; [ -f "$f" ] && ! grep -q "^das:" "$f" && echo "installed" || echo "pointer"
    • プロジェクト:f=.agents/skills/web-quality-audit/SKILL.md; [ -f "$f" ] && ! grep -q "^das:" "$f" && echo "installed" || echo "pointer"
    • installed → スキルがweb-quality-auditとしてインストールされています。これを呼び出して続行します
    • pointer → ステップ2に進みます
  2. スコープを検出してから、インストールします:

    [ -e ~/.agents/skills/addyosmani-quality ] && echo "global" || echo "project"
    

    グローバル:

    npx skills add addyosmani/web-quality-skills --skill web-quality-audit accessibility core-web-vitals performance seo best-practices -g -y
    

    プロジェクト:

    npx skills add addyosmani/web-quality-skills --skill web-quality-audit accessibility core-web-vitals performance seo best-practices -y
    

    Claude Code: 会話を離れずにコマンドを実行するには、!で始まるコマンドをチャットメッセージとして送信します。

Claude Code プラグイン経由:

/plugin marketplace add addyosmani/web-quality-skills
/plugin install web-quality-skills@addy-web-quality-skills

ご注意

  • ライセンス: MIT

インストール後の呼び出し

  • web-quality-audit — 「Lighthouse audit」、「web quality」、「audit my site」
  • accessibility — 「WCAG compliance」、「screen reader」、「keyboard nav」
  • core-web-vitals — 「LCP」、「INP」、「CLS」、「Core Web Vitals」
  • performance — 「page speed」、「loading performance」
  • seo — 「SEO」、「structured data」、「crawlability」
  • best-practices — 「web security」、「modern APIs」、「code quality」

機能

Addy Osmani(Google Chrome)によるウェブ品質スイートです。各スキルは、エビデンスに基づいた特定分野向けの実践ガイドです。パフォーマンス、アクセシビリティ、SEO、ベストプラクティス、エージェントによるブラウジングを対象にした包括的なLighthouse形式の監査、WCAG 2.2への対応、フィールドデータとラボデータを用いたCore Web Vitalsの最適化、読み込み時と実行時のパフォーマンス、検索での可視性と構造化データ、セキュリティとモダンウェブのベストプラクティスを扱います。まずweb-quality-auditを使い、修正内容に応じて特定分野向けのスキルに進んでください。

使用しない場合

  • WCAG 2.2のガイダンスに特化したワークフロー(デザインから適合性ドキュメントまで) → wcag-ai-skillを使用します
  • コード内の色のコントラストやアクセシビリティに関する個別の修正 → fixing-accessibilityを使用します
  • モーションに特化したカクつき(レイアウトのスラッシング、コンポジターのプロパティ) → fixing-motion-performanceを使用します

コメント