Difference between revisions of "ARIA Describedby property"

From Level Access Web Labs
Jump to navigation Jump to search
 
(9 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">This is my page</p>
+
<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>
  
<select id="test" aria-labelledby="para pre" aria-describedby="post">
+
<div>
  <option>male</option>
+
  <a aria-describedby="p1" href="http://www.ssbbartgroup.com"> Level Access </a>
   <option>female</option>
+
   <p id="p1">Accessibility onDemand</p>
</select>
+
</div>
  
<label id="post">post</label>
+
<p id="b1">Associated text</p>
 
+
<button aria-describedby="b1">
<a aria-describedby="p1" href="http://www.ssbbartgroup.com"> SSB </a>
+
Test
<p id="p1">Accessibility Solutions</p>
+
</button>
  
 
</form>
 
</form>
Line 26: Line 35:
 
==Screen Reader Support==
 
==Screen Reader Support==
 
* JAWS 18 (Chrome, IE, FF) - announced on tab after pause.  Not announced with arrows.
 
* JAWS 18 (Chrome, IE, FF) - announced on tab after pause.  Not announced with arrows.
* NVDA 2017.3 (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.

Labelledby Describedby Bug

Accessibility training

Level Access

Accessibility onDemand

Associated text

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.