Taken at the Guggenheim Museum, NYC
The Echoplex

Tooltips that matter

It is almost a convention now that developers are repeating link text as tooltips in main navigation areas; this is probably based on a misunderstanding that tooltips will always aid usability.

If a link tooltip merely repeats the link text it will actually hurt usability by creating more information ‘noise’ for the user to deal with.

Tooltips, when used correctly, can be an excellent and necessary augmentation to text links or icons; providing further description on demand, and removing any potential ambiguity. In some situations they are a necessity, such as in desktop software or web applications that rely heavily on icons to streamline the user interface. When writing content for the web, though, they should be used sparingly and only in certain contexts.

Acronyms and abbreviations should be marked up with acronym and abbr tags respectively, and have tooltips displaying what they stand for in expanded form. In my opinion, this should be done at the first occurrence on every page and not repeated for every occurrence on every page, as it looks messy and cluttered if there are multiple instances on a page.

Text links should be written in an intuitive way as possible so users know where they are going if they click through. Sometimes, however, it may not be possible to do this elegantly, or the link may require some supplementary information relating to browser behaviour (e.g. link opens in a new window). In this case tooltips can help if they are well written, and actually contribute useful information rather than merely repeating the link text.

Images can benefit from tooltips as a way of providing caption text (well demonstrated by Google with their search page masthead). However, it is usually preferable, for ease of use, to have caption text visible on the page rather than hidden in a tooltip.

Internet Explorer plays some havoc with tooltip behaviour by turning image alternative text into tooltips; to circumnavigate this add an empty title attribute to your image tags.

1 Comment thus far

  • Link for this comment
    1

    Phunky
    9th Mar ’09 at 4:34am

    I couldn’t agree more, tooltips should be short, simple and too the point – if you need more than 5 words it’s not right in a tooltip!

Comments off

Comments are automatically turned off after 2 weeks

This is…

the online home of Pete Boere, web developer in Bristol, UK.

follow moi

code.google.com/p/jelly-javascript

Flickr photostream

  • flickr.com hosted photo. Id:4080807157
  • flickr.com hosted photo. Id:4080806951
  • flickr.com hosted photo. Id:4080806813
  • flickr.com hosted photo. Id:4081567982
  • flickr.com hosted photo. Id:4080806419
  • flickr.com hosted photo. Id:4081567336
  • flickr.com hosted photo. Id:4081567174
  • flickr.com hosted photo. Id:3834802544
  • flickr.com hosted photo. Id:3834802406
  • flickr.com hosted photo. Id:3834009113