WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Forms, fieldset

for

Number of posts in this thread: 9 (In chronological order)

From: Ranti Junus
Date: Thu, Jun 11 2009 6:50PM
Subject: Forms, fieldset
No previous message | Next message →

Hello All,

I was given a task to assess forms accessibility. There's a
particular form that floored me:
http://staff.lib.msu.edu/junus/form11.html (the actual form is still
located on a closed test server so I copied the code and created the
page here.)

I can understand why the designer wants to group some fields together
with the <fieldset> tag, but I think it's OK to use <div> instead.

For this particular form, I'm struggling to figure out how to make the
"Date and Time Requested" part accessible. From the designer's point
of view, the "1st choice", "2nd choice", and 3rd choice" dates need to
be grouped together. However, each choice has its own set of date,
from:, and to:, and each set has three form elements. It's my
understanding that we cannot do nested <fieldset>.

So, the obvious question is: what do we need to do so this particular
section makes sense when it's read by a screen reader? The more I
look into this, the bigger my headache.

Thank you in advance for any pointers/advice/suggestions that you can share.


thanks,
ranti.

--
Bulk mail. Postage paid.

From: Patrick H. Lauke
Date: Thu, Jun 11 2009 7:50PM
Subject: Re: Forms, fieldset
← Previous message | Next message →

Ranti Junus wrote:
> It's my
> understanding that we cannot do nested <fieldset>.

Do you mean "we can't do it with our current systems/CMS" or "it's not
allowed in the html standard". If it's the latter, I'm pretty sure that
it *is* allowed.

P
--
Patrick H. Lauke

From: Dean Hamack
Date: Thu, Jun 11 2009 9:40PM
Subject: Re: Forms, fieldset
← Previous message | Next message →

Not sure if it causes accessibility problems, but it is definitely valid
nested fieldsets are definitely valid.

From: Ranti Junus
Date: Thu, Jun 11 2009 11:50PM
Subject: Re: Forms, fieldset
← Previous message | Next message →

I guess I was under a mistaken impression that nested fieldset was not valid.
I think working on that form would be easier than I anticipated. I'll
see what we can do to tackle this one.

Thank you so much for your help!


ranti.

--
Bulk mail. Postage paid.

From: Kevin White
Date: Fri, Jun 12 2009 2:00AM
Subject: Re: Forms, fieldset
← Previous message | Next message →

Hi,

You might also want to consider changing the <h4> elements to be
<legend>s, e.g. 'Library Instruction Session Information'. Perhaps as
well having something other than just <strong> elements to indicate
required fields.

Not sure if there has been discussion regarding date entry but you
might want to consider something like:

<fieldset>
<legend>Library Instruction Session Information</legend>
<p>Please select a time for your library instruction session</p>

<fieldset>
<legend>First choice of session time</legend>
<label for="first-date">Date (DD-MM-YYYY)</label>
<input id="first-date" name="first-date" type="text" />
<label for="first-time">Time (HH:MM)</label>
<input id="first-time" name="first-time" type="text" />
</fieldset>

etc...
</fieldset>

I was curious about the need for an end time. Would users know that
they need more than 50 mins? Or would this time include the special
areas of emphasis only. If so, is there a need for users to work out
how much time they need or would you be as well simplifying the form
and having the system work out what they end-time is based on their
choices. From an accessibility perspective this solution makes a wee
bit more sense as users have to fill in the end-time before they
select the special areas of emphasis, so they may not be aware of the
time requirements when they fill in the end-time.

Just some thoughts,

Kevin


On 12 Jun 2009, at 06:48, Ranti Junus wrote:

> I guess I was under a mistaken impression that nested fieldset was
> not valid.
> I think working on that form would be easier than I anticipated. I'll
> see what we can do to tackle this one.
>
> Thank you so much for your help!
>
>
> ranti.
>
> --
> Bulk mail. Postage paid.
>

From: Caleb Tang
Date: Fri, Jun 12 2009 3:55AM
Subject: Re: Forms, fieldset
← Previous message | Next message →

Hi,

While it is ok to have nested fieldset, it is important not to overuse
fieldset. It is good practice to use fieldset to group related form elements
and nested fieldset is fine to use.

Just something to bare in mind from screen reader perspective. Only the last
fieldset will be announced by screen reader.

<fieldset>
<legend>Personal Information</legend>
<label for="first">First Name</label><input type="text" id="first"
name="first" /><br/>
<label for="last">Last Name</label><input type="text" id="last"
name="last" /><br/>

<fieldset>
<legend>Gender</legend>
<input id="gender" name="gender" type="radio" value="male"/><label
for="gender">Male</label><br/>
<input id="gender" name="gender" type="radio" value="female"/><label
for="gender">Female</label>
</fieldset>

<label for="phone">Phone</label><input type="text" id="phone"
name="phone"/>

</fieldset>

Screen reader will announce "Personal Information" legend for First name and
Last name. "Gender" legend will be announce for Male and Female.

