mcpField
A
accessibility-audit

accessibility-audit

github.com/nickcrewテスト・品質6268 回インストール18 週間前に更新
リポジトリ

accessibility-audit について

accessibility-audit は、ページ、コンポーネント、PR のアクセシビリティを簡易確認するスキルです。自動スキャンと手動チェックを組み合わせ、詳細監査が必要なケースも示します。

主な機能

  1. 01自動アクセシビリティスキャンの案内
  2. 02キーボード操作の確認
  3. 03セマンティクスとラベルの確認
  4. 04視覚的なコントラストの確認
  5. 05動的更新とモーションの確認
  6. 06詳細監査への移行条件

活用シーン

  1. 01リリース前のアクセシビリティ確認
  2. 02コンポーネント単位の検証
  3. 03PR の回帰問題の発見
  4. 04WCAG 2.2 AA の簡易チェック

インストール

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

$npx skills add https://github.com/nickcrew/claude-cortex --skill accessibility-audit

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

詳細

アクセシビリティ監査スキル

ページ、コンポーネント、PR を対象とした、高速で重要度の高いアクセシビリティのトリアージです。軽量なチェックであり、完全な適合性監査ではありません。

このスキルを使うタイミング

  • リリース前のアクセシビリティの簡易トリアージ
  • コンポーネント単位の a11y 検証
  • アクセシビリティのリグレッションに関する PR レビュー
  • WCAG 適合性のスモークチェック
  • 新機能のキーボードナビゲーションの検証

クイック監査チェックリスト

1. 自動スナップショット（推奨）

まず、以下の自動ツールのいずれかを実行します。

  • npx @axe-core/cli <url> - axe-core による簡易スキャン
  • npx pa11y <url> --standard WCAG2AA - Pa11y 監査
  • Lighthouse のアクセシビリティスコア（Chrome DevTools > Lighthouse > Accessibility）
2. キーボードの基本事項
チェック項目期待される結果
すべてのインタラクティブ要素に Tab キーで移動できるはい
フォーカスインジケーターが常に表示されるはい
キーボードトラップがないはい
タブ移動の順序が論理的であるはい
長いページでスキップリンクが機能するはい
3. セマンティクスとラベル
チェック項目期待される結果
説明的な H1 が 1 つあるはい
見出しの順序が論理的である（大きな飛びがない）はい
フォーム入力に表示ラベルまたは aria-label があるはい
ボタンとリンクに明確な名前があるはい
画像に意味のある代替テキストがある（装飾目的の場合は空）はい
4. 視覚的なコントラスト
要素最小比率
通常のテキスト4.5:1
大きなテキスト（18pt 以上、または太字で 14pt 以上）3:1
UI コンポーネント（入力欄、ボタン、フォーカスリング）3:1
5. モーションと更新
チェック項目期待される結果
prefers-reduced-motion を尊重するはい
動的な更新が通知される（aria-live）はい

出力形式

監査の実行後、以下の形式で結果を報告します。

## Accessibility Audit: [Component/Page Name]

### Result: [Pass | Needs Fixes | Escalate to Full Audit]

### Findings

| Severity | Issue | Location | Fix Guidance |
|----------|-------|----------|--------------|
| Critical | [Description] | [Selector/Line] | [How to fix] |
| Major | [Description] | [Selector/Line] | [How to fix] |
| Minor | [Description] | [Selector/Line] | [How to fix] |

### Escalation Recommendation
[If applicable, explain why a full audit is needed]

完全な監査にエスカレーションするタイミング

  • ナビゲーション構造を新設または変更した場合
  • 複雑なフォームや認証フローがある場合
  • カスタムウィジェットや高度なインタラクション（モーダル、アコーディオン、タブ）がある場合
  • 一般公開のリリースや適合性要件がある場合
  • ページ構造を大幅に変更した場合
  • 複数の重大な問題が見つかる自動スキャンに失敗した場合

注意事項

  • このスモークチェックでは、デフォルトで WCAG 2.2 AA を対象とします
  • 別の適合レベルが必要な場合は、明記してください
  • 自動ツールで検出できる問題は約 30～40％です。手動テストが不可欠です
  • 包括的に確認するには、実際のスクリーンリーダー（VoiceOver、NVDA）でテストしてください

コメント

Markdown 対応