WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Title attributes on images and links

for

From: Jared Smith
Date: Aug 5, 2009 8:25AM

On Tue, Aug 4, 2009 at 10:47 PM, E.J. Zufelt< <EMAIL REMOVED> > wrote:

> I am looking for authoritative articles on the proper use of
> title attributes on links and images.

The title attribute, by definition in the spec, is for "advisory
information". By this definition, it probably should not be used to
convey vital or necessary information, particularly for accessibility.
I also interpret "advisory" to suggest that the title text should
probably be different from the element it is associated with (in other
words, title of "Products" on a "Products" link doesn't give anything
extra except an annoying tooltip). But it can be used on about any
element in HTML to convey pretty much any information you want.

By default, the title attribute is NOT read by screen readers, except
in a few cases - on form elements that do not have labels and on
frames. This is another reason why title should not be relied on for
accessibility for other elements. Screen reader users can enable the
reading of title attributes for images and links, though this is
relatively uncommon in my experience. One option in screen readers is
to read the longer of screen text/alt text or the title attribute
value.

Title text is not accessible at all to sighted keyboard users. It also
is not apparent to sighted mouse users unless and until they hover the
mouse over the element for a period of time.

Title is great for conveying additional *advisory* information that
might be helpful to sighted users who do not use a keyboard or for the
few screen reader users that might hear it. It's great for providing
additional cues, instructions, or details that are useful, but not
vital.

Because title generates a tooltip, it can sometimes cover or overlay
page elements essentially hiding them from view until the user moves
the mouse away from that element. For example, if the user loads a
page and the mouse is hovering over an element, the tooltip will
display. If the tooltip is covering another page element, the user
must manually move the mouse or scroll the page in order to hide the
tooltip.

My general recommendations:
- Use title if you want to when advisory information might be useful.
- Make sure the title text is brief and not the same as the visible
text or alt text.
- Recognize that many (most?) users will never know the title text is there.
- Do not use it for vital accessibility information, except on frames
and perhaps form elements that do not have labels (though I prefer
hidden labels because if title in this case is necessary for
accessibility, this sure seems to be more than "advisory" to me).

Hopefully that helps a bit.

Jared Smith
WebAIM