WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Making forms accessible with the <label> element

for

From: Andrew Kirkpatrick
Date: Sep 26, 2001 10:15AM

Users are expected to enter comments in a box, and the word comment doesn't
appear anywhere on the page? If the word "comment" appears anywhere on the
screen (even within 'comments") you can put the label tag around it and it
will associate with the control.
For example:
<p>Thanks for offering to provide <label
for="commentfield">comment</label>s! Use the box below to enter your
thoughts.</p>
<form><textarea id="commentfield" name="comments" ...></form>

Alternatively, you could put the label in an invisible layer (in a div at
the end of the html body). That way, even if someone turned styles off, the
extra text would be less of an issue.
Andrew
On 9/26/01 11:43 AM, Mark Rew ( <EMAIL REMOVED> ) wrote:
> Group,
>
> I'm trying to provide descriptive text to edit fields within a html form for a
> screen reader to read without adding text to the screen.
>
> I used the <label> element to provide text that my screen reader can
> understand to a <textarea> element within a form.
>
> <LABEL> FOR="COMMENTFIELD">Comment: </LABEL>
> <TEXTAREA ID="COMMENTFIELD" NAME="COMMENTS" ...>
>
> This works, I can hear the word "comment: " before the text area where I'm to
> enter my comments.
>
> My Customer wants to know is there a way of allowing the label to be available
> to my screen reader, without the label appearing on the screen? The label
> text on the screen effects the layout of the page. There is not room within
> the layout table cell for the exrra text.
>
> A second accessible solution we found is to put the words in the value> attrribute of an <input> element that tells the screen reader user what the
> edit field is for. For example:
> <input type="text" name="pands" size="15" maxlength="30" VALUE="search by city
> or zipcode">
>
>
> But, the text in the value attribute appears on the screen. So, I tried:
> <input type="text" name="pands" size="15" maxlength="30" ALT="search by city
> or zipcode" value=" ">
>
> But, my screen reader is not saying the alt= attribute. Does anyone have a
> solution that will allow a screen reader to have some type of descriptive text
> to either an <input> or <textarea> element without adding information to the
> visual screen?
>
> thanks
> Mark Rew
>
>
>
--
Andrew Kirkpatrick, Technical Project Coordinator
CPB/WGBH National Center for Accessible Media
125 Western Ave.
Boston, MA 02134
E-mail: <EMAIL REMOVED>
Web site: ncam.wgbh.org
617-300-4420 (direct voice/FAX)
617-300-3400 (main NCAM)
617-300-2489 (TTY)
WGBH enriches people's lives through programs and services that educate,
inspire, and entertain, fostering citizenship and culture, the joy of
learning, and the power of diverse perspectives.