WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Adding a label to search box

for

From: Jon Gunderson
Date: Apr 11, 2006 2:10PM

I am not sure that the CSS hidding technique should be
considered an "ugly hack". If someone disables CSS to apply
like their own high contrast stylesheet it is nice to have the
form controls labeled.

Jon


---- Original message ----
>Date: Tue, 11 Apr 2006 12:00:30 -0700
>From: "Kynn Bartlett" < <EMAIL REMOVED> >
>Subject: Re: [WebAIM] Adding a label to search box
>To: "WebAIM Discussion List" < <EMAIL REMOVED> >
>
>Aha! Here we go:
>
><form>
> <input type="text" id="searchbox">
> <label for="searchbox">
> <button type="submit">
> Search
> </button>
> </label>
></form>
>
>There we go. <label> can contain <button> (a form control).
The rules
>for "what is being labeled?" say that if there's a for
attribute, that
>is used, and if not, then it labels the content. So in this
case, the
><label> doesn't label its content, but labels the searchbox.
(There's
>a possible problem with accesskey and focus on this, though.
But the
>accesskey spec is really broken anyway.)
>
>Anyway, this probably won't do anything useful in browsers
and
>screenreaders, since nobody but me writes code like this. The
whole
>"hiding it with CSS off the page" thing probably works, but
it's a
>ugly hack. I say just make the label visible, myself. Why you
wanna
>hide the label?
>
>--Kynn
>
>--
>Kynn Bartlett < <EMAIL REMOVED> >
>Writer, Web Developer, Photographer, Game Designer
>Tucson, Arizona
>http://kynn.com
>
>
>


Jon Gunderson, Ph.D.
Director of IT Accessibility Services
Campus Information Technologies and Educational Services (CITES)
and
Coordinator of Assistive Communication and Information Technology
Disability Resources and Education Services (DRES)

Voice: (217) 244-5870
Fax: (217) 333-0248
Cell: (217) 714-6313

E-mail: <EMAIL REMOVED>

WWW: http://cita.rehab.uiuc.edu/
WWW: https://netfiles.uiuc.edu/jongund/www/