Difference between revisions of "MikeS aria-label"

From Level Access Web Labs
Jump to navigation Jump to search
 
(5 intermediate revisions by the same user not shown)
Line 2: Line 2:
 
<body>
 
<body>
  
<h3>aria-label variants</h3>
+
<h2>aria-label variants</h2>
  
 
<a aria-label="this image link has aria-label and enclosed image has alt text that is different. this is the aria-label." href="#">
 
<a aria-label="this image link has aria-label and enclosed image has alt text that is different. this is the aria-label." href="#">
Line 14: Line 14:
 
<a href="#">Standard text link as control</a>
 
<a href="#">Standard text link as control</a>
 
<br><br>
 
<br><br>
<a href="#"><img alt="this is a standard image link with image alt text as control" src="https://www.levelaccess.com/wp-content/uploads/2017/04/logo.png"></a>
+
<a href="#"><img alt="standard image link as control. there is no aria-label. this is the image alt text" src="https://www.levelaccess.com/wp-content/uploads/2017/04/logo.png"></a>
 
 
<h3>Testing results</h3>
 
JAWS 2018
 
VoiceOver 11.4.1
 
 
 
  
 +
<h2>Testing results</h2>
 +
<ul>
 +
<li>JAWS 2018: For image links, JAWS reads the aria-label of the link tag if you Tab to it. But it reads the enclosed image alt text instead of the aria-label if you arrow to the link. For text links or image links with null alt text, JAWS reads the aria-label whether you Tab OR arrow to it.</li>
 +
<li>VoiceOver 11.4.1:  reads the aria-label when it is available, overriding either inner text or enclosed image alt text.
 +
</li>
 +
<li>TalkBack
 +
</li>
 +
<li>NVDA 2018.x
 +
</li>
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 00:01, 19 October 2018

aria-label variants

this is image alt text being read despite the aria-label in the link tag

Olallieberry



Standard text link as control

standard image link as control. there is no aria-label. this is the image alt text

Testing results

  • JAWS 2018: For image links, JAWS reads the aria-label of the link tag if you Tab to it. But it reads the enclosed image alt text instead of the aria-label if you arrow to the link. For text links or image links with null alt text, JAWS reads the aria-label whether you Tab OR arrow to it.
  • VoiceOver 11.4.1: reads the aria-label when it is available, overriding either inner text or enclosed image alt text.
  • TalkBack
  • NVDA 2018.x