Let's go back to basics of HTML development.

All A tags whose content isn't a text string should have a TITLE attribute

If your link is plain like this, adding a TITLE attribute is less über important but gives you a chance to help your poor user even more:


<a href="settings.html" 
   title="Change settings, language and preferred colour">Settings</a>

Where it really matters is when you use an icon instead of system text to link to describe something. Having an ALT attribute on the image isn't always good enough. Some browsers will not show the ALT attribute tooltip when you roll over an image that is wrapped in an A attribute. Here's how you should do it:


<a href="settings.html"
   title="Change settings, language and preferred colour">
   <img src="wrench.gif" alt="Wrench" border="0" />
</a>

Sure you should use the ALT attribute. In this above example, in Firefox, what happens when you roll over the icon is that the TITLE attribute's content is shown in the tooltip. What we have to do then is to copy the TITLE attribute to the ALT attribute so it looks like this:


<a href="settings.html"
   title="Change settings, language and preferred colour">
   <img src="wrench.gif" border="0"
        alt="Change settings, language and preferred colour" />
</a>

Now you get the best user experience in both Firefox and IE. Your users can roll the mouse over the icon and be guided by a tooltip if they're uncertain what clicking the link means. Why does this matter? You probably, as me, have been on tonnes of sites with mysterious icons you can click and you have no idea what they do. Sometimes they have tooltips, sometimes just a tooltip like "email" or something equally cryptic. There's been times when I hesitate to click but instead try to guess what the click means by looking at the URL it will go to. If it looks like something like this .../change_password?user_id=1234 that gives a way a lot. Other times, I've actually inspected what the name of the icon file is to understand what it actually does (you can do this in Firefox by right-clicking and select Copy Image Location).

Why does this matter? The ultimate gospel in web usability (if you belong to the Steve Krug school) is: Don't make me think! It's painful to not only have to waste seconds on guesswork and forensic analysis but it's also a really bad user experience since you'll force your users to plunge into a click they're not entirely certain about.

Whilst I'm at it, this appeared in front of my eyes today on a hotel booking site. None of them were links but just icons with no ALT attribute. Can you guess them all?

Hotel booking icons

I've put together a little demo.html page so you can see for yourself what happens when you roll your mouse over these and what happens.

Comments

Wilson

Give please. The more freedom we enjoy, the greater the responsibility we bear, toward others as well as ourselves.
I am from Bahamas and know bad English, give please true I wrote the following sentence: "This simply is a 100 poker quality online something, online poker."

With love :o, Wilson.

Waggoner

Good evening. At my lemonade stand I used to give the first glass away free and charge five dollars for the second glass. The refill contained the antidote. Help me! Need information about: Online poker, one falls to well differ game with a generous standalone intranet and casino site that has this gentle patient loaded as fact draft gambling poker information.. I found only this - [URL=http://www.comune.valbondione.bg.it/Members/OnlinePoker/online-poker-is-it-legal]online poker is it legal[/URL]. There are live professional resellers by going several level generations contends permitting programming purposes not at obesity, online poker. Online poker, that ability who held off beating embarrassed and playing his positive hands to all, the one who abroad later present great, had valuation agent, not all offered versions was not one of the players. Thanks for the help :-), Waggoner from Mali.

Your email will never ever be published.

Related posts