What is a tooltip?
A tooltip, as the name would suggest, is a tip that appears over the navigation button of a tool and explains what the tool can do. It is also commonly known as an Infotip, or a hint.
It is usually incorporated into web design, as these designs have many more elements in them that would distract users; also, tooltips are usually triggered by hovering over with the mouse.
A tooltip can be used to explain a feature, increase awareness to it, or get users out of a pain point. Each of these uses are extremely valuable, and although newer practices push extra What is UX? UX is the abbreviation of User Experience and refers to an individual’s thoughts and feelings when using a specific product or a service. It aims to heal… elements such as tooltips out of the equation, tooltips are a must.
When tooltips are used to explain features, they can help increase What is Feature Adoption? Feature adoption in short refers to the usage and consumption of a designated feature by the users of an app, web product, or software. A product… and therefore, What is retention? Retention refers to a customer continuing to use a business’ product or a service and to pay for the said product or service. It is a key….
When they are used for increasing awareness to different functions, it can help increase What is User Engagement? User engagement refers to the interaction of users with a business’ product or service. The term is usually used as, however, the users being active. Especially… and breadth of use among users.
And when the are used to get users out of pain points, they can help smoothen your UX and enable you to offer frictionless paths.
How to add a tooltip to my website/product?
There are various ways of creating a tooltip:
With HTML and CSS combined, one can create tooltips that are direct and less demanding.
Here’s a detailed guide on creating a HTML and CSS tooltip.
If you don’t have access to a developer or any sort of development resources however, or just don’t want to spend time on coding something that you could achieve in minutes, you can try a 3rd-party tool such as UserGuiding to create your tooltip without getting bothered.
When should a tooltip be used?
There are 4 different times a product can display a tooltip:
- All the time: A tooltip can be always available, hidden behind a small information symbol on the corner of a button. This is used if the designer is unaware of the part of user journey a user might need the information, so they choose to make it always available.
- New feature release: During or after the release of a new feature, a tooltip can be used to increase awareness to it. This is used if the product has an existing user base that would like to benefit from this new feature but are not possibly aware of its release.
- Drawing attention to an existing feature: Some features can be less used than others, some might not be used at all. If a company believes that there is value in a feature that users would like, but isn’t used because they’re not aware of its existence, they can introduce a tooltip to this feature.
- During Onboarding: During a What is user onboarding? User onboarding is the crucial process that starts from the first login of a new user and ends up in their aha moment, and usually beyond…., every feature is a new feature to a fresh user. That’s why tooltips on some of the complex parts of the product can be extremely helpful to first-time users in navigating the product.
Whether a tooltip is used to educate a user, or just give them a heads up; it has to be simple and straight to the point with possible humor and fun references.