WCAG 2.2 タッチターゲットサイズ（24px AA / 44px AAA）判定
＆ スマホタップ領域拡張 CSSジェネレーター
スマホ画面で「閉じるアイコン」や「小さなリンク」が押しにくく、誤タップしてしまう問題。 2023年10月に正式勧告されたWCAG 2.2「2.5.8 ターゲットサイズ（最小 24×24px）」や、iOS HIG（44pt）、Google Material（48dp）の適合度を実寸プレビュー判定します。 見た目のデザインは小さなまま、タップ判定だけを44px以上に拡張する現場標準のCSS（擬似要素法／Tailwindユーティリティ）を即座に生成します。
コンポーネント寸法設定
※24px未満でも、中心からの24px円が隣接要素と交差しない余白があればAA適合となります（例外規定）。
実寸インタラクティブ・プレビュー＆タップ判定
※青い破線枠＝実寸のタップ可能エリア（hit area） / オレンジ枠＝見た目の要素サイズ
WCAG 2.2 ターゲットサイズ基準の重要ポイント
24×24 CSSピクセル以上が必要です。ただし、ターゲットの中心から直径24pxの円を描いたとき、隣接する他のターゲットと円が交差しない（十分な余白がある）場合は24px未満でも適合となります。
44×44 CSSピクセル以上が必要です。手の震えや運動機能障害を持つユーザー、高齢者、片手操作中のモバイルユーザーでも確実にタップできる高水準のユーザビリティ基準です。
見た目を44pxにしてしまうと、ヘッダーの「✕閉じるボタン」や検索窓の「クリアボタン」が巨大になりデザイナーと対立しがちです。
::after で透明なタップ領域だけを広げれば、デザインの美しさとアクセシビリティを100%両立できます。
段落や文中に埋め込まれたテキストリンク（例: 「詳しくはこちらをご覧ください」）は、24pxや44pxのサイズ制限から免除されます（文脈を崩せないため）。
あわせて使えるWebアクセシビリティ＆UI実務ツール
入力値を引き継いで連携利用できる関連ツール群
行間・文字間（1.4.12）を含む総合アクセシビリティ診断とA4検査レポート出力
総合診断を開く →テキストと背景色のコントラスト比（4.5:1 / 3:1）とP/D/T型色覚シミュレーション
ツールを開く →デザインシステム全体の全色総当たりコントラスト判定と不合格ペアの最短輝度補正
ツールを開く →X・YouTube・Instagram等のUIかぶりを防ぐ安全領域シミュレーター
ツールを開く →