Level AWCAG 2.2
2.1.2 キーボードトラップなし
キーボードフォーカスがコンポーネントに閉じ込められない。
なぜ重要か
操作不能
フォーカスが閉じ込められると、ページの残りの部分にアクセスできなくなります。
キーボードユーザー
マウスが使えないユーザーはトラップから脱出する手段がありません。
フラストレーション
ページのリロードを余儀なくされ、入力データが失われることも。
モーダル・ウィジェット
リッチUIコンポーネントで意図せずトラップが発生しやすい。Escで閉じられるように。
ライブデモ
キーボードトラップ体験
Tab キーでフォーム内を移動してみてください。
テキストエリアからTab で脱出できない
モーダルやカスタムウィジェットで
keydown を横取りすると、ユーザーがそのコンポーネントから脱出できなくなります。 必ず Esc やTab で離脱できるようにしましょう。ペルソナで理解する
中村さん(45歳)— RSI(反復性ストレス障害)
マウスの長時間使用が困難で、キーボード中心に操作します。リッチテキストエディタにフォーカスが入ったまま出られず、ブラウザを強制終了。書きかけの長文メールが消えました。