Current web application is being updated with twitter bootstrap and the UX people are hover / tool-tip happy which is leading to a very busy page.

My understanding is that tool tips should be used for icons that may not convey enough information about what they do e.g. a toolbar, but not for buttons where the text is / should be enough.

What I'd like to know is; are there current UX guidelines for current web applications that I can use to base my assumptions on?

  • 4
    Short answer: No, there isn't.
    – JohnGB
    Commented Mar 26, 2013 at 1:44
  • You might want to be careful in the usage of tooltips since they are very hard to use with touchscreens. I would advice to design with as few tooltips as possible
    – TomDoes
    Commented Mar 26, 2013 at 13:45
  • 1
    Since multi-device support is becoming much more of an issue these days, you do have to consider mobile and tablet usage which means using alternatives to tooltips. The rule of thumb is to either design for the lowest common denominator or customize for each platform depending on the amount of effort in development and maintenance for your application.
    – Michael Lai
    Commented Mar 26, 2013 at 22:53
  • @MichaelLai Thanks Michael, that's such an important piece most people overlook, good call. Commented Mar 26, 2013 at 23:36

4 Answers 4


Tooltips need not be limited to any particular UI element (button/icons/links) but should be used where-ever additional contextual help is needed. You may use them as suggestions, eg: when the user hovers over any input field in a form, you display a tooltip which shows some example input to better explain the intent to the user.

There is a nice article on NN/g discussing best application design. In it they talk about the "Super" tooltips, wherein it is not necessarily a tip but provides more context of the button/element. It is displayed in the same manner as a tooltip would be, on hovering over the element, but is aimed at making the interaction richer, with fewer explanations on UI itself, but all the contextual help is a (mouse) point away.



Tooltips are very useful pieces of UI which can lead to a very annoying and confusing interface if used too often.

They can be used for clarification (meaning of an on-page element) or to reveal the content or more derails about a shortened/truncated element such as a link, a text entry, profile card, etc.

If multiple elements on the same mouse path trigger multiple tooltips, make sure to set enough delay on roll over to avoid a Christmas-tree like interface.


Tooltips are kinds of advise which is helpful if available only when they are expected or direly needed. Tool-tips can be used

  • To Describe abbreviation
  • A Technical or foreign language Term which can confuse the user, or induce him/her to search leaving your site
  • A well-known icon which keeps changing its meanings like [?], [x], < , <<, |< etc.
  • Toolbar Elements which perform special operations
  • To reveal text and label ellipsis
  • As a support to "Call to Action" buttons, like Main Banner on the homepage
  • To explain why some control (like a button) is disabled

Tooltips merely act as barriers on the user-flow and try to keep the user within expected path. If your user is happily moving on the path you intended, don't bring tool-tips in for the sake of it.


Who is your user base ? This should be an important question when people design sites. Are most of your users going to be advanced users or war veterans ? Are most people going to use a third party reader to read out the website and the functionality it provides ? Most websites will go as far as investing in third party libraries for effective tool tips. They are very important considering your user base.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.