What tooltips do
Screen elements rely on conventions (Norman, 1999), and icons without one often fail to communicate. Tooltips briefly name them, like 'Share' or 'Filter'. Kendrick (2019) advises using them only for non-essential help, keeping them short and not repeating visible labels. Grossman and Fitzmaurice (2010) found extended tooltips with short videos improved understanding, an idea akin to progressive disclosure.
Mobile has no hover
Touch screens lack hover, so desktop tooltips go unseen. Material Design (Google, n.d.) uses long press, but users rarely discover it. Visible labels under icons or an 'ⓘ' button are more reliable, with a thumb-sized target (Parhi et al., 2006). Icons with weak affordance especially need labels.
What to avoid and accessibility
Tooltips vanish, so never put password rules, errors or fees in them, and avoid links or buttons inside. Follow the ARIA pattern (W3C, n.d.): role=tooltip, aria-describedby and Escape to close. WCAG 2.2 (W3C, 2023) 1.4.13 requires hover or focus content to be dismissible, hoverable and persistent, vital for low-vision users who zoom.
FAQ
- Can tooltips be used on mobile?
- Long-press tooltips are hard to discover; show labels or use an ⓘ button for important icons.
- Can tooltips contain links?
- Avoid it; use a popover or bottom sheet when interaction is needed.
Sources reviewed: 2026-10-27
References
- Kendrick, A. (2019, January 27). Tooltip guidelines. Nielsen Norman Group. What belongs in a tooltip and what does not.
- Google. (n.d.). Tooltips. Material Design 3. Plain versus rich tooltips and long-press on mobile.
- World Wide Web Consortium. (n.d.). Tooltip pattern. ARIA Authoring Practices Guide. role=tooltip, aria-describedby and Escape.
- Grossman, T., & Fitzmaurice, G. (2010). ToolClips: An investigation of contextual video assistance for functionality understanding. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (pp. 1515–1524). ACM. Extended tooltips improve understanding.
- Norman, D. A. (1999). Affordance, conventions, and design. Interactions, 6(3), 38–43. Conventions and why icons need support.
- Parhi, P., Karlson, A. K., & Bederson, B. B. (2006). Target size study for one-handed thumb use on small touchscreen devices. In Proceedings of MobileHCI 2006 (pp. 203–210). ACM. Target size for small info icons.
- World Wide Web Consortium. (2023). Web Content Accessibility Guidelines (WCAG) 2.2. Criterion 1.4.13 content on hover or focus.