WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Are fieldset and legend still relevant?

for

From: Jonathan C. Cohn
Date: Jan 1, 2015 4:10PM

I finally got a chance to look at the examples you provided. In VoiceOver, the FieldSet appears as a Group box in both DOM and Group mode. One needs to interact/ stop interact with the FieldSet in order to change the radio buttons, so when one sees gender while navigating wit the VoiceOver cursor neither example one or example 2 will tell you what gender is selected until you interact with the FieldSet and examine the selected radio button. and if one clicks on goto Element commands it will first go to the Gender FieldSet box and then into the FieldSet to the Radio Buttons. So While tabbing will not read the gender information at least not in default verbosity, it does recognize that the FieldSet is a grouping and requires the VoiceOVer user to interact with the field set to edit any changes. I have actually found that this is a bit annoying in the VoiceOVer web implementation .



In JAWs 15, Advanced mode does not speak Group Box names, and since at least VoiceOver considers the FieldSet a group Box with the Legend being the GroupBox Name, it is not terribly surprising that advanced mode in JAWS does not speak the FieldSet legend. In any case when using the insert-tab I believe JAWS will speak the Group Box name even if it is not enabled to be spoken with default navigation. I therefore am declaring that JAWS not reading the FFieldSet in Advanced mode is a design decision and not a bug.

Jonathan Cohn
to the “Mail” radio button.
Best wishes,

Jonathan



On Dec 30, 2014, at 10:55, Lynn Holdsworth < <EMAIL REMOVED> > wrote:

