WCAG 3.3.2: 入力にラベルまたは説明があるか確認する
placeholder のみに依存しすぎていないか。
意図的な失敗例: 入力説明が不足している
形式や制限が事前に分かりません。
送信後にだけ形式エラーが表示される想定です。
確認観点
- 各入力欄に、目的が分かるラベルを視覚的にもプログラム的にも関連付ける
- 入力形式、全角・半角、文字数、使用できる文字、必須/任意など、エラーになる前に必要な説明を提示する
- placeholderだけに説明を任せず、入力中や入力後も確認できる位置に説明を置く
人の判断が必要な例
- ラベルだけを読んで入力すべき内容が分かるか確認する
- 制約や入力例が、マウス利用者だけでなくキーボード・スクリーンリーダー利用者にも伝わるか確認する
- 必須項目が色だけで示されておらず、「必須」などの文字でも判別できるか確認する
補助ツール候補
- form-structure
- required-fields
生成メモ
- 支援技術を用いた実検証が必要