accessibility-auditor について
WCAG 2.1 AA に照らしてウェブサイトを確認する、チーム向けのアクセシビリティ監査スキルです。自動スキャンに加え、キーボードやスクリーンリーダーの確認方法と修正指針をまとめています。
主な機能
- 01アクセシビリティの自動チェック
- 02キーボード操作のチェックリスト
- 03NVDA または VoiceOver による確認
- 04WCAG レベル A・AA の監査
- 05よくある不具合の修正例と ARIA パターン
活用シーン
- 01ウェブサイトの WCAG 2.1 AA 適合状況の監査
- 02キーボード操作とフォーカス動作のテスト
- 03スクリーンリーダーの名前・ロール・状態の確認
- 04問題を修正して自動チェックを再実行
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/インストール後、Claude Code で/accessibility-auditorを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
references/aria-patterns.mdautomated-testing.mdcommon-fixes.mdwcag-checklist.md詳細
アクセシビリティ監査
ウェブサイトのアクセシビリティ上の不備を監査し、WCAG 2.1 AA への準拠を実現します。
目次
references/automated-testing.md- CLI コマンド、jest-axe、Playwright、各種ツールreferences/wcag-checklist.md- WCAG レベル A／AA の基準とキーボードテストのチェックリストreferences/common-fixes.md- よくある 7 つの不備と sr-only クラスの修正パターンreferences/aria-patterns.md- タブ、アコーディオン、メニュー、アラート、進捗状況の ARIA マークアップ
ワークフロー
- 自動チェックを実行します。
references/automated-testing.mdに従って CLI スキャンを実行し、jest-axe または Playwright のアサーションを追加します。 - キーボードでテストします。ページ内を Tab キーで移動し、
references/wcag-checklist.mdのチェックリストを使って、順序、操作、エスケープ、フォーカスの可視性、フォーカストラップの有無を確認します。 - スクリーンリーダーでテストします。NVDA または VoiceOver でページを確認し、名前、ロール、読み上げられる状態を確認します。
- WCAG の基準を確認します。
references/wcag-checklist.mdにあるレベル A と AA の各基準を監査します。 - 修正を適用します。
references/common-fixes.mdとreferences/aria-patterns.mdのパターンを使って各指摘を解決し、ステップ 1 を再実行して違反がゼロであることを確認します。
コメント
Markdown 対応