3.2.1 フォーカス時にコンテンツを大きく変更しない
適合レベル
A
※各レベルについては適合レベルとはをご覧ください
概要
フォーカスを受け取ったときに、ユーザーが意図しない変更はしない。
視覚障害や運動障害のあるユーザーは、キーボードなどで操作することがある。フォーカスで以下の「悪い例」のような変更が起きると、操作を完了できない恐れがある。
また、フォーカス移動を自動的に行うと、ユーザーが勝手にフォーカス移動したことに気づかない場合もある。そのため、フォーカス移動はユーザーの操作に任せるのが望ましい。
具体例
悪い例
要素にフォーカスした時、フォーカス移動する時、以下のような「コンテキストの変化」を起こすこと。
- フォームが自動的に送信される
- 新しいウィンドウを開く
- ページ内の現在位置を移動したり別のページに移動したりさせるコンポーネント
- 分割されたカード番号の入力欄で、4桁入力した瞬間に自動で次の欄にフォーカスが移る
テスト・チェック方法
マークアップ実装時、コードレビューによるチェックをする。