WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Are fieldset and legend still relevant?

for

From: Birkir R. Gunnarsson
Date: Dec 30, 2014 5:14AM

Hi Lynn

It depends how you construct the aria-label I would say.
The relevant pieces of info user needs to ahve access to are the
labels for the individual fields as well as the common label for the
group of fields.
How would you code a gender radiobutton set for instance?
User would want to hear
"gender male"
"gender female"
or at least hear the word "gender" on the first radiobutton, the one
that has focus, right?
Generally I would recommend fieldset with legend "gender" and two
radiobuttons labeled "male" and "female".
If for whatever reason that is not possible I would just construct an
aria group.
<div role="group" aria-labelledby="gender">
<h3 id="gender">Gender</h3>
<label for "gm">Male</label>
<input type="radio" name="rbgender" id="gm">
<label for "gm=f">Female</label>
<input type="radio" name="rbgender" id="gf">
</div>

You could construct an aria-label and add the legend text to one or
more of the radiobuttons.
It would communicate the same info.
The risk with aria-labels in general is that they are invisible and I
often see developers being sloppy and making typos that do not get
caught by their QA teams.

I think the Jaws setting is honestly a bit weird.
Users can be extra super power users with Jaws, but they still cannot
guess what a common legend for a fieldset or a tooltip is on a page
(aria-describedby values are not read by Jaws with verbosity set to
"advanced").
The verbosity setting is not even set for the browser specifically, it
is the global setting.
I think FS should fix this.
I digress. ;)
In short, yes, fieldset/legends are still important to me, though
there are ways one could work around it and code the legend into the
labels.
Cheers

On 12/30/14, Lynn Holdsworth < <EMAIL REMOVED> > wrote:
> Hi all,
>
> I'm just going through WebAIM's invaluable list of checkpoints, and
> found this one under 1.3.1: Info and relationships:
>
> * Text labels are associated with form input elements. Related form
> elements are grouped with fieldset/legend.
>
> Rather than using fieldset and legend to group form elements, for a
> while now I've been using CSS and ARIA labels.
>
> Fieldsets were always pretty flaky with screenreaders. I have my JAWS
> setting set to advanced, and so legends don't get read out as I tab
> through the elements inside a fieldset. But ARIA labels do. And they
> get read out in the order that the developer deems most sensible.
>
> If I use both legends and ARIA labels, some users must listen to the
> labels twice, sometimes once before and once after the info about the
> element with focus, which could get pretty confusing for beginners.
>
> I'd love to hear your thoughts on this one.
>
> Cheers, Lynn
> > > >


--
Work hard. Have fun. Make history.