Definición de Tooltip
(herramienta de consejos, screentip). Un tooltip es un elemento de las interfaces gráficas que se emplea junto con el cursor del mouse. Cuando un usuario posiciona su cursor sobre un elemento (sin hacer clic sobre este) un pequeño rectángulo -generalmente amarillo- aparece para brindar información relacionada a ese elemento.
Las páginas web suelen emplear tooltips especialmente en los elementos gráficos.
Una alternativa al tooltip son los globos de ayuda.
Además de su uso común en las interfaces gráficas, los tooltips también son muy utilizados en la creación de aplicaciones móviles. En este caso, los elementos que reciben la interacción del usuario son los botones táctiles y aparecen igualmente en pantalla cuando se mantiene presionada la opción deseada durante un tiempo determinado.
Los tooltips permiten simplificar la interacción con los elementos visuales, brindando información adicional sin necesidad de abrir una nueva ventana o pestaña. Esto se traduce en una mejor experiencia de usuario y una mayor eficiencia al momento de interactuar con las aplicaciones y sitios web.
En cuanto a los globos de ayuda, estos se diferencian de los tooltips en que brindan información más detallada y extensa al usuario. Al ser más grandes que los tooltips, su uso es más adecuado para explicar conceptos complejos o información detallada sobre una funcionalidad específica.
Resumen: Tooltip
Un tooltip es una ayuda visual que aparece cuando mueves el cursor del ratón sobre un elemento en una página web. Es un cuadro pequeño de color amarillo que te da información sobre ese elemento sin tener que hacer clic en él. Es muy común en diseños gráficos de páginas web. También se pueden usar globos de ayuda como una alternativa a los tooltips.
¿Para qué se utiliza un tooltip?
Un tooltip se utiliza para proporcionar información adicional sobre un elemento de la interfaz gráfica de usuario. Esta información suele ser explicativa o detallada.
¿Es necesario que los usuarios interactúen con tooltips?
No necesariamente. Algunos tooltips, como los que se utilizan en sitios web, pueden aparecer automáticamente cuando el usuario pasa el cursor del mouse sobre un elemento específico.
¿Qué tipo de información se suele incluir en un Tooltip?
La información que se incluye en un tooltip puede variar, desde explicaciones breves sobre la funcionalidad de un elemento hasta información detallada sobre la información que se muestra.
¿Cómo se activa un tooltip?
Un tooltip se activa cuando el usuario coloca el cursor del mouse sobre un elemento que tiene asociado un tooltip. En la mayoría de los casos, el tooltip desaparece una vez que el usuario mueve el cursor del mouse fuera del elemento.
¿Qué beneficios ofrece el uso de tooltips en la interfaz gráfica de usuario?
El uso de tooltips puede mejorar la usabilidad de la interfaz gráfica de usuario al proporcionar información adicional y detallada sobre un elemento. También puede ayudar a los usuarios a entender mejor cómo usar la interfaz.
¿Cómo se pueden crear tooltips en un sitio web?
Los tooltips se pueden crear utilizando HTML y CSS. En algunos casos, también se utilizan JavaScript o bibliotecas de código abierto para implementar tooltips más avanzados. Es importante asegurarse de que los tooltips sean fáciles de leer y no afecten negativamente a la experiencia del usuario.
Elementos típicos de las interfaces gráficas de usuario (GUI) | |
Entrada de comandos |
Botón • Menú contextual • Menu (y Submenú) • Menú desplegable • Menú pastel (pie menu) • Menú hamburguesa |
Entada/salida de datos |
Casillero de verificación • Lista • Lista desplegable (combo box) • Botón de opción (radio button) • Cuadro de texto • Grid view (datagrid) • Botón de opción (Radio button) • Barra de desplazamiento (scrollbar) |
Informativos |
Icono • Barra de estado (status bar) • Globo de ayuda (ballon help) • Barra de progreso • Barra de título • Slider • Spinner • Caja de texto (Text box o Cuadro de texto) • HUD (heads-up) • Infobar • Etiqueta (label) • Splash screen • Throbber • Toast • Tooltip |
Contenedores |
Ventana • Acordeón • Ribbon • Disclosure widget (expansor o Combutcon) • Cuadro (frame/fieldset) • Barra de menú (menubar) • Panel • Panel lateral • Pestaña (tab) • Barra de herramientas |
De navegación |
Barra de direcciones • Breadcrumb • Hipervínculo • Vista de árbol (treeview) |
Ventanas especiales |
Acerca de (about box) • Cuadro de diálogo (dialog box) • Cuadro de diálogo de archivos • Inspector window • Modal window • Ventana de paleta |
Relacionados |
Widget |
Autor: Leandro Alegsa
Actualizado: 11-06-2023
¿Cómo citar este artículo?
Alegsa, Leandro. (2023). Definición de Tooltip. Recuperado de https://www.alegsa.com.ar/Dic/tooltip.php