christopherlouet/wcag-audit

wcag-audit は何をしますか？

Agent Skill for auditing web accessibility against WCAG 2.1/2.2 AA — 64 rules across 11 categories, inspired by axe-core. Install: npx skills add christopherlouet/wcag-audit

概要

このスキルは、AIエージェントがウェブページのアクセシビリティをWCAG 2.1/2.2 AAに準拠して監査できるようにします。axe-core にインスパイアされた64のルールが11カテゴリに分類されており、問題の検出と修正提案を自動で行います。

インストール

npx skills add christopherlouet/wcag-audit

使用方法

1. エージェントに監査対象のURLまたはHTMLソースを提供します。
2. エージェントが64のルールに基づいてページを解析します。
3. 結果は構造化されたレポートとして返されます。各違反には以下が含まれます：
   • ルールID
   • 影響度（critical, serious, moderate, minor）
   • 該当要素のCSSセレクタ
   • 問題の説明
   • 修正提案

対応ルールカテゴリ

カテゴリ	説明
色とコントラスト	色のコントラスト比、色以外での識別
ドキュメント構造	見出し、ランドマーク、フレームタイトル
キーボードアクセシビリティ	キーボード操作可能、フォーカス順序
画像と代替テキスト	img の alt 属性、背景画像
フォームとラベル	ラベル、エラーメッセージ、プレースホルダ
リンク	リンクテキスト、同一リンクの識別
マルチメディア	キャプション、トランスクリプト
ページタイトルとメタデータ	説明的なページタイトル
適応可能	リサイズ、リフロー対応
タイミングとアニメーション	タイムアウト、点滅、動きの制御
支援技術との互換性	ARIA、name/role/value

出力例

{
  "violations": [
    {
      "ruleId": "color-contrast",
      "impact": "critical",
      "selector": "#main-content > p.callout",
      "description": "前景色（#999）と背景色（#fff）のコントラスト比が2.8:1で、WCAG AAの4.5:1を満たしていません。",
      "suggestion": "前景色を #595959 に変更してコントラスト比4.7:1を確保してください。"
    }
  ]
}

注意事項

• このスキルは静的解析を行います。動的なコンテンツの変更やJavaScriptによるレンダリング後の状態は直接評価しません。
• 完全なアクセシビリティ監査には、自動テストだけでなく手動テストや支援技術を使ったテストを組み合わせることを推奨します。