- 遵守度
- MUST
- 自動チェック
- 一部可能
- 対象
- 画像
- フェーズ
- フロントエンド実装
チェックの内容
画像が情報をもっている場合、要素は画像としてアクセシブルな名前をもっているか確認します。
- DevToolsからアクセシビリティツリーに公開されていることを確認します
- スクリーンリーダーで「画像」とアクセシブルな名前が読み上げられることを確認します
アクセシブルな名前の実装
アクセシブルな名前は以下などの方法にて実装されます。どの方法が使われているかを確認する必要がある場合は参考にしてください。
img要素のalt属性area要素のalt属性input[type=image]要素のalt属性svg要素とtitle要素- その他の要素
aria-label属性(ARIA Roleによっては無効なので注意)aria-labelledby属性(ARIA Roleによっては無効なので注意)
- 背景画像など場合
- 内包するVisibilityHiddenな要素
- 疑似要素
contentプロパティcontentプロパティの代替テキスト値
制作時の注意点
[WIP]書きかけ