> Hi Birkir,
>
> Example 3 has a fieldset/legend, some ARIA labels and an explicitly
> associated label. So you still get the box drawn around the group as
> well as the clickable labels.
>
> As regards the third drawback, I take your point there. Even if the
> labels are ordered in a way that causes the most important one to be
> spoken first, one must still wait until all labels are read out before
> being able to hear the type and state of the control. It's possible to
> customise JAWS and possibly other screenreaders to speak control type
> and state first, but most users are unlikely to know how to do this.
>
> Using a fieldset and legend seems to have the same drawback. I can't
> find a way using VoiceOver to read the legend, nor in JAWS to only
> read it once when an item in the group receives focus.
>
> So on balance I'd still propose that the combo in example 3 is the
> most comprehensive solution.
>
> Kind regards, Lynn
>
> On 30/12/2014, Birkir R. Gunnarsson < <EMAIL REMOVED> > wrote:
>> Hey guys
>>
>> Joy, well said.
>> For the examples, at a glance.
>> Yes, the labeling in examples 2 and 3 works, and I would pass it.
>> However it has three drawbacks.
>> - Using aria-labelledby rather than the html labeling decreases the
>> clickable area of the radiobuttons (for users with dexterity
>> impairments larger clickable area is always a plus). When using label
>> for user can click on the label and focus moves into its associated
>> radiobutton. With aria-labeling this does not happen.
>>
>> - Fielset/legend construct usually draws a visual box around the
>> legend and choices, which is good for users with cognitive
>> impairments. using ARIA group role does not do this, nor the aria
>> labeling, .. though the page designer can always create these types of
>> things using CSS anyway.
>>
>> - this set up will force screen readers to read legend for every
>> single radiobutton choice, which can get very annoying when the legend
>> is very wrong.
>> Using fieldset/legend or corresponding ARIA group role users can
>> customize, at least to some degree, how often they want to hear the
>> legend.
>> I only want to hear it once, when focus moves into the radiobuttons.
>> I have not looked at Survey Monkey lately, but it used to drive me
>> bananas, apples and pairs, to try and take their surveys, because the
>> bloody question (and instructions sometimes) was read out in its
>> entirety before the label of any radiobutton choice.
>> Again, I do not know what they used there, I would have to go back,
>> check, and hope they have replaced whatever structure they used.
>>
>>
>> So, again, your way is not wrong, I would not fail it, but it has some
>> drawbacks that I would point out if I were doing an accessibility
>> assessment of the page, at least best practice items to discuss, not
>> outright violations.
>> Note though that I only took a quick look, it is one of those crazy
>> days at work, so I have not had time to analyze the code in any depth.
>>
>> Cheers
>> -B
>>
>> On 12/30/14, Thomas McKeithan II < <EMAIL REMOVED> > wrote:
>>> I concur with Joy. We should determine conformance to the standards basd
>>> upon how the page is coded and not how a specific AT Tool behavors. For
>>> years I've advocated fot testing using AT Tools with the "out of the Box"
>>> settings rather than customizations.
>>>
>>> Respectfully,
>>> Thomas Lee McKeithan II
>>> QSSI
>>> http://www.qssinc.com
>>> 508 SME, SSQA Solutions Center
>>> 10480 Little Patuxent Pkwy , Suite 350
>>> Columbia , MD 21044
>>> (301 )977-7884 x1058 (Work)
>>> (202) 276-6437 (Cell)
>>>
>>>
>>> This electronic mail (including any attachments) may contain information
>>> that is privileged, confidential, and/or otherwise protected from
>>> disclosure
>>> to anyone other than its intended recipient(s). Any dissemination or use
>>> of
>>> this electronic email or its contents (including any attachments) by
>>> persons
>>> other than the intended recipient(s) is strictly prohibited. If you have
>>> received this message in error, please notify the sender by reply email
>>> and
>>> delete the original message (including any attachments) in its entirety.
>>>
>>>
>>> -----Original Message-----
>>> From: <EMAIL REMOVED>
>>> [mailto: <EMAIL REMOVED> ] On Behalf Of Lynn
>>> Holdsworth
>>> Sent: Tuesday, December 30, 2014 8:21 AM
>>> To: WebAIM Discussion List
>>> Subject: Re: [WebAIM] Are fieldset and legend still relevant?
>>>
>>> Hi Joy,
>>>
>>> Thanks for your comments and the good points you make.
>>>
>>> I believe the user is King and we should do everything possible to get as
>>> close to total inclusivity as we can.
>>>
>>> I take your point that it's frustrating to have to code for one group of
>>> users whose AT is set to a particular setting. But I would guess that a
>>> significant enough number of people are using JAWS with intermediate or
>>> advanced verbosity settings to make that bit of extra effort worthwhile.
>>>
>>> Does the WebAIM survey collect data on verbosity settings? If not it
>>> might
>>> be worth considering this for next year's survey.
>>>
>>> Thanks, Lynn
>>>
>>> On 30/12/2014, Lynn Holdsworth < <EMAIL REMOVED> > wrote:
>>>> Hi Birkir,
>>>>
>>>> Sorry, I should have made myself clearer. I'm not advocating using
>>>> invisible labels, but rather using ARIA-LABELLEDBY to associate a form
>>>> field with a piece of text that's visible somewhere appropriate on the
>>>> page.
>>>>
>>>> I've knocked up some examples. With JAWS 15 set to advanced verbosity,
>>>> the second and third examples work beautifully, while in the first the
>>>> "Gender" label is ignored.
>>>>
>>>> http://behindtheyellowline.org.uk/labelledby.htm
>>>>
>>>> (Excuse any validation errors - quick turn-around time and all that!)
>>>>
>>>> I'll try these with NVDA and VoiceOver when I get a moment, and may
>>>> create some more complex examples to illustrate what I'm trying to
>>>> achieve.
>>>>
>>>> But for now, would fieldset and legend alone cover WCAG2?
>>>>
>>>> Thanks, Lynn
>>>>
>>>> On 30/12/2014, Birkir R. Gunnarsson < <EMAIL REMOVED> > wrote:
>>>>> 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
>>>>>> >>>>>> >>>>>> list messages to <EMAIL REMOVED>
>>>>>>
>>>>>
>>>>>
>>>>> --
>>>>> Work hard. Have fun. Make history.
>>>>> >>>>> >>>>> list messages to <EMAIL REMOVED>
>>>>>
>>>>
>>> >>> >>> messages to <EMAIL REMOVED>
>>> >>> >>> >>>
>>
>>
>> --
>> Work hard. Have fun. Make history.
>> >> >> >>
> > >