[whatwg] How not to fix HTML
Lachlan Hunt
lachlan.hunt at lachy.id.au
Mon Oct 30 20:04:16 PST 2006
Ian Hickson wrote:
> Joe Clark wrote:
>> http://blog.fawny.org/2006/10/28/tbl-html/
FYI, my response to that his here.
http://lachy.id.au/log/2006/10/fixing-html
>> * Allow multiple uses of the same id/label in a form and suddenly it
>> becomes possible to mark up multiple-choice questionnaires accessibly.
>
> Could you elaborate on this? I'm not sure how this would work with the
> DOM, but I'm sure there's a way of addressing the use case you have in
> mind.
I believe the issue is with the way screen readers handle existing
forms. The problem is that each radio button or checkbox has it's own
label, but the whole group is often associated with a single question
and there is no way mark that up.
e.g.
<p>Gender:
<label for="m"><input type="radio" id="m" name="gender" value="m">
Male</label>
<label for="f"><input type="radio" id="f" name="gender" value="f">
Female</label>
</p>
In this case, when screen readers are in forms mode and the user is
tabbing between form controls, it will only read out "Male" and
"Female", it won't read out "Gender:".
In this specific case, that's probably not a major issue because male
and female are fairly self explanitory, but there are many cases where
it's not.
There are workarounds using fieldset and legend for the question, like this.
<fieldset>
<legend>Gender:</legend>
<label for="m"><input type="radio" id="m" name="gender" value="m">
Male</label>
<label for="f"><input type="radio" id="f" name="gender" value="f">
Female</label>
</fieldset>
Because of the way screen readers work, they now read out "Gender: Male"
and "Gender: Female" as they tab to each control.
This example demonstrates this technique.
http://www.alistapart.com/d/prettyaccessibleforms/example_3/
The problem with that technique is that, because of the way legends are
rendered in browsers, styling is somewhat restricted.
There are a few possible ways to address this that I have thought of.
1. Allow labels to be associated with a group of form controls
by referring to the control name.
<p><label group="gender">Gender:</label>
<label for="m"><input type="radio" id="m" name="gender" value="m"
info="gender"> Male</label>
<label for="f"><input type="radio" id="f" name="gender" value="f"
info="gender"> Female</label>
</p>
(I know the for attributes aren't technically required here, but due to
current screen reader limitations, they are)
2. Allow labels to be associated with multiple controls, using a
space separated list of IDREFs (like the headers attribute in
tables).
<p><label for="m f">Gender:</label>
<label for="m"><input type="radio" id="m" name="gender" value="m"
info="gender"> Male</label>
<label for="f"><input type="radio" id="f" name="gender" value="f"
info="gender"> Female</label>
</p>
3. Allow form controls to refer to additional labels.
<p><span id="gender">Gender:</span>
<label for="m"><input type="radio" id="m" name="gender" value="m"
info="gender"> Male</label>
<label for="f"><input type="radio" id="f" name="gender" value="f"
info="gender"> Female</label>
</p>
4. Same as #3, but allow the link from the label elements instead.
<p><span id="gender">Gender:</span>
<label for="m" info="gender"><input type="radio" id="m" name="gender"
value="m"> Male</label>
<label for="f" info="gender"><input type="radio" id="f" name="gender"
value="f"> Female</label>
</p>
I think #1 is the best of these options because it's more convenient to
type a single name, than multiple IDs. Plus, if a new control gets
added to the group, it's implicitly associated without having to update
the for attribute with the new ID. I don't particularly like #3 and #4,
but they were my first thoughts, so I listed them anyway.
> Start a Working Group For Web Accessibility, independent from the W3C, and
> write an alternative to WCAG2. In about 2 years, if the work you've done
> starts getting more traction than the W3C's work, then you'll get their
> attention and then they'll start fixing the WCAG work.
Joe has already decided to take a similar approach with his WCAG
Samurai. However, he's keeping it top secret. There's virtually no
information about it and no way to participate or even keep track of the
work without an invitation.
http://alistapart.com/articles/tohellwithwcag2/#WCAG-documents:WCAGSamurai
http://wcagsamurai.org/
--
Lachlan Hunt
http://lachy.id.au/
More information about the whatwg
mailing list