468,301 Members | 1,524 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,301 developers. It's quick & easy.

Label outside of form

Is this correct usage of <label>?:

<h5><label for="sp-q"><img src="search.png" alt="Search"></label></h5>
<form method="get" action="http://search.atomz.com/search/">
<div>
<input name="sp-q" id="sp-q">
<input type="submit" value="Search this site">

[...]

</div>
</form>

The accessibility checker cynthiasays.com doesn't accept this as
correct, Nick's Accessibility Valet doesn't complain.

--
Spartanicus
Jul 20 '05 #1
2 4455
Spartanicus <me@privacy.net> writes:
Is this correct usage of <label>?:
Aside: I'm impressed if it's correct use of <h5> - what document are
you doing that has that many heading levels?
<h5><label for="sp-q"><img src="search.png" alt="Search"></label></h5>
<form method="get" action="http://search.atomz.com/search/">
<div>
<input name="sp-q" id="sp-q">
<input type="submit" value="Search this site">

[...]

</div>
</form>

The accessibility checker cynthiasays.com doesn't accept this as
correct, Nick's Accessibility Valet doesn't complain.


I think that's probably okay, at least as far as use of <label>
goes. In practical terms, try using a modern browser and clicking on
the image - see if it focuses the input.

I'd be tempted to put the <h5> inside the <form> and possibly inside
the <div>, too.

Obviously you'll need to make sure that the image is accessible
(sensibly large font size, good colour contrast, etc).

--
Chris
Jul 20 '05 #2

"Spartanicus" <me@privacy.net> wrote in message
news:qf********************************@news.spart anicus.utvinternet.ie...
Is this correct usage of <label>?:

<h5><label for="sp-q"><img src="search.png" alt="Search"></label></h5>
<form method="get" action="http://search.atomz.com/search/">
<div>
<input name="sp-q" id="sp-q">
<input type="submit" value="Search this site">

[...]

</div>
</form>

The accessibility checker cynthiasays.com doesn't accept this as
correct, Nick's Accessibility Valet doesn't complain.


In terms of valid HTML, the LABEL element can go anywhere any form control
can go except inside another LABEL. This means, in turn, that it can go
anywhere *any* inline code can go except inside a BUTTON.

I don't see anything in the spec that requires the LABEL to be physically
inside the form that contains the control to which it applies. Since it's
not a control--it doesn't have a value that gets posted with the form--I
expect that it doesn't matter. But I suggest checking out what a few
browsers actually do in such a case.

Jul 20 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

5 posts views Thread by Sambo | last post: by
1 post views Thread by Mark Denardo | last post: by
1 post views Thread by rn5a | last post: by
1 post views Thread by Manoj Mittal | last post: by
reply views Thread by NPC403 | last post: by
reply views Thread by Teichintx | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.