E-mail List Archives
Thread: proper use of labels
Number of posts in this thread: 16 (In chronological order)
From: Kevin.CTR.Spruill
Date: Mon, Jun 13 2005 10:40AM
Subject: proper use of labels
No previous message | Next message →
All,
Despite, or perhaps because of the recent list traffic re: use of labels -
I thought I'd throw this one on there also. Hopefully it wasn't covered
already. I repeatedly run across developers using this convention with
labels to meet Section 508 compliance:
<label for="qfind"><img src="images/clear.gif" height="1" width="1"
border="0" alt="Quick Find" /></label>
<select name="Quickfind" size="1"
style="font-family:verdana,arial,helvetica,sans-serif; font-size:10px;"
id="qfind">... options follow.
I always tell them that this is noncompliant, and incorrect (using the
blank images alt text) vs. using actual text. Am I being overly rigid? Or
am I correct in sticking with the W3C's
label = text [CS] ?
Thanx in advance...
___________________________________________
Kevin H. Spruill AWA/CNTR/FAA
FAA Section 508 Technical Support
202.385.8059
From: Jared Smith
Date: Mon, Jun 13 2005 11:10AM
Subject: Re: proper use of labels
← Previous message | Next message →
> Am I being overly rigid? Or am I correct in sticking with the W3C's
> label = text [CS] ?
I don't think there is a problem with having non-text labels. The W3C
links you refer to (if I'm able to understand the W3C-speak correctly)
only require that the label ATTRIBUTE of the OPTION and OPTGROUP tags be
text. I don't see anything in the specs that require the contents of the
label ELEMENT to be text-only.
Still, it comes down to testing. Your example works flawlessly in Home
Page Reader. Though JAWS doesn't like my computer, I imagine it too will
work, though it will likely identify the presence of the image, which may
be slightly confusing. There is also the lost usability of those of us who
can see not being able to tell what the drop-down is actually for (unless
an adjacent button is labeled "Quick Search"). Also, we lose the ability
to click the label and have focus placed on the form element. With that
said, I don't see this as being a problem, though others will likely chime in.
Jared Smith
WebAIM.org
From: Christian Heilmann
Date: Mon, Jun 13 2005 12:13PM
Subject: Re: proper use of labels
← Previous message | Next message →
> > Am I being overly rigid? Or am I correct in sticking with the W3C's
> > label = text [CS] ?
>
> I don't think there is a problem with having non-text labels. The W3C
> links you refer to (if I'm able to understand the W3C-speak correctly)
> only require that the label ATTRIBUTE of the OPTION and OPTGROUP tags be
> text. I don't see anything in the specs that require the contents of the
> label ELEMENT to be text-only.
>
> Still, it comes down to testing. Your example works flawlessly in Home
> Page Reader. Though JAWS doesn't like my computer, I imagine it too will
> work, though it will likely identify the presence of the image, which may
> be slightly confusing. There is also the lost usability of those of us who
> can see not being able to tell what the drop-down is actually for (unless
> an adjacent button is labeled "Quick Search"). Also, we lose the ability
> to click the label and have focus placed on the form element. With that
> said, I don't see this as being a problem, though others will likely chime in.
The question is why you add labels, to increase the usability and make
the pages more accessible to end users or to pass an automated test?
As you already pointed out, the great thing about labels - telling
what an interactive element is and increasing the area that can be
activated - is not given with this hack. I'd call it catering for a
special user group rather than making sites accessible for everyone.
It is the same problem with skip links - a proper document structure
will render them unnecessary, but instead of considering that approach
many developers use them and make things worse by rendering them
invisible.
--
Chris Heilmann
Blog: http://www.wait-till-i.com
Writing: http://icant.co.uk/
Binaries: http://www.onlinetools.org/
From: Terrence Wood
Date: Mon, Jun 13 2005 5:02PM
Subject: Re: proper use of labels
← Previous message | Next message →
'Non-compliant' is polite, that is the stupidest misuse of HTML I have
seen in a while.
It seems a bit redundant to add an invisible image to get alt text.
Why not wrap the label around the select and add a title to the select?
You then have the additional benefit of an implicit and explicit
relationship between the label and the form control.
regards
Terrence Wood.
On 14 Jun 2005, at 4:40 AM, = EMAIL ADDRESS REMOVED = wrote:
> <label for="qfind"><img src="images/clear.gif" height="1" width="1"
> border="0" alt="Quick Find" /></label>
> <select name="Quickfind" size="1"
> style="font-family:verdana,arial,helvetica,sans-serif; font-size:10px;"
> id="qfind">... options follow.
>
> I always tell them that this is noncompliant, and incorrect (using the
> blank images alt text) vs. using actual text. Am I being overly rigid?
> Or
> am I correct in sticking with the W3C's
> label = text [CS] ?
>
> Thanx in advance...
> ___________________________________________
> Kevin H. Spruill AWA/CNTR/FAA
> FAA Section 508 Technical Support
> 202.385.8059
>
>
From: Jim Thatcher
Date: Wed, Jun 15 2005 11:06AM
Subject: RE: proper use of labels
← Previous message | Next message →
Since you (Terrence Wood ) are calling ideas stupid I think
> wrap the label around the select and add a title to the select?
is a stupid idea.
Use of a title on the select menu is, from my testing, equivalent to the
process wrapping an invisible image in the label element to pick up the
alt-text. This is what IBM does on its search field. But I do like the title
attribute as it seems less of a hack. Adding a label element wrapped around
the select menu probably confuses a screen reader (I have not tested this
particular example) and should not be used.
Jim
Accessibility Consulting: http://jimthatcher.com/
512-306-0931
From: Terrence Wood
Date: Wed, Jun 15 2005 5:47PM
Subject: Re: proper use of labels
← Previous message | Next message →
On 16 Jun 2005, at 5:06 AM, Jim Thatcher wrote:
> Use of a title on the select menu is, from my testing, equivalent to
> the
> process wrapping an invisible image in the label element to pick up the
> alt-text.
Yes, thats the point. Here's what the W3c have to say about the title
attribute:
"This attribute offers advisory information about the element for which
it is set"
(see: http://www.w3.org/TR/html401/struct/global.html#adef-title)
Wrapping a control element in a label is legitimate use of the element
(see: http://www.w3.org/TR/html401/interact/forms.html#h-17.9.1), and
has not caused any problems for screen readers as AFAIK. Oh, and I have
personally tested it in JAWS.
My apologies to anyone else offended by my previous comment, I was
feeling rather flippant at the time, I did not mean anyone using that
invisible image technique is stupid (unlike Jim's reply aimed
specifically and personally at me with the intent of being offensive),
just the technique itself was stupid given that HTML already provides
the tools to achieve that result.
And Jim, since we're getting personal, I think it's rather poor form to
dish out unsubstantiated recommendations simply in order to disagree
with someone.
regards
Terrence Wood.
From: Christian Heilmann
Date: Thu, Jun 16 2005 12:11AM
Subject: Re: proper use of labels
← Previous message | Next message →
> On 16 Jun 2005, at 5:06 AM, Jim Thatcher wrote:
> > Use of a title on the select menu is, from my testing, equivalent to
> > the
> > process wrapping an invisible image in the label element to pick up the
> > alt-text.
>
> Yes, thats the point. Here's what the W3c have to say about the title
> attribute:
> "This attribute offers advisory information about the element for which
> it is set"
> (see: http://www.w3.org/TR/html401/struct/global.html#adef-title)
>
> Wrapping a control element in a label is legitimate use of the element
> (see: http://www.w3.org/TR/html401/interact/forms.html#h-17.9.1), and
> has not caused any problems for screen readers as AFAIK. Oh, and I have
> personally tested it in JAWS.
This assumes though that labels are only helpful to visitors with
screen readers and then only those who have set them to read out
titles to them. Labels also help visitors with cognitive disabilities
and dexterity problems and those with low vision.
Just because the guidelines are OK with it and big companies seem to
use a technique doesn't make it a good solution. A clear label telling
me what the form element is makes it a lot easier for all users,
regardless of (dis)ability.
--
Chris Heilmann
Blog: http://www.wait-till-i.com
Writing: http://icant.co.uk/
Binaries: http://www.onlinetools.org/
From: Terrence Wood
Date: Thu, Jun 16 2005 2:16AM
Subject: Re: proper use of labels
← Previous message | Next message →
I don't think it (html spec?) assumes anything of the sort, it simply
says that the title attribute is useful for displaying additional
information. I do agree that ultimately the best solution is a text
label in close proximity to the form control it describes for both
situations you describe: a greater acquirable target, and improved
readability of the form.
Take a look at my example below using a title and label together.
Clearly the title would make a lousy label -- and arguably makes a
lousy title ;-) -- but it carries a lot of information and hopefully
demonstrates how both can be used to improve usability. Don't forget
most browsers render titles as tool tips.
<label for="date">todays date (dd-mm-yy): <input type="text"
name="date" id="date" title="enter todays date as two numbers each for
day, month and year, separated by a dash." /></label>
regards
Terrence Wood.
On 16 Jun 2005, at 6:12 PM, Christian Heilmann wrote:
> This assumes though that labels are only helpful to visitors with
> screen readers and then only those who have set them to read out
> titles to them. Labels also help visitors with cognitive disabilities
> and dexterity problems and those with low vision.
> Just because the guidelines are OK with it and big companies seem to
> use a technique doesn't make it a good solution. A clear label telling
> me what the form element is makes it a lot easier for all users,
> regardless of (dis)ability.
From: Christian Heilmann
Date: Thu, Jun 16 2005 2:45AM
Subject: Re: proper use of labels
← Previous message | Next message →
> Take a look at my example below using a title and label together.
> Clearly the title would make a lousy label -- and arguably makes a
> lousy title ;-) -- but it carries a lot of information and hopefully
> demonstrates how both can be used to improve usability. Don't forget
> most browsers render titles as tool tips.
>
> <label for="date">todays date (dd-mm-yy): <input type="text"
> name="date" id="date" title="enter todays date as two numbers each for
> day, month and year, separated by a dash." /></label>
Yes, that is true. However, in screen readers you need to specifically
tell the reader to read out title attributes and on browsers there is
a slight delay in the display.
Being a laptop / trackpointer user, I largely use the keyboard to tab
through forms, and will never get the title information. There are a
lot of "power-users" like that looking at the keyboard, or looking up
texts on papers / other windows and not really pay attention to the
behaviour of the form.
A classic case are text fields cut up into several fields (american
forms love that with phone numbers) and immediate validation via
JavaScript / alerts. Many a time I typed in my phone number starting
with the +44 and finding out after the whole number that that is not a
valid code for the US in the first field.
Forms require thought, my stance is to keep them as simple as possible
and tell users what things are rather than hiding this information in
tooltips or other "dynamic contextual help".
--
Chris Heilmann
Blog: http://www.wait-till-i.com
Writing: http://icant.co.uk/
Binaries: http://www.onlinetools.org/
From: CFIT
Date: Thu, Jun 16 2005 3:55AM
Subject: Re: proper use of labels
← Previous message | Next message →
Hi All,
I just wish to make a quick comment- I think the title attribute is
potentially very useful but there are issues with it.
> <label for="date">todays date (dd-mm-yy): <input type="text"
> name="date" id="date" title="enter todays date as two numbers each for
> day, month and year, separated by a dash." /></label>
The above code is fine and I have used the title attribute in a similar
way in some of my own projects but I wouldn't exclusively rely on it for
the following reason. IMO What is being said via the title attribute is
,in this example, important for the user to know in order to understand
how to enter the date. You cant assume a user knows what dd-mm-yy means
whereas :
> enter todays date as two numbers each for
> day, month and year, separated by a dash
explains it very well. However, as Christian points out:
> in screen readers you need to specifically
>tell the reader to read out title attributes
>
For example in JAWS the HTML Options are highly configurable so the user
can give preference to whether alt tags, title attributes etc are read
or not. So they may choose not to read title attributes at all. So you
cant rely on it.
>what the W3c have to say about the title
>> attribute:
>> "This attribute offers advisory information about the element for which
>> it is set"
>> (see: http://www.w3.org/TR/html401/struct/global.html#adef-title)
>
So the title attribute is there for "advisory information" and this may
be a bit of a gray area - as you have to then decide what information is
"advisory" and what is "important" - in order to use the form etc
correctly. Strictly speaking if something is "advisory" it could be
"important" - in order to "advise" the user how to use the form. Maybe
more importance or visibility should be given to the title element by
User Agents - But I may be skating on thin ice here!!
To sum up - IMO It is not good practice to rely on the title element for
information that is important for the user for the above reason. Having
said that though I do think the title attribute is very useful and can
be used, if a screen reader picks up on it fine, if not fine, just make
sure you don't put anything in their that they *need* to know.
Joshue O Connor
Web Accessibility Consultant
**Centre for Inclusive Technology (CFIT)* *
National Council for the Blind of Ireland
= EMAIL ADDRESS REMOVED = +353 1 8821915
From: Jukka K. Korpela
Date: Thu, Jun 16 2005 4:35AM
Subject: Re: proper use of labels
← Previous message | Next message →
On Thu, 16 Jun 2005 = EMAIL ADDRESS REMOVED = wrote:
> I just wish to make a quick comment- I think the title attribute is
> potentially very useful but there are issues with it.
The real issue is: you should use the title attribute only when it is not
needed. (You cannot rely on its being presented to the user. Hence, it
should contain no information that is _necessary_.)
> > <label for="date">todays date (dd-mm-yy): <input type="text"
> > name="date" id="date" title="enter todays date as two numbers each for
> > day, month and year, separated by a dash." /></label>
>
> The above code is fine
No, it isn't, since the required data format is neither natural to most
people nor standards-conforming. It strongly violates the international
standard ISO 8601, which prescribes that dd-mm-yy is to be interpreted so
that dd denotes year, mm denotes month, and yy denotes day.
It is currently impossible to create Web pages with localized formats for
dates; attempts to use them cause just confusion. Using ISO 8601
(yyyy-mm-dd) might work in some contexts, but in most cases, the date
should be specified in three different fields, each with its own label.
This consumes some space, but we are not designing a compact paper form,
are we?
In this case, the title attribute does not help much. Anyone who needs the
information in it should instead see it as normal text before the field.
On a typical graphic browser, it is just too inconvenient to read longish
tooltips, and common to ignore tooltips since they are so often used so
pointlessly.
And after fixing the real problem (reading a date as a whole, despite the
fact that different people have very different ideas of how dates are
written), there is no need for a title attribute.
> > enter todays date as two numbers each for
> > day, month and year, separated by a dash
>
> explains it very well.
Does it? That makes _three_ numbers in my book. Maybe you meant _digits_?
Promoting the use of two-digit year denotations is asking for trouble, by
the way. But my point is that attempts at explaining things so often turn
into confusing distractions.
> Having
> said that though I do think the title attribute is very useful and can
> be used, if a screen reader picks up on it fine, if not fine, just make
> sure you don't put anything in their that they *need* to know.
I would say that title attributes are useful for links, properly used,
and mostly useless or worse for other elements. When a user mouses over a
link, it is quite natural to expect that some advisory information about
the destination is given, so that the user can make a better decision on
following the link and can prepare herself for the page to come. This
paradigm has been promoted by Jakob Nielsen, the usability specialist,
and it is fairly often applied and found useful. Using title attributes
for something rather different tends to obscure things; people may even
think something is a link because it has a tooltip!
--
Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/
From: CFIT
Date: Thu, Jun 16 2005 5:55AM
Subject: Re: proper use of labels
← Previous message | Next message →
Thanks Jukka for the interesting response.
For the record:
My comments were about the validity of using of the title attribute to
provide additional information to the user - and whether its use is
appropriate or not. The dates example is not my own - I just used it -
and I don't wish to enter into a debate about suitable date formats- it
sounds like you would win anyway.
My purport was:
<label for="info_field">Some Text : <input type="text" id="info_field" title="Some additional information that the user may find useful" /></label>
Is this not an appropriate use of the title attribute??
On your other points:
>In this case, the title attribute does not help much. Anyone who needs the
>information in it should instead see it as normal text before the field.
>
Absolutely. So the title attribute shouldn't be used at all if the
information is *needed* by the user.
>I would say that title attributes are useful for links, properly used,
>and mostly useless or worse for other elements.
>
Thats very interesting. How do others feel? Is the title attribute
redundant outside of providing additional "advisory" information for
links or does it have other positive applications?
>ttempts at explaining things so often turn
>into confusing distractions.
>
That is a very good point - but often clarification is needed.
>When a user mouses over a
>link, it is quite natural to expect that some advisory information about
>the destination is given, so that the user can make a better decision on
>following the link and can prepare herself for the page to come.
>
And it should work the same for non visual users by providing the same
"advisory information" (if the user has chosen to activate it in their
screenreader for example).
This brings up another interesting issue - As Jukka points out it is
>it is quite natural to expect that some advisory information about
>the destination is given
>
So why cant a screen reader user expect the same thing?? I know that its
a User Agent issue and the user *can* configure their UA to do this but
many screen reader users think that the HTML configuration options are
total overkill and there are many JAWS power users who don't go near
them at all!!!
Joshue O Connor
Web Accessibility Consultant
**Centre for Inclusive Technology (CFIT)* *
National Council for the Blind of Ireland
= EMAIL ADDRESS REMOVED = +353 1 8821915
From: Christian Heilmann
Date: Thu, Jun 16 2005 6:05AM
Subject: Re: proper use of labels
← Previous message | Next message →
> >it is quite natural to expect that some advisory information about
> >the destination is given
> >
> So why cant a screen reader user expect the same thing?? I know that its
> a User Agent issue and the user *can* configure their UA to do this but
> many screen reader users think that the HTML configuration options are
> total overkill and there are many JAWS power users who don't go near
> them at all!!!
Because 99.9% of the web sites out there abuse the title attribute for
visual tooltips, SEO or redundant repetition to adhere to a certain
standard (whatever that may be - internal or automated accessibility
tests).
Just look at any SEO forum (I just did it this morning so the pain
still burns) and you'll see a plethora of posts talking about "alt
tags (ouch!) and title tags (double ouch, as there really is one) in
links help google rank".
--
Chris Heilmann
Blog: http://www.wait-till-i.com
Writing: http://icant.co.uk/
Binaries: http://www.onlinetools.org/
From: Terrence Wood
Date: Thu, Jun 16 2005 1:31PM
Subject: Re: proper use of labels
← Previous message | Next message →
On 16 Jun 2005, at 10:36 PM, Jukka K. Korpela wrote:
> No, it isn't, since the required data format is neither natural to most
> people nor standards-conforming. It strongly violates the international
> standard ISO 8601, which prescribes that dd-mm-yy is to be interpreted
> so
> that dd denotes year, mm denotes month, and yy denotes day.
The date format is perfectly natural if you are a New Zealander. The
real give away that this is an *example* is the input asks for todays
date... now what designer/developer in their right mind would expect a
user to input that when it is the simplest thing to work out
programmatically? =)
regards
Terrence Wood.
From: Jukka K. Korpela
Date: Fri, Jun 17 2005 2:41AM
Subject: Re: proper use of labels
← Previous message | Next message →
On Fri, 17 Jun 2005, Terrence Wood wrote:
> On 16 Jun 2005, at 10:36 PM, Jukka K. Korpela wrote:
> > No, it isn't, since the required data format is neither natural to most
> > people nor standards-conforming. It strongly violates the international
> > standard ISO 8601, which prescribes that dd-mm-yy is to be interpreted
> > so
> > that dd denotes year, mm denotes month, and yy denotes day.
>
> The date format is perfectly natural if you are a New Zealander.
Then some people in New Zealand have failed to report the national
practices adequately. The Common Locale Data Repository entry for English
as used in New Zealand, at
http://unicode.org/cldr/data/common/main/en_NZ.xml
specifies the following date formats:
EEEE, d MMMM yyyy (full format; EEEE = day of week, MMMM = month name)
d MMMM yyyy (long format)
d/MM/yyyy (medium format; MM = month number)
d/MM/yy (short format)
No hyphen there in any of the formats. Note that notations that do not
use a hyphen in a normal date notation often use it (or a dash)
to indicate a _range_ of dates.
If you look at the variation across languages and countries, as documented
in the CLDR data base (which aims at covering _common_ practices), you
clearly see that it is impossible to design any format for date input as a
single string that would be natural to all or even most people.
That was my point in saying that date input should take place as
decomposed, i.e. day of month, month, and year separately. (Exceptions to
this include pages designed for a culturally homogenous user community.
But in accessibility, we try to cover actual heterogenousity even in
situations where the community is _assumed_ to be homogenous.)
Of course it was somewhat sidestepping in the sense that the date input
was presented just as an example. But situations where input format seems
to require an explanation, at least as a tooltip, need to be discussed
case by case - until the general point has been made, through examples,
that if it needs to be explained, it would better be decomposed into
simpler parts.
> (The
> real give away that this is an *example* is the input asks for todays
> date... now what designer/developer in their right mind would expect a
> user to input that when it is the simplest thing to work out
> programmatically? =)
Well, I thought that was too self-evident. Then again, maybe it _is_
meaningful to prompt for today's date on a page that tests a person's
cognitive or language skills. After all, one of the common checks,
when in doubt whether someone is in his senses, is to ask
"which day is it today"? :-)
--
Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/
From: CFIT
Date: Fri, Jun 17 2005 3:20AM
Subject: Re: proper use of labels
← Previous message | No next message
>
>
>Because 99.9% of the web sites out there abuse the title attribute for
>visual tooltips, SEO or redundant repetition to adhere to a certain
>standard (whatever that may be - internal or automated accessibility
>tests).
>
Thanks Christian - Thats a terrible state of affairs. But commercial
concerns will have their way - feel the evil!!
>look at any SEO forum (I just did it this morning so the pain
>still burns) and you'll see a plethora of posts talking about "alt
>tags (ouch!) and title tags (double ouch, as there really is one) in
>links help google rank".
>
I will do. Its interesting to monitor this kind of stuff - When Google
next changes its algorithm what will SEO guys jump on next - invisible
meta-stuffed GIFS anyone??
Joshue O Connor
Web Accessibility Consultant
**Centre for Inclusive Technology (CFIT)* *
National Council for the Blind of Ireland
= EMAIL ADDRESS REMOVED = +353 1 8821915