HTML アクセシビリティ監査者

ほとんどの迅速なアクセシビリティ チェックは、表面的なキーワード スキャンか、ブラック ボックスとして信頼する必要がある重量ライブラリのいずれかです。このツールは 3 番目のパスを選択します。つまり、ブラウザー独自の組み込み DOMParser を使用して、貼り付けた HTML を解析します (axe-core、外部アクセシビリティ ライブラリ、何もダウンロードされません)。その後、一般的な実際の WCAG 2.1 障害パターンを反映する一連の手書きチェックを使用して、結果の DOM ツリーを調べます。つまり、ロジックは完全に検査可能であり、監査は完全にブラウザ内で実行されます。貼り付けたマークアップやテストした色のペアは、どこにもアップロードされたり送信されたりすることはありません。

このチェックでは、実際のページで最も頻繁に発生するエラーがカバーされています。 alt 属性がまったくない <img> 要素 (正しくフラグが設定されていない、装飾画像に使用される意図的に空の alt="" とは異なる、本物の WCAG エラー)、支援技術がその目的を知る方法のないフォーム コントロール (ラベルへのすべての実際のパス、つまり、一致する <label for>、<label> 内にラップされている、または aria-label/aria-labelledby に対してチェックされます)属性)、警告なしでジャンプする見出しレベル (<h1> から <h3> に直接ジャンプする、または <h1> がまったくない文書、または複数の文書)、href のないリンク、または「ここをクリック」や「続きを読む」などの曖昧で文脈から外れたテキストを含むリンク、完全な HTML 文書 (断片だけでなく) が貼り付けられた場合の lang 属性の欠落。

際立った部分は、表面的な「読みやすく見える」ヒューリスティックではなく、本物のコントラスト数学です。インライン カラーと背景色を持つ要素については、ツールは両方の値を読み取り、ブラウザー独自の CSS エンジンを介して実際の RGB 数値に解決し (つまり、hex、rgb()、hsl()、および「トマト」などの名前付きカラーはすべて同じように機能します)、それぞれの正確な WCAG 相対輝度を計算します (L = 0.2126×R + 0.7152×G + 0.0722×B)。チャンネルは、公式のコントラスト比公式 (明るい方の L + 0.05) / (暗い方の L + 0.05) に結合する前に、最初に実際の sRGB 伝達曲線を使用してガンマ補正されます。要素自体のフォント サイズとフォントの太さによって、より厳格な「通常のテキスト」のしきい値か、より緩やかな「ラージ テキスト」のしきい値 (18 ポイント以上、または 14 ポイント以上の太字) が適用されるかが決定され、結果は 4 つの実際の WCAG 数値すべてに対して一度にチェックされます: AA の場合は 4.5:1 と 3:1、AAA の場合は 7:1 と 4.5:1 です。単一の偽の良い/悪い判定に陥ることはありません。

これは、完全なアクセシビリティ監査の意図的に正直で実用的なサブセットであり、認定ツールではありません。JavaScript 駆動の対話性、基本的なラベル付けを超える ARIA ウィジェット パターン、キーボード フォーカス順序、または実際にページのレンダリングと実行を必要とするものは評価されません。これは、ページが出荷される前に、本番環境に出荷されるものに対する完全な手動レビューや専用の監査ツールと並行して (代わりではなく)、最も一般的かつ最も重大な WCAG エラー (代替テキストの欠落、ラベルのないフィールド、壊れた見出し階層、低コントラストのテキスト、曖昧なリンク) の一部を検出する高速な最初のパスとして扱います。