コンテンツの目的を明確に伝える見出しとラベル
見出しとラベルがコンテンツの目的を明確に伝えることで、ユーザーが情報を効率的に理解し、必要な情報へ素早くアクセスできるようにします。特に、スクリーンリーダーを使用するユーザーや、認知的な負荷を軽減したいユーザーにとって重要な配慮となります。
該当するケース
Section titled “該当するケース”- ウェブページの見出し（h1〜h6要素）
- フォームの入力フィールドのラベル
- ボタンやリンクのテキスト
- セクションやコンテンツブロックの見出し
- データテーブルの見出しセル
- メニュー項目やナビゲーション要素のラベル
関連するWCAG達成基準
Section titled “関連するWCAG達成基準”チェックリスト
Section titled “チェックリスト”- 各見出しは、その後に続くコンテンツの内容を正確に反映していること
- フォームのラベルは、入力が期待される情報の種類を明確に示していること
- ボタンやリンクのテキストは、その機能や遷移先を理解できる内容になっていること
- 見出しの階層構造は論理的で、コンテンツの関係性を正しく表現していること
- 同じレベルの見出しは、同じような種類の情報を表していること
- ラベルや見出しは、コンテキストを考慮しても曖昧さがないこと
- 見出しやラベルを評価する際は、その要素が単独で存在する場合と、周囲のコンテンツと組み合わさった場合の両方の視点で確認してください
- 技術的な実装方法（HTMLの見出し要素やラベル要素の使用）だけでなく、実際のテキスト内容が適切かどうかも確認してください
- 見出しやラベルの目的は、ユーザーがコンテンツを効率的にスキャンできるようにすることです。この観点から評価してください
チェック方法
Section titled “チェック方法”- スクリーンリーダーを使用して、見出しとラベルの読み上げを確認する
- 見出しの階層構造を視覚的に確認する
- コードレビューで適切なHTML要素が使用されているか確認する
- ユーザビリティテストで、見出しやラベルが意図した通りに理解されているか確認する
補足・注意点
Section titled “補足・注意点”- 見出しやラベルは、コンテンツの構造を反映するだけでなく、ユーザーが期待する情報を提供する必要があります
- 技術的な実装が正しくても、テキスト内容が不適切な場合は達成基準を満たしていないことになります
- 見出しの階層構造は、必ずしも視覚的な見た目と一致する必要はありませんが、論理的な順序を維持する必要があります