Difference between revisions of "ARIA Describedby property"
Jump to navigation
Jump to search
Labelledby Describedby Bug
(Created page with "<html lang="en"> <head> <meta charset="utf-8"> <title>Labelledby Describedby Bug</title> </head> <body> <form method="post" action=""> <p id="para">This is my page</p> <labe...") |
|||
| (13 intermediate revisions by 2 users not shown) | |||
| Line 1: | Line 1: | ||
| + | This page uses the aria-describedby attribute on a combo box and a link. The aria-describedby attribute provides an accessible description for an element. The accessible description does not replace the accessible name but instead provides additional information to the user. | ||
| + | |||
<html lang="en"> | <html lang="en"> | ||
<head> | <head> | ||
| Line 6: | Line 8: | ||
<body> | <body> | ||
<form method="post" action=""> | <form method="post" action=""> | ||
| − | <p id="para"> | + | <p id="para">Accessibility training</p> |
| − | <label id="pre">pre</label> | + | <div> |
| + | <label id="pre">Options</label> | ||
| + | <select id="test" aria-labelledby="para pre" aria-describedby="post"> | ||
| + | <option>On-site</option> | ||
| + | <option>Online</option> | ||
| + | </select> | ||
| + | <label id="post">*Blended options also available</label> | ||
| + | </div> | ||
| + | <div> | ||
| + | <a aria-describedby="p1" href="http://www.ssbbartgroup.com"> Level Access </a> | ||
| + | <p id="p1">Accessibility onDemand</p> | ||
| + | </div> | ||
| − | < | + | <p id="b1">Associated text</p> |
| − | + | <button aria-describedby="b1"> | |
| − | + | Test | |
| − | </ | + | </button> |
| − | |||
</form> | </form> | ||
</body> | </body> | ||
</html> | </html> | ||
| + | ==Screen Reader Support== | ||
| + | * JAWS 18 (Chrome, IE, FF) - announced on tab after pause. Not announced with arrows. | ||
| + | * NVDA 2017.4 (Chrome, IE, FF) - announced on tab no pause. Not announced with arrows. | ||
| + | *VoiceOver iOS announces after the element with the description. There is no pause. | ||
| + | |||
| + | [[Category: ARIA]] | ||
Latest revision as of 16:11, 12 August 2020
This page uses the aria-describedby attribute on a combo box and a link. The aria-describedby attribute provides an accessible description for an element. The accessible description does not replace the accessible name but instead provides additional information to the user.
Screen Reader Support
- JAWS 18 (Chrome, IE, FF) - announced on tab after pause. Not announced with arrows.
- NVDA 2017.4 (Chrome, IE, FF) - announced on tab no pause. Not announced with arrows.
- VoiceOver iOS announces after the element with the description. There is no pause.
