Difference between revisions of "MikeS aria-label"

From Level Access Web Labs
Jump to navigation Jump to search
 
(One intermediate revision 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 16: Line 16:
 
<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>
 
<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>
+
<h2>Testing results</h2>
JAWS 2018: For image links, JAWS reads the aria-label of the link tag if you Tab to it but reads the enclosed image alt text instead if you arrow to it. For text links or image links with null alt text, JAWS reads the aria-label whether you Tab OR arrow to it.
+
<ul>
<br>
+
<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>
VoiceOver 11.4.1:  reads the aria-label when it is available, overriding either inner text or enclosed image alt text.
+
<li>VoiceOver 11.4.1:  reads the aria-label when it is available, overriding either inner text or enclosed image alt text.
<br>
+
</li>
TalkBack  
+
<li>TalkBack  
<br>
+
</li>
NVDA 2018.x
+
<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