How important is tool-tip in the website

Question

What is the best practice to use tool-tip in the website? Say for example I have product ABC which contains info (Country, category, price) USA | Electronics | $500. In similar way I've long list of products. Is it good practice to use tool-tip every-time the user has to hover over data to see what these fields are USA | Electronics | $500.

or

Should we write Location | Category | Price USA | Electronics | $500

(As per UX user shouldn't heavily rely on tool-tip)

This view is basically a card view. Sometimes there would be extra fields and sometimes less no.of fields. Say year the product was launched, rating etc.

Answer 1

it depends on your users actually. If your user are really tech savvy they will be aware of some features and functionalities. example:there are websites where you hover on something to reveal more information. This will not be understood by normal users. But tech savvy users are very well aware of this.

In your case showing information infront is good go. Like Have a header in small case and their values in big so that user can get values at first instance.

Answer 2

Tool tips are used only in the desktop Websites. Main purpose of tool tips is to remove the excess on the screen. The info tips should be kept short and sweet.

Tool tips are user friendly. They guide the user on their journey with less clutter on the screen.

Answer 3

If I would have a long list of products along with "Location | Category | Price USA | Electronics | $500" information being repeated , I would place it in a data grid or a table. This way I would have field names placed only in the table header and avoid using tool tips. In my experience, I have found too many tool tips in a single screen distracting the users and therefore I always ensure I don't overdo it.

Answer 4

Tooltips are meant to clarify the functionality or content of an element. They should not contain extra content of the element.

In your case if the content is not clear enough it is a good idea to display in a tooltip what each field refers to, as a helper. But consider if the amount of information you are displaying is enough for most users to understand the content or most of them will be forced to hover it in search of a tooltip to understand it.

---

Material design has a good section on tooltips.

Tooltips identify an element when they are activated. They may contain brief helper text about its function. For example, they may contain text information about actionable icons.

(...)

Tooltips don’t display rich information including images and formatted text.