49
votes
Accepted
When should I use a popover vs a tooltip?
There are a couple considerations when deciding between a tooltip and a popover.
Purpose of Content
Tooltips are meant to be exactly that, a hint or tip on what a tool or other interaction does. They ...
- 15.3k
39
votes
Accepted
What is considered better UX - have tooltips on important features or provide a tour
Tooltips are useful. They should be present on devices where hover is a thing. But neither you nor your users should need to rely on them.
Tours are sometimes useful. They show what's new or ...
- 71k
24
votes
Accepted
How long should the delay be before a tooltip pops up?
If anyone is still looking for updated answers around this subject, Nielsen Norman has a great article on the subject: https://www.nngroup.com/articles/timing-exposing-content/
Mouse cursor ...
- 266
14
votes
Tooltip CSS cursor
The cursor should change depending on the interaction the user can do with the element, not on the tooltip. A tooltip appears to explain what the element is or what it does.
For example when we hover ...
- 16.8k
11
votes
What is considered better UX - have tooltips on important features or provide a tour
Tooltips and tours address different issues.
Tours are for newcomers. The goal of a tour is to introduce a user to the basic features which are absolutely vital for application usage. A user is ...
- 2,256
6
votes
Arrowless tooltip: Usability?
If I interpret your question properly, it seems your main issue with the way Angular Material recommends implementing tooltips is this:
Maybe that'll do in mobile, but in complex web applications ...
- 191
5
votes
In Responsive Design, how do you trigger Tooltips? mouse hover isn't there anymore
Both Android and iOS have long press handlers, which can be used to simulate the hover-tooltip effect. The Material Guidelines's mobile section give an example of usage.
- 869
4
votes
How long should the delay be before a tooltip pops up?
It really depends on what your tooltips are for.
We've got lots of toolbar controls and buttons which simply use the Material Design Icon set with no text. Most of these are self explanatory but we'...
- 181
4
votes
What is considered better UX - have tooltips on important features or provide a tour
This depends on the complexity of your website.
The question you need to ask is:
Is my website simple enough to tour the user through all the features in <5-7 steps?
If you think it is simple, ...
- 6,395
4
votes
Arrowless tooltip: Usability?
Animation always attracts the user's attention, and a tooltip usually appears on mouse over or any kind of focus action. So it is a result of an action thus you can trust that the user notices the ...
- 181
4
votes
How can I display tool tips on a touchscreen or is there a better way?
I noticed that a Q&A was already held on whether to Tooltip or not to here: To tooltip or not to tooltip? So in all fairness, it may help to actually to answer the asker's question without further ...
4
votes
Input info tooltip in material design
Tooltips are text labels that appear when the user hovers over, focuses on, or touches an element.
Tooltips identify an element when they are activated. They may contain
brief helper text about ...
- 16.2k
4
votes
Accepted
What's the name for the little help bubbles some sites use
TLDR: Hotspots
If you're going by these categorizations, which I think you're referring to would be hotspots. But again, without a screenshot, it's hard to be sure, so maybe look these over yourself. ...
- 140
4
votes
Accepted
In Responsive Design, how do you trigger Tooltips? mouse hover isn't there anymore
This is one of the major reasons why tooltips are not a good solution most of the time.
My stock argument is that one shouldn't ever have to use tooltips. Either the information is important enough ...
- 41.8k
4
votes
In Responsive Design, how do you trigger Tooltips? mouse hover isn't there anymore
I think this is really about the discover-ability of UIs. Tooltips are often used as a way to annotate a user interface so that users can learn what all the functions do, without cluttering the UI ...
- 12.5k
3
votes
Should tooltips be used on Text/Links?
From the website you linked:
Tooltips are a quick way to provide extended information on a term or action on a page
In text there could be a number of applications for this:
Provide glossary ...
- 141
3
votes
Help for first visit on a website
You are talking about an on-boarding feature. An on-boarding feature is a thing which introduces new users to your system by putting a spotlight on one or more features. the spotlight can include some ...
- 8,904
3
votes
Help for first visit on a website
The answer is right next to where you pointed in the screenshot. The yellow button.
You want to emphasize a menu item because it is something different or new, you can let it stand out by adding a ...
- 2,204
3
votes
Arrowless tooltip: Usability?
According to Material Design Guidelines:
Tooltips don’t have directional arrows; instead, they rely on motion emanating from the source to convey direction.
If we look at the desktop example ...
- 51
3
votes
Accepted
Should I provide empty fields in tooltip or not?
First of all, are all the fields provided in the tool-tip necessary?
Is there any chance that the number of fields be reduced? If yes, keep them concise.
On the other hand, if all the fields are ...
- 520
3
votes
Accepted
Location of tooltip
I'd personally recommend having an extra icon either before the label or after the units with a question mark in it much like below:
Have the icon hold the tool-tip. The question mark tells people ...
- 106
3
votes
Accessible tooltip with links
There are two changes to be made if you are looking for an accessible tooltip solution.
Avoid automatic presentation of the tooltip when user focuses a UI element with keyboard. There are warnings ...
- 201
3
votes
Accepted
What's a better alternative to using tool tips on a modal box on mobile
The "modal within a modal" problem arises when you need to return to the previous state (the whole point of a modal). So you should ask yourself two questions about the workflow:
Can the information ...
- 422
3
votes
How to communicate that an image is clickable without explicitly telling that it's clickable?
There are many ways, but it also depends on what you plan (want) users to do. Since you mention that you don't want to be explicit about it, I assume you have some ideas about the reasons (which ...
- 37.3k
2
votes
How to mark a tooltip-containing word in a paragraph?
I also faced this issue, because my users did not understand that a green solid underline could trigger a tooltip.
So I did different versions and I am certain that the last one is the best indicator:...
- 131
2
votes
What is considered better UX - have tooltips on important features or provide a tour
What platform will users use?
A key distinction is to consider the platform your users will be using primarily. Mouseover tooltips may work fine for desktop/laptop applications - but smartphone/tablet ...
- 712
2
votes
Accepted
Indicate hover (or tap) will show more information with many elements
Some suggestions:
Add some structure to the view to separate the references block more
clearly. Use white space and font size, too. Font size helps to convey the importance of the information ...
- 22.6k
2
votes
Indicative tooltip + info tooltip over the same element
If you are looking to display the tip with a title and description, I would suggest trying to use a "super tooltip," or in another term, a "popover." These items will allow you to have a larger area ...
- 797
2
votes
Accepted
Arrowless tooltip: Usability?
This is not a complete answer, and only speaks to the original intention of the OP, that of asking Angular Material to consider adding arrows. The intent of this partial answer is to point out your ...
- 2,258
2
votes
Should tooltips be used on Text/Links?
I have two examples to share that were successful:
Long titles exceed character limits. When the titles are force-truncated and cutting off distinguishing info. You can easily wind up with a list of ...
- 21
Only top scored, non community-wiki answers of a minimum length are eligible