WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: using image as label for radio and checkbox


From: Chris Heilmann
Date: Mar 22, 2005 5:22AM

> During the website implementation, I am facing a problem with the
> clickable
> image label for radio button.
> To make it easier for the user to select radio button or checkboxes, we
> can
> use text label by making the whole of the associated text label clickable.
> That works fine for all browsers.
> But we would like to just display small image as label and hide text label
> for
> each radio button. The problem is: the image label is only clickable in
> Mozilla based browsers but not in IE6, do you have any good non-javascript
> solutions?

Yes - don't use an image. The idea of a label is not only that you can
click it to activate the radio button, it also should resize when you
resize your font in the browser. If you replace the text label with an
image, no matter what technique, you take that away from the user. In
essence, you use a label to give the user a larger clickable area and then
you take it away again.

Chris Heilmann
Blog: http://www.wait-till-i.com
Writing: http://icant.co.uk/
Binaries: http://www.onlinetools.org/