Accessible Name and Description Computation Playground
アクセシブルな名前および説明がどう計算されるかをテストするためのページです。
スクリーンリーダによって呼び上げ内容に違いがあります。実際にスクリーンリーダにテキストフィールドを読ませて、どのように読み上げが変化するかを確認してみましょう。
スクリーンリーダの例:
- Narrator (for Windows)
- NVDA (for Windows)
- VoiceOver (for macOS)
- VoiceOver (for iPadOS)
- VoiceOver (for iOS)
- TalkBack (for Android)
フラグ
💡Note
アクセシブルな名前の計算方法は、Accessible Name and Description Computation(日本語訳)にて定義されています。
aria-description
属性はWAI-ARIA 1.3に含まれる仕様ですが、2024年1月現在このドキュメントはEditor's Draftです。
結果のレンダリングとHTML※
- info「常にすべてを1つのp要素に含める」がONになっています。このフラグはラベル、説明文の出力位置などに影響します。
説明文A
Hint:全選択ショートカットキーまたはマウスクリックでHTML断片を全選択できます。
- ※出力されるHTMLコードに、実際には不要な
span
タグが含まれる場合があります - ※問題が検出された際にログが出力されますが、INFO含め指摘ログがない状態を推奨します。なお、表示されるログのレベルは作者の主観によって決定されています。