Table of Contents | ||||
---|---|---|---|---|
|
Description
Tooltips are small text like bubbles that appear when the user hovers an element.
...
Target area | Correct | Incorrect |
---|---|---|
Ribbon button | "Generate a schedule for selected employees" Rationale: explaining the main operation of the button including who it works on | "Generate schedule" Rationale: repeating the same text as the button is redundant |
Search field | "Search within the listed tree of organisation" Rationale: explaining the main operation of the field including who it works on | "will search upon all trees of organisation excluding the dates or any other non-organisation relevant information. " Rationale: Too long, and using unnecessary information which can be understood from context of the field and screen |
Placement or Positioning
Preferred usage for tooltip is with a small "triangle" at the outline to point mouse cursor (when technically feasible).
...
- Tooltips should not be used as the only way to accomplish a task (should not be vital for the task)
- A formatted structure is easier to read than big chunk (see in additional examples under Content)
- Keep it short - If you reach more than 250 chars, reconsider the tooltip and use a pop-over
- Try to avoid tooltip with actions in them
- Tooltips should be informative and should not just repeat what is already on the screen (i.e. redundant)
Transition
Tooltip should appear with an animated transition and not at once
...