Difference between revisions of "Fieldset, Label, and Legend Elements"

From Level Access Web Labs
Jump to navigation Jump to search
Line 1: Line 1:
 
* JAWS 18+ only announces fieldset label when entering in Firefox and Chrome but in IE still announces for each tab stop in the fieldset. Doesn’t seem to announce fieldset for Edge.
 
* JAWS 18+ only announces fieldset label when entering in Firefox and Chrome but in IE still announces for each tab stop in the fieldset. Doesn’t seem to announce fieldset for Edge.
  
 +
==Fieldset with legend and inputs with aria-label==
 
<html>
 
<html>
−
<fieldset><legend>Phone number</legend>
+
<fieldset>
−
<input id="areaCode" name="areaCode" aria-label="Area Code"  
+
  <legend>Phone number</legend>
 +
  <input id="areaCode" name="areaCode" aria-label="Area Code"  
 
type="text" size="3" value="" >
 
type="text" size="3" value="" >
−
<input id="exchange" name="exchange" aria-label ="First three digits of phone number"  
+
  <input id="exchange" name="exchange" aria-label ="First three digits of phone number"  
 
type="text" size="3" value="" >
 
type="text" size="3" value="" >
−
<input id="lastDigits" name="lastDigits" aria-label ="Last four digits of phone number"  
+
  <input id="lastDigits" name="lastDigits" aria-label ="Last four digits of phone number"  
 
type="text" size="4" value="" >
 
type="text" size="4" value="" >
 
</fieldset>  
 
</fieldset>  
Line 48: Line 50:
 
</html>
 
</html>
  
 +
==Fieldset with legend and inputs with label==
 
<html>
 
<html>
 
<form>
 
<form>

Revision as of 13:57, 11 December 2018

  • JAWS 18+ only announces fieldset label when entering in Firefox and Chrome but in IE still announces for each tab stop in the fieldset. Doesn’t seem to announce fieldset for Edge.

Fieldset with legend and inputs with aria-label

Phone number

Shipping Address:

Fieldset with legend and inputs with label

Meal Selection:



Fieldset and Legend tag with H2 inside legend

Was this content helpful?



Fieldset with H2 and no legend

Was this content helpful?



Fieldset and Legend tag with H2 outside the legend

Was this content helpful?



Regular Fieldset and Legend tag

Was this content helpful?


Using ARIA Describedby instead of legend

Was this content helpful?



Using ARIA Describedby instead of legend and input type submit instead of button

Was this content helpful?



Using ARIA Labelledby instead of legend

Was this content helpful?



Using ARIA Label instead of legend

Was this content helpful?

What type of search would you like to perform?



radios

What type of search would you like to perform?


Using ARIA Labelledby and legend

Was this content helpful?



Using ARIA Label instead of legend

This is a legend

Was this content helpful?

Retrieved from "https://labs.levelaccess.com/index.php?title=Fieldset,_Label,_and_Legend_Elements&oldid=5758"