タッチターゲットサイズチェッカーとは
WCAG 2.2達成基準2.5.8「ターゲットサイズ」では、インタラクティブ要素のターゲット領域が少なくとも24×24 CSSピクセル（AA）であることを要求しています。AAAレベルでは44×44pxが必要です。これらのサイズは、運動障害のある人やタッチデバイスを使用する人が、誤って隣接する要素をアクティブにすることなく、インタラクティブ要素を確実にタップまたはクリックできるようにします。
クイックアンサー
WCAG 2.2では、インタラクティブ要素のターゲットサイズが少なくとも24×24px（AA）または44×44px（AAA）であることを要求しています。インラインリンク、ネイティブコントロール、必須要素、隣接ターゲット間の24px以上のスペーシング、の4つの例外が適用されます。CSSのmin-width/min-heightとgap/paddingを使用して、サイズ不足のターゲットを修正します。
Last updated: 2026-05-28
制限事項
- このツールは静的な寸法のみをチェックします。異なる画面サイズで有効なターゲットサイズを変更する可能性のある動的レイアウト、レスポンシブブレークポイント、ズームレベルは考慮しません。
- スペーシング例外では、隣接ターゲット間の実際のスペーシングの手動検証が必要です。このツールは入力されたスペーシング値をチェックしますが、実際のDOMレイアウト距離を測定することはできません。
- WCAG 2.5.8はWCAG 2.2のレベルAA要件です。一部の執行機関は他の機関よりも厳格に適用する場合があり、例外の解釈も異なります。
Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub
使い方
- インタラクティブ要素の幅と高さをCSSピクセルで入力します。
- 判明している場合は、最も近い隣接インタラクティブ要素までのスペーシングを入力します。
- 要素タイプを選択します。インラインリンク、ネイティブコントロール、必須要素には異なる例外が適用されます。
- 合格/不合格の結果とCSS修正推奨事項を確認します。
主な用途
- モバイルナビゲーションボタンが24pxのAAターゲットサイズ要件を満たしているか確認する。
- 小さなアイコンのみのボタンが隣接要素との十分なスペーシングを持ち、スペーシング例外の対象となるか検証する。
- WCAGコンプライアンスレビューの前にページのタッチアクセシビリティを監査する。