Day 14: Adding titles to links
What with the web being all about links, you would think more people would know about the
title attribute, but I rarely see it. For those who don't know, all links can have a title, specified by the
title attribute of the
<a> tag. This is in addition to whatever link text you specify. The title of a link generally shows up as a tooltip in visual browsers, but it can be presented in non-visual browsers as well.
Not all links should have titles. If the link text is the name of an article, don't add a title; the link text itself is descriptive enough. But if you read the link text by itself, out of context, and can't figure out what it points to, add a title.
- Jackie benefits. JAWS has an option to read the title of a link along with the link text. (This option is not on by default. To activate it, Jackie pressed INSERT+V to bring up the JAWS verbosity options window, then changed "Text links verbosity" to "Alt tag or title".)
- Michael benefits. When he moves his cursor over a link in Opera, it displays the title of the link in the status bar and as a tooltip. This lets him decide whether he wants to spend precious bandwidth following the link.
- Lillian benefits. When she moves her cursor over the link in Internet Explorer, it displays the title of the link as a tooltip.
- Marcus benefits. When Marcus presses "l", Lynx displays a list of links on the current page. The list includes the title of each link, if present.
How to do it
On each link where the link text itself might not be sufficient for the reader to decide whether to click the link, add a
title attribute. Examples:
On my navigation bar, I have a link to my statistics page. The link text is simply Statistics, but the
titleattribute gives some further information:
<a title="referrers and other visitor statistics" href="/stats/">Statistics</a>
On my navigation bar, I have a link to my book, Dive Into Python, which looks like this:
<a title="Free Python book for experienced programmers" href="http://diveintopython.org/">Dive Into Python</a>
When I link to an article using a phrase within a sentence, I try to use a
titleattribute to give identifying information about the link, such as the article title or a citation. For instance, yesterday's tip included this sentence:
Which renders like this:
Do not go overboard with the
title attribute. All things in moderation.
- Jakob Nielsen: Using Link Titles to Help Users Predict Where They Are Going.