RE: Form Labels and Accessibility

Wendee,

Not sure if this is the right list or not, but I develop and I think the
technique is just fine. Make sure the design is very obvious that the
two are grouped otherwise it is better usability to have it.

 

James J. Golden

________________________________

From: w3c-wai-ig-request@w3.org [mailto:w3c-wai-ig-request@w3.org] On
Behalf Of Wendee Fiorillo
Sent: Tuesday, May 29, 2007 11:26 AM
To: w3c-wai-ig@w3.org
Subject: Form Labels and Accessibility

 

 

Hello,

First, hope I sent this to the correct group. If not, could you let me
know where to direct my question? Thanks.

And now my question. I am working on a few detailed forms and I am
wondering the best way to have a radio button followed by an input.
Below is what I currently have.

<label><input type="checkbox" name="referral" value="Newspaper" />
Newspaper</label>
<label><span class="hidden">Enter newspaper name</span> <input
type="text" size="30" name="newspaper_referral" /></label>


And for reference, the CSS for the class="hidden" is:
.hidden {text-indent: -999em;}

Essentially, using CSS I have the above visually grouped together and I
do not want the second label "Enter newspaper name" to be displayed in
most graphical web browsers that support current web standards (FF, IE,
Safari, etc.) so it displays as (radio button) Newspaper [text field]. I
have included the "Enter newspaper name" and is positioned off the
screen but is accessible to screen readers and other technologies that
do not support CSS. Is this method acceptable or is there a better
way/technique to achieve my goal?

Thanks,
Wendee