Fog Creek Software
Discussion Board




HTML <label>  Tag

So recently  I ran across this somewhere.  Why are more developers  not use this tag?  You can make the clickable zone for a radio or check box much bigger (essentially including the text as a clickable reigon for the input object)

Are there any good reasons not to use this?  For such a simple item  it really makes forms more user friendly, esp when coupled with:  label { cursor: pointer; } in your CSS.

Christopher Hester
Friday, July 04, 2003

I always wondered how they did that, but never bothered looking it up. It is a useful feature and makes your HTML more like regular windows apps.

www.marktaw.com
Friday, July 04, 2003

"Are there any good reasons not to use this?" -- no, it's just ignorance methinks -- <label> is recognised by Mozilla as well as IE. I too wish more people would use it.

Duncan Smart
Friday, July 04, 2003

<LEGEND> is an HTML 4 tag that I think people don't know about because they're still stuck on HTML 3.2 transitional.

Another useful tag that developers miss out on: <fieldset> and <legend>.

Get a designer to write you a nice CSS file, and your developers can design user interfaces that look clean (even if they may not be overly usable).

Ed
Friday, July 04, 2003

I started using both the label tag and accesskey tag for internal webs where I work, even back in the version 4 browser days when Netscape 4 didn't support it. I have tried to encourage its use in my small circle of influence, especially now that it is supported by more browsers.

If you start using the accesskey tag, use number keys, not letters - accesskeys are accessed using the Alt key and the character that you select, but browsers are already using most of the Alt+letter combinations for browser functions.

Philip Dickerson
Friday, July 04, 2003

Using accesskey; how do you let the user know that is available? 

These tags really help HTML rendered forms.

Christopher Hester
Saturday, July 05, 2003

Ed,

"Get a designer to write you a nice CSS file"

please any suggestion of any product in this area?

Guillermo
Saturday, July 05, 2003

My suggestions for writing better semantic HTML and using CSS more effectively:

* Browse the element reference for the HTML spec at the W3 website - http://www.w3.org/TR/html401/index/elements.html - this is how I came across genuinely useful and meaningful elements like <label> and <fieldset>.

* Use TopStyle - http://www.bradsoft.com. I was always a fan of TopStyle Lite, I'm not sure if there is a Lite (freeware) version of the current release since I decided to pay my debt of gratitude to Bradsoft and buy a licensed copy.

* Read A List Apart - http://www.alistapart.com/.

Walter Rumsby
Sunday, July 06, 2003

That should be:

http://www.bradsoft.com/

and

http://www.alistapart.com/

Walter Rumsby
Sunday, July 06, 2003

I find the accesskey label to be rather useless, myself.

Even assuming I know what the accesskeys for a site are, pressing "ALT" instead of "CTRL" is very difficult and unnatural for me.  And in IE, I have to also hit enter. 

For me, thee mouse is quite a bit faster and easier.

Most non-experts that I have observed in usability tests have no concept of keyboard shortcuts. They tend to use the mouse for everything, even though they find mousing control challenging.

And if I had more limited mobility than I do now, trying to hit three keys at the same time, one of which is in an awkward spot wouldn't be doable.

Now, if we could access the arrow keys, or override the CTRL-x functions - that would be useful.

Phibian
Sunday, July 06, 2003

Thanks for the tip, CH. I first noticed this behavior in PHPMyAdmin but that app is so JS/CSS-heavy I never thought it might be a plain ol' HTML feature. I did discover fieldset/legend a while back, used Safari's bug buttom to complain when the last two betas didn't support it, and now it's in 1.0! Makes forms much, much nicer. It's 5 years old ( http://www.w3.org/TR/1998/REC-html40-19980424/ ) and, with Safari, supported in every reasonably modern browser, AFAIK. Good example: http://www.w3schools.com/html/tryit.asp?filename=tryhtml_legend

brian
Thursday, July 10, 2003

Christopher -

"Using accesskey; how do you let the user know that is available?"

You write an accessibility statement. There are some standards, such as "4" for search and "9" for feedback. See http://www.diveintoaccessibility.org

John Topley (www.johntopley.com)
Friday, July 11, 2003

The label element helps people who use screen reader software (i.e. blind or partially-blind users) immensely.  The leading screen reading software (WindowEyes and JAWs) do a reasonable job of figuring out which text goes with which form element while navigating forms, but they inevitably make mistakes when your forms have any complexity at all.

If you use the label element, screen reader software always know how to identify form elements to the end user when each element gets the focus.  This is, of course, part of the point when accessibility standards direct us to use the tag, but it really hit home for me when I sat with a blind coworker trying to navigate the order forms while our website was undergoing reconstruction.  www.nbp.org

Ethan Rowe
Wednesday, February 18, 2004

*  Recent Topics

*  Fog Creek Home