{"id":34698,"date":"2025-01-09T11:53:11","date_gmt":"2025-01-09T10:53:11","guid":{"rendered":"https:\/\/www.mtp.es\/?p=34698"},"modified":"2026-06-15T23:43:14","modified_gmt":"2026-06-15T21:43:14","slug":"que-es-tooltip-como-conseguir-sea-accesible","status":"publish","type":"post","link":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/","title":{"rendered":"Qu\u00e9 es un tooltip y c\u00f3mo hacerlo accesible en productos digitales"},"content":{"rendered":"

Los <\/span>tooltips<\/span><\/i> son componentes habituales en interfaces digitales, pero tambi\u00e9n pueden convertirse en una barrera importante si no se dise\u00f1an correctamente. Aunque suelen utilizarse para mostrar informaci\u00f3n breve o aclaratoria, su comportamiento puede generar problemas para personas que navegan con teclado, usan lectores de pantalla, emplean magnificadores o acceden desde dispositivos t\u00e1ctiles.<\/span><\/p>\n

En este art\u00edculo explicamos qu\u00e9 es un <\/span>tooltip<\/span><\/i>, qu\u00e9 problemas puede presentar desde el punto de vista de la accesibilidad digital y qu\u00e9 alternativas o buenas pr\u00e1cticas ayudan a crear experiencias m\u00e1s inclusivas, usables y alineadas con una buena experiencia de usuario.<\/span><\/p>\n

\u00bfQu\u00e9 es un tooltip?<\/b><\/h2>\n

Un <\/span>tooltip<\/span><\/i> es un texto breve de ayuda que aparece cuando una persona interact\u00faa con un elemento de la interfaz. Normalmente se muestra en forma de peque\u00f1a ventana emergente al pasar el puntero del rat\u00f3n sobre un icono, bot\u00f3n, enlace, campo de formulario u otro elemento visual.<\/span><\/p>\n

Su objetivo suele ser aportar informaci\u00f3n complementaria, aclarar una funci\u00f3n o explicar el significado de un elemento. Por ejemplo, un icono de informaci\u00f3n junto a un campo de formulario puede mostrar un texto adicional para ayudar al usuario a completarlo correctamente.<\/span><\/p>\n

Tradicionalmente, muchos <\/span>tooltips<\/span><\/i> se han implementado mediante el atributo <\/span>title<\/span> de HTML. Sin embargo, aunque esta soluci\u00f3n pueda parecer sencilla, presenta importantes limitaciones de accesibilidad y usabilidad.<\/span><\/p>\n

Por qu\u00e9 el atributo title puede ser un problema de accesibilidad<\/b><\/h2>\n

El atributo <\/span>title<\/span> permite a\u00f1adir informaci\u00f3n adicional a un elemento HTML, pero su comportamiento no es consistente entre navegadores, dispositivos y tecnolog\u00edas de asistencia. Esto hace que no sea una opci\u00f3n recomendable cuando la informaci\u00f3n debe estar disponible para todos los usuarios.<\/span><\/p>\n

El principal problema es que el contenido incluido en <\/span>title<\/span> suele depender del uso del rat\u00f3n. En muchos casos, solo aparece cuando el usuario coloca el puntero sobre el elemento, lo que deja fuera a personas que navegan con teclado, pantallas t\u00e1ctiles o determinadas tecnolog\u00edas de asistencia.<\/span><\/p>\n

Adem\u00e1s, el usuario no siempre puede controlar cu\u00e1ndo aparece, cu\u00e1nto tiempo permanece visible o c\u00f3mo descartarlo. Esto puede afectar negativamente tanto a la accesibilidad como a la usabilidad de la interfaz.<\/span><\/p>\n

Principales barreras de accesibilidad de los tooltips<\/b><\/h2>\n

Los <\/span>tooltips<\/span><\/i> mal dise\u00f1ados pueden generar diferentes barreras seg\u00fan el perfil de usuario, el dispositivo utilizado o la tecnolog\u00eda de apoyo empleada.<\/span><\/p>\n

Usuarios que navegan con teclado<\/b><\/h3>\n

Muchas personas no utilizan rat\u00f3n y navegan por una p\u00e1gina mediante teclado, especialmente con la tecla Tab para desplazarse entre enlaces, botones y campos de formulario.<\/span><\/p>\n

El problema es que, en muchos navegadores, los <\/span>tooltips<\/span><\/i> creados con <\/span>title<\/span> no se muestran al recibir el foco de teclado. Esto significa que una persona que navega sin rat\u00f3n puede no acceder nunca a esa informaci\u00f3n.<\/span><\/p>\n

Si el contenido del <\/span>tooltip<\/span><\/i> es necesario para comprender una acci\u00f3n, completar un formulario o tomar una decisi\u00f3n, la experiencia deja de ser accesible.<\/span><\/p>\n

Usuarios de lectores de pantalla<\/b><\/h3>\n

Los lectores de pantalla pueden interpretar el atributo <\/span>title<\/span> en algunos casos, pero no siempre de forma predecible. Adem\u00e1s, las personas que usan lector de pantalla no navegan \u00fanicamente con la tecla Tab. Tambi\u00e9n utilizan flechas, atajos de navegaci\u00f3n, listas de encabezados, enlaces, botones o regiones.<\/span><\/p>\n

Cuando el contenido del <\/span>tooltip<\/span><\/i> solo est\u00e1 disponible al enfocar determinados elementos, puede no ser le\u00eddo en otros modos de navegaci\u00f3n. Esto provoca que parte de la informaci\u00f3n quede oculta o sea dif\u00edcil de encontrar.<\/span><\/p>\n

Para evitar este tipo de problemas, es recomendable revisar los componentes con una consultora de accesibilidad que pueda validar su comportamiento con diferentes tecnolog\u00edas de asistencia.<\/span><\/p>\n

Usuarios de magnificadores de pantalla<\/b><\/h3>\n

Las personas con baja visi\u00f3n pueden utilizar magnificadores de pantalla para ampliar una zona concreta de la interfaz. En estos casos, los <\/span>tooltips<\/span><\/i> pueden resultar especialmente problem\u00e1ticos.<\/span><\/p>\n

Cuando el texto aparece solo al situar el puntero sobre un elemento, el usuario puede necesitar mover el rat\u00f3n para leer todo el contenido ampliado. Sin embargo, al desplazar el puntero fuera del elemento que activa el <\/span>tooltip<\/span><\/i>, este puede desaparecer autom\u00e1ticamente.<\/span><\/p>\n

El resultado es una experiencia frustrante, ya que la persona no puede acceder al contenido completo de forma c\u00f3moda y estable.<\/span><\/p>\n

Usuarios de dispositivos m\u00f3viles y pantallas t\u00e1ctiles<\/b><\/h3>\n

En m\u00f3viles y tablets no existe el comportamiento cl\u00e1sico de \u201cpasar el rat\u00f3n por encima\u201d. Por tanto, los <\/span>tooltips<\/span><\/i> basados exclusivamente en hover pueden no activarse o funcionar de forma poco clara.<\/span><\/p>\n

Esto afecta a una parte muy importante del tr\u00e1fico web actual. Cualquier componente que dependa \u00fanicamente del hover puede dejar sin informaci\u00f3n a usuarios que acceden desde pantallas t\u00e1ctiles.<\/span><\/p>\n

Usuarios con dificultades cognitivas o de atenci\u00f3n<\/b><\/h3>\n

Los <\/span>tooltips<\/span><\/i> tambi\u00e9n pueden generar problemas cuando aparecen de forma inesperada, desaparecen demasiado r\u00e1pido o contienen informaci\u00f3n excesiva.<\/span><\/p>\n

Para personas con dificultades cognitivas, problemas de atenci\u00f3n o necesidades de lectura m\u00e1s pausada, es importante que el contenido sea claro, controlable y no interrumpa la tarea principal.<\/span><\/p>\n

Caracter\u00edsticas de un tooltip accesible<\/b><\/h2>\n

Aunque crear un <\/span>tooltip<\/span><\/i> plenamente accesible puede ser complejo, existen algunas caracter\u00edsticas que ayudan a mejorar su comportamiento.<\/span><\/p>\n

Un <\/span>tooltip<\/span><\/i> accesible deber\u00eda cumplir, como m\u00ednimo, los siguientes criterios:<\/span><\/p>\n

    \n
  • Debe poder activarse mediante teclado, no solo con el rat\u00f3n.<\/span><\/li>\n
  • Debe ser detectable y comprensible para lectores de pantalla.<\/span><\/li>\n
  • Debe permanecer visible el tiempo suficiente para que pueda leerse.<\/span><\/li>\n
  • El usuario debe poder descartarlo cuando lo necesite.<\/span><\/li>\n
  • No debe desaparecer al mover el puntero sobre el propio contenido.<\/span><\/li>\n
  • No debe contener informaci\u00f3n imprescindible para completar una tarea.<\/span><\/li>\n
  • No debe repetir informaci\u00f3n ya visible en pantalla.<\/span><\/li>\n
  • Debe tener contraste suficiente y un tama\u00f1o de texto legible.<\/span><\/li>\n
  • Debe funcionar correctamente en dispositivos t\u00e1ctiles.<\/span><\/li>\n
  • Debe implementarse con roles, estados y relaciones accesibles cuando sea necesario.<\/span><\/li>\n<\/ul>\n

    Estas buenas pr\u00e1cticas deben formar parte de una estrategia m\u00e1s amplia de dise\u00f1o ux, donde cada componente se analiza no solo por su apariencia visual, sino tambi\u00e9n por su comportamiento, comprensi\u00f3n y accesibilidad.<\/span><\/p>\n

    Por qu\u00e9 no conviene incluir informaci\u00f3n esencial en un tooltip<\/b><\/h2>\n

    Una de las reglas m\u00e1s importantes es evitar que el <\/span>tooltip<\/span><\/i> contenga informaci\u00f3n imprescindible. Este componente debe utilizarse \u00fanicamente para contenido complementario.<\/span><\/p>\n

    Por ejemplo, no deber\u00eda incluir instrucciones obligatorias para completar un formulario, condiciones importantes de una compra, advertencias legales o informaci\u00f3n necesaria para entender una acci\u00f3n. Si el usuario necesita ese contenido para avanzar, debe estar visible en la interfaz principal.<\/span><\/p>\n

    Un buen criterio es preguntarse: \u201cSi el <\/span>tooltip<\/span><\/i> no aparece, \u00bfel usuario puede completar la tarea sin problemas?\u201d. Si la respuesta es no, entonces esa informaci\u00f3n debe presentarse de otra manera.<\/span><\/p>\n

    El toggletip como alternativa m\u00e1s accesible<\/b><\/h2>\n

    Siempre que sea posible, una alternativa m\u00e1s recomendable es utilizar un <\/span>toggletip<\/span><\/i>. Aunque visualmente puede parecerse a un <\/span>tooltip<\/span><\/i>, su comportamiento es diferente y suele ofrecer m\u00e1s control al usuario.<\/span><\/p>\n

    Un <\/span>toggletip<\/span><\/i> se activa mediante una acci\u00f3n expl\u00edcita, normalmente al hacer clic o pulsar un bot\u00f3n. Esto permite que la persona decida cu\u00e1ndo mostrar la informaci\u00f3n y cu\u00e1ndo ocultarla.<\/span><\/p>\n

    A diferencia del <\/span>tooltip<\/span><\/i> tradicional, que suele activarse autom\u00e1ticamente con hover o foco, el <\/span>toggletip<\/span><\/i> se basa en un elemento interactivo real, como un bot\u00f3n. Esto facilita su uso con teclado, lectores de pantalla y dispositivos t\u00e1ctiles.<\/span><\/p>\n

    Por ejemplo, un icono de \u201cm\u00e1s informaci\u00f3n\u201d junto a un campo de formulario puede implementarse como un bot\u00f3n accesible. Al activarlo, se muestra un texto explicativo que permanece visible hasta que el usuario lo cierra o vuelve a activar el bot\u00f3n.<\/span><\/p>\n

    Ventajas del toggletip frente al tooltip<\/b><\/h2>\n

    El <\/span>toggletip<\/span><\/i> ofrece varias ventajas desde el punto de vista de la accesibilidad y la usabilidad:<\/span><\/p>\n

      \n
    • Da control al usuario sobre cu\u00e1ndo abrir y cerrar la informaci\u00f3n.<\/span><\/li>\n
    • Puede recibir foco de teclado de forma natural.<\/span><\/li>\n
    • Funciona mejor en dispositivos m\u00f3viles y pantallas t\u00e1ctiles.<\/span><\/li>\n
    • Puede anunciarse correctamente mediante tecnolog\u00edas de asistencia.<\/span><\/li>\n
    • Permite mostrar textos algo m\u00e1s extensos sin depender del hover.<\/span><\/li>\n
    • Reduce el riesgo de que la informaci\u00f3n desaparezca antes de ser le\u00edda.<\/span><\/li>\n<\/ul>\n

      Por estas razones, el <\/span>toggletip<\/span><\/i> suele ser una soluci\u00f3n m\u00e1s robusta cuando se necesita ofrecer ayuda contextual en una interfaz.<\/span><\/p>\n

      Buenas pr\u00e1cticas para dise\u00f1ar tooltips y toggletips accesibles<\/b><\/h2>\n

      Para mejorar la accesibilidad de estos componentes, conviene aplicar una serie de buenas pr\u00e1cticas desde la fase de dise\u00f1o hasta la implementaci\u00f3n y validaci\u00f3n.<\/span><\/p>\n

      Utilizar texto claro y breve<\/b><\/h3>\n

      El contenido debe ser directo, f\u00e1cil de entender y realmente \u00fatil. Si el texto es demasiado largo, probablemente no deber\u00eda estar dentro de un <\/span>tooltip<\/span><\/i>. En ese caso, puede ser mejor utilizar una ayuda contextual visible, un enlace a m\u00e1s informaci\u00f3n o un panel desplegable.<\/span><\/p>\n

      Garantizar navegaci\u00f3n con teclado<\/b><\/h3>\n

      El componente debe poder activarse, recorrerse y cerrarse mediante teclado. Adem\u00e1s, el foco debe gestionarse correctamente para que el usuario no se pierda dentro de la interfaz.<\/span><\/p>\n

      Evitar depender solo del hover<\/b><\/h3>\n

      El hover no existe en todos los dispositivos y no es suficiente para garantizar accesibilidad. Cualquier informaci\u00f3n importante debe estar disponible tambi\u00e9n mediante foco, clic, pulsaci\u00f3n o una alternativa visible.<\/span><\/p>\n

      Permitir cerrar el contenido<\/b><\/h3>\n

      El usuario debe poder descartar el contenido cuando lo necesite. En algunos casos, puede utilizarse la tecla Escape, un bot\u00f3n de cierre o una segunda activaci\u00f3n del mismo bot\u00f3n.<\/span><\/p>\n

      Validar con tecnolog\u00edas de asistencia<\/b><\/h3>\n

      No basta con que el componente funcione visualmente. Es necesario comprobar su comportamiento con lectores de pantalla, navegaci\u00f3n por teclado, zoom, magnificadores y dispositivos t\u00e1ctiles.<\/span><\/p>\n

      Las Pruebas de usabilidad permiten observar c\u00f3mo interact\u00faan usuarios reales con estos componentes y detectar barreras que pueden pasar desapercibidas en una revisi\u00f3n t\u00e9cnica.<\/span><\/p>\n

      Revisar el cumplimiento de accesibilidad<\/b><\/h3>\n

      Los componentes interactivos deben evaluarse dentro del marco general de accesibilidad del producto digital. Esto incluye contraste, foco visible, sem\u00e1ntica HTML, compatibilidad con tecnolog\u00edas de asistencia, comportamiento responsive y cumplimiento de criterios WCAG aplicables.<\/span><\/p>\n

      Una Certificaci\u00f3n de accesibilidad digital puede ayudar a verificar que una web, aplicaci\u00f3n o producto digital cumple est\u00e1ndares de accesibilidad y ofrece una experiencia m\u00e1s inclusiva.<\/span><\/p>\n

      Tooltip, accesibilidad y experiencia de usuario<\/b><\/h2>\n

      La accesibilidad digital no debe entenderse como una capa a\u00f1adida al final del proyecto. Forma parte de una buena experiencia de usuario desde el inicio.<\/span><\/p>\n

      Un <\/span>tooltip<\/span><\/i> que no puede abrirse con teclado, que desaparece al mover el rat\u00f3n, que no se anuncia correctamente a un lector de pantalla o que no funciona en m\u00f3vil no solo es un problema t\u00e9cnico. Tambi\u00e9n es un problema de experiencia.<\/span><\/p>\n

      Por eso, la accesibilidad debe integrarse en las decisiones de dise\u00f1o, contenido, desarrollo y validaci\u00f3n. Una Consultoria UX puede ayudar a definir patrones de interacci\u00f3n m\u00e1s claros, inclusivos y coherentes con las necesidades reales de los usuarios.<\/span><\/p>\n

      Conclusi\u00f3n: cu\u00e1ndo usar un tooltip y cu\u00e1ndo evitarlo<\/b><\/h2>\n

      Los <\/span>tooltips<\/span><\/i> pueden ser \u00fatiles para ofrecer informaci\u00f3n breve y complementaria, pero deben utilizarse con precauci\u00f3n. Si se implementan de forma incorrecta, pueden generar barreras importantes para usuarios de teclado, lectores de pantalla, magnificadores, dispositivos m\u00f3viles o personas con necesidades cognitivas espec\u00edficas.<\/span><\/p>\n

      Como regla general, conviene evitar los <\/span>tooltips<\/span><\/i> cuando la informaci\u00f3n sea esencial. En esos casos, es mejor mostrar el contenido directamente en pantalla o utilizar componentes m\u00e1s controlables, como los <\/span>toggletips<\/span><\/i>.<\/span><\/p>\n

      Dise\u00f1ar componentes accesibles no solo mejora el cumplimiento normativo, sino que tambi\u00e9n permite crear productos digitales m\u00e1s claros, usables e inclusivos para todas las personas.<\/span><\/p>\n



      <\/p>\n\n\n

      <\/p>\n","protected":false},"excerpt":{"rendered":"

      Conseguir la accesibilidad digital requiere de un buen trabajo de dise\u00f1o y desarrollo de los productos digitales, y de todos los elementos que los conforman, con el fin de eliminar barreras. Explicamos hoy en el post que es un \u2018tooltip\u2019, los problemas que puede ofrecer y soluciones para superarlos.<\/p>\n","protected":false},"author":22,"featured_media":35928,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[205],"tags":[],"class_list":["post-34698","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-accesibilidad-digital-y-ux"],"acf":[],"yoast_head":"\nQu\u00e9 es un 'tooltip' y c\u00f3mo conseguir que sea accesible<\/title>\n<meta name=\"description\" content=\"Un tooltip accesible debe ser comprensible, usable con teclado y lector de pantalla, visible en contexto y compatible con WCAG para mejorar la UX digital.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Qu\u00e9 es un 'tooltip' y c\u00f3mo conseguir que sea accesible\" \/>\n<meta property=\"og:description\" content=\"Un tooltip accesible debe ser comprensible, usable con teclado y lector de pantalla, visible en contexto y compatible con WCAG para mejorar la UX digital.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/\" \/>\n<meta property=\"og:site_name\" content=\"MTP Espa\u00f1a\" \/>\n<meta property=\"article:published_time\" content=\"2025-01-09T10:53:11+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-06-15T21:43:14+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/mtp.global\/es\/wp-content\/uploads\/2025\/01\/MTP-Blog-tooltip-accesibilidad.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1920\" \/>\n\t<meta property=\"og:image:height\" content=\"1080\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Accesibilidad\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Accesibilidad\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutos\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Qu\u00e9 es un 'tooltip' y c\u00f3mo conseguir que sea accesible","description":"Un tooltip accesible debe ser comprensible, usable con teclado y lector de pantalla, visible en contexto y compatible con WCAG para mejorar la UX digital.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/","og_locale":"es_ES","og_type":"article","og_title":"Qu\u00e9 es un 'tooltip' y c\u00f3mo conseguir que sea accesible","og_description":"Un tooltip accesible debe ser comprensible, usable con teclado y lector de pantalla, visible en contexto y compatible con WCAG para mejorar la UX digital.","og_url":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/","og_site_name":"MTP Espa\u00f1a","article_published_time":"2025-01-09T10:53:11+00:00","article_modified_time":"2026-06-15T21:43:14+00:00","og_image":[{"width":1920,"height":1080,"url":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2025\/01\/MTP-Blog-tooltip-accesibilidad.jpg","type":"image\/jpeg"}],"author":"Accesibilidad","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"Accesibilidad","Tiempo de lectura":"3 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/#article","isPartOf":{"@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/"},"author":{"name":"Accesibilidad","@id":"https:\/\/mtp.global\/es\/#\/schema\/person\/668eeb99789001b8183bcdf63a7f3689"},"headline":"Qu\u00e9 es un tooltip y c\u00f3mo hacerlo accesible en productos digitales","datePublished":"2025-01-09T10:53:11+00:00","dateModified":"2026-06-15T21:43:14+00:00","mainEntityOfPage":{"@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/"},"wordCount":1985,"publisher":{"@id":"https:\/\/mtp.global\/es\/#organization"},"image":{"@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/#primaryimage"},"thumbnailUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2025\/01\/MTP-Blog-tooltip-accesibilidad.jpg","articleSection":["Accesibilidad digital y UX"],"inLanguage":"es"},{"@type":"WebPage","@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/","url":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/","name":"Qu\u00e9 es un 'tooltip' y c\u00f3mo conseguir que sea accesible","isPartOf":{"@id":"https:\/\/mtp.global\/es\/#website"},"primaryImageOfPage":{"@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/#primaryimage"},"image":{"@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/#primaryimage"},"thumbnailUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2025\/01\/MTP-Blog-tooltip-accesibilidad.jpg","datePublished":"2025-01-09T10:53:11+00:00","dateModified":"2026-06-15T21:43:14+00:00","description":"Un tooltip accesible debe ser comprensible, usable con teclado y lector de pantalla, visible en contexto y compatible con WCAG para mejorar la UX digital.","breadcrumb":{"@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/#primaryimage","url":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2025\/01\/MTP-Blog-tooltip-accesibilidad.jpg","contentUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2025\/01\/MTP-Blog-tooltip-accesibilidad.jpg","width":1920,"height":1080},{"@type":"BreadcrumbList","@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/que-es-tooltip-como-conseguir-sea-accesible\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/mtp.global\/es\/home\/"},{"@type":"ListItem","position":2,"name":"Qu\u00e9 es un tooltip y c\u00f3mo hacerlo accesible en productos digitales"}]},{"@type":"WebSite","@id":"https:\/\/mtp.global\/es\/#website","url":"https:\/\/mtp.global\/es\/","name":"MTP Global","description":"","publisher":{"@id":"https:\/\/mtp.global\/es\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/mtp.global\/es\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/mtp.global\/es\/#organization","name":"MTP Global","url":"https:\/\/mtp.global\/es\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/mtp.global\/es\/#\/schema\/logo\/image\/","url":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2024\/07\/MTP-global.png","contentUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2024\/07\/MTP-global.png","width":1200,"height":400,"caption":"MTP Global"},"image":{"@id":"https:\/\/mtp.global\/es\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/mtp.global\/es\/#\/schema\/person\/668eeb99789001b8183bcdf63a7f3689","name":"Accesibilidad","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/secure.gravatar.com\/avatar\/?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/?s=96&d=mm&r=g","caption":"Accesibilidad"},"url":"https:\/\/mtp.global\/es\/blog\/author\/accesibilidad\/"}]}},"fimg_url":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2025\/01\/MTP-Blog-tooltip-accesibilidad.jpg","_links":{"self":[{"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/posts\/34698","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/users\/22"}],"replies":[{"embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/comments?post=34698"}],"version-history":[{"count":0,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/posts\/34698\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/media\/35928"}],"wp:attachment":[{"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/media?parent=34698"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/categories?post=34698"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/tags?post=34698"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}