WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: labeling search box

for

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

From: Wendy R. Mullin
Date: Thu, Jul 10 2003 8:50AM
Subject: labeling search box
No previous message | Next message →

Hi -

We recently redesigned our home page, http://www.sc.edu/. Upon running the
home page through some accessibility checkers (WAVE, Bobby), I received an
error message that the search box on our home page did not have a label
element. I haven't worked with forms much, and I'm not quite sure how to
place the label tag properly in the code, which is as follows:

<form action="http://www.sc.edu:8765/query.html" method="get"
style="margin-bottom:0;">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td><input type="text" size="15" name="qt" value="SEARCH" onfocus="if
(this.value && this.value == 'SEARCH') this.value = ''; else
this.select();" class="searchInput"></td>
<td><img src="/usc/images/dot_clear.gif" width="5" height="1" alt=""><input
type="image" src="/template/images/search_arrow.gif" name="searchSubmit"
width="16" height="16" alt="Submit" border="0"><input type="hidden"
name="qp" value=""></td>
</tr>
</table>
</form>

Could anyone out there give me some suggestions?

Thanks in advance for your help.

Wendy


Wendy R. Mullin
Web Developer, University of South Carolina
1244 Blossom Street, Columbia, South Carolina 29208
voice: 803-777-6785 | fax: 803-777-4149
= EMAIL ADDRESS REMOVED = | http://isg.csd.sc.edu/~wmullin/


----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/


From: Jim Thatcher
Date: Thu, Jul 10 2003 9:07AM
Subject: RE: labeling search box
← Previous message | No next message

Wendy,

You have a label ("SEARCH" in the edit box); the tools just don't know it!
You could add title="search" for the INPUT with type="text" to be even more
specific; I don't think the current crop of tools will acknowledge that
either, but less sure about that.

Jim
508 Web Accessibility Tutorial http://jimthatcher.com/webcourse1.htm.
"Constructing Accessible Web Sites:" http://jimthatcher.com/news.htm