Unfortunately "Gender" will be announce for Phone because Gender is the last
fieldset seen by screen reader.

So if there a need for nested fieldset, treat the outer fieldset as
container that only hold fieldsets rather than form elements.

Note: This is tested on JAWS

Hope this help

Caleb Tang,
Accessibility & Usability Consultant



On 12/06/2009 08:58, "Kevin White" < = EMAIL ADDRESS REMOVED = > wrote:

> Hi,
>
> You might also want to consider changing the <h4> elements to be
> <legend>s, e.g. 'Library Instruction Session Information'. Perhaps as
> well having something other than just <strong> elements to indicate
> required fields.
>
> Not sure if there has been discussion regarding date entry but you
> might want to consider something like:
>
> <fieldset>
> <legend>Library Instruction Session Information</legend>
> <p>Please select a time for your library instruction session</p>
>
> <fieldset>
> <legend>First choice of session time</legend>
> <label for="first-date">Date (DD-MM-YYYY)</label>
> <input id="first-date" name="first-date" type="text" />
> <label for="first-time">Time (HH:MM)</label>
> <input id="first-time" name="first-time" type="text" />
> </fieldset>
>
> etc...
> </fieldset>
>
> I was curious about the need for an end time. Would users know that
> they need more than 50 mins? Or would this time include the special
> areas of emphasis only. If so, is there a need for users to work out
> how much time they need or would you be as well simplifying the form
> and having the system work out what they end-time is based on their
> choices. From an accessibility perspective this solution makes a wee
> bit more sense as users have to fill in the end-time before they
> select the special areas of emphasis, so they may not be aware of the
> time requirements when they fill in the end-time.
>
> Just some thoughts,
>
> Kevin
>
>
> On 12 Jun 2009, at 06:48, Ranti Junus wrote:
>
>> I guess I was under a mistaken impression that nested fieldset was
>> not valid.
>> I think working on that form would be easier than I anticipated. I'll
>> see what we can do to tackle this one.
>>
>> Thank you so much for your help!
>>
>>
>> ranti.
>>
>> --
>> Bulk mail. Postage paid.
>>

From: Ranti Junus
Date: Tue, Jun 16 2009 6:05AM
Subject: Re: Forms, fieldset
← Previous message | Next message →

Hello All,

Thank you again for the help and suggestions.

Tips from Caleb on how a screen reader (in this case, JAWS) would read
fieldset is very helpful. Thanks! This also makes me wonder if there's
a "what a screen reader would do" cheat sheet somewhere that shows
similar information for different parts of a web page.

Kevin also points out about using legend properly instead of h4, and
the bolded required information could be changed into something more
useful for screen reader users. More over, the form could be made
simpler with clearer instruction.

I believe the 50 minutes time that Kevin inquired is due to how long a
typical 1-hour course class. The instructors tend to use their own
class schedule for the library instruction. Upon looking into it
again, the logic of the form seems not really intuitive, indeed. I'll
communicate this to the designer. Thanks for pointing it out.

Thanks again. I'll see what I can do on this particular form.


ranti.


--
Bulk mail. Postage paid.

From: Bryan, Stephanie
Date: Fri, Jul 24 2009 11:25AM
Subject: Re: Forms, fieldset
← Previous message | Next message →

Sorry, little late getting in on this, quick question though. Do you
all think it's important to group your "submit" and "reset" buttons in a
fieldset with a legend? Or is it just redundant information? I am
under the impression that the submit buttons do not need labels either,
correct?



Thanks!

Steph





From: = EMAIL ADDRESS REMOVED =
[mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Caleb Tang
Sent: Friday, June 12, 2009 4:54 AM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Forms, fieldset



This message has been archived. Click on the archive banner at the top
of this message to open this item. If you are a Mac or Entourage User
click here to view the original item.
<http://evsvma3/EnterpriseVault/ViewMessage.asp?VaultId=170CAC3212F3D374
4813C818D8C1EBCC21110000MOEVSite&SavesetId=835000000000000~2009061209533
20000~0~03249B845BA94FF6A146F58509FA0D5>

Hi,

While it is ok to have nested fieldset, it is important not to overuse
fieldset. It is good practice to use fieldset to group related form
elements
and nested fieldset is fine to use.

Just something to bare in mind from screen reader perspective. Only the
last
fieldset will be announced

From: Dean Hamack
Date: Fri, Jul 24 2009 12:00PM
Subject: Re: Forms, fieldset
← Previous message | No next message

Yes, that is redundant, and I have never seen it done.

And you are correct that buttons do not need labels.


On 7/24/09 10:23 AM, "Bryan, Stephanie" < = EMAIL ADDRESS REMOVED = > wrote:

> Sorry, little late getting in on this, quick question though. Do you
> all think it's important to group your "submit" and "reset" buttons in a
> fieldset with a legend? Or is it just redundant information? I am
> under the impression that the submit buttons do not need labels either,
> correct?
>
>
>
> Thanks!
>
> Steph