{"id":33611,"date":"2024-07-03T15:47:14","date_gmt":"2024-07-03T13:47:14","guid":{"rendered":"https:\/\/www.mtp.es\/?p=33611"},"modified":"2024-07-03T15:47:14","modified_gmt":"2024-07-03T13:47:14","slug":"son-realmente-accesibles-overlays-web","status":"publish","type":"post","link":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/","title":{"rendered":"\u00bfSon realmente accesibles los &#8216;overlays&#8217; en la web?"},"content":{"rendered":"<p>En el fascinante universo digital, los <strong><em>overlays<\/em> <\/strong>ofrecen tanto oportunidades como desaf\u00edos. \u00bfPero qu\u00e9 ocurre cuando desvelamos la verdad sobre su accesibilidad en la web? Aqu\u00ed descubriremos c\u00f3mo estas capas visuales afectan a la <strong>experiencia de usuario<\/strong> y a la <strong>accesibilidad<\/strong>.<\/p>\n<h2><strong>Definici\u00f3n de <em>overlay<\/em> de accesibilidad<\/strong><\/h2>\n<p>En primer lugar, hablaremos de los<strong> overlays<\/strong>, en el contexto digital. Se refieren a <strong>capas visuales que se superponen al contenido principal de una p\u00e1gina web o aplicaci\u00f3n<\/strong>. Estas capas adicionales pueden tener diversas funciones, como mostrar informaci\u00f3n adicional, presentar anuncios, solicitar interacciones del usuario, o proporcionar notificaciones.<\/p>\n<p>Pueden tomar diversas formas, como ventanas emergentes (<em>pop-ups<\/em>), modales que ocupan toda la pantalla, banners que se deslizan desde el borde, entre otros. Su prop\u00f3sito var\u00eda y puede incluir desde la captaci\u00f3n de la atenci\u00f3n del usuario hasta la presentaci\u00f3n de contenido cr\u00edtico, aunque m\u00e1s tarde hablaremos de los diferentes tipos que hay y como funcionan.<\/p>\n<p>Hay que a\u00f1adir a esto que los <em>overlays<\/em> no es solo cosa de p\u00e1ginas web, si no tambi\u00e9n las hay en plataformas como YouTube, Twitch, Discord e incluso en Photoshop para agregar efectos a las im\u00e1genes.<\/p>\n<h2><strong>Importancia de la accesibilidad en la web<\/strong><\/h2>\n<p>Es importante <strong>utilizar <em>overlays<\/em> con precauci\u00f3n<\/strong>, ya que un uso excesivo o intrusivo puede afectar negativamente a la experiencia de usuario y a la accesibilidad del sitio web.<\/p>\n<p>A primera vista, estos elementos visuales pueden pasar desapercibidos, pero las personas que dependen de tecnolog\u00eda de asistencia son las verdaderas testigos de su presencia. Estas capas visuales, aparentemente inofensivas, pueden convertirse en <strong>obst\u00e1culos invisibles<\/strong> para aquellos que necesitan adaptaciones para navegar por la web.<\/p>\n<p>La tecnolog\u00eda de superposici\u00f3n (<em>overlays<\/em>) puede interferir con las configuraciones preferidas de los usuarios que utilizan tecnolog\u00eda de asistencia, anulando sus preferencias y <strong>dificultando el acceso al contenido<\/strong>. Esto reduce la accesibilidad y puede obligar a los usuarios a adaptarse a la superposici\u00f3n, en lugar de usar sus configuraciones preferidas.<\/p>\n<h2><strong>Como funcionan los <em>overlays<\/em> de accesibilidad<\/strong><\/h2>\n<p>Estos son algunos tipos de <strong><em>overlays<\/em> de accesibilidad<\/strong> que, en apariencia, prometen funciones atractivas al momento de adquirirlos, pero en la realidad, no cumplen con lo prometido:<\/p>\n<p><strong>&#8211; Lectores de pantalla virtuales:<\/strong><\/p>\n<p style=\"padding-left: 40px;\"><strong>Descripci\u00f3n:<\/strong> Simulan la experiencia de un lector de pantalla para permitir a los usuarios probar la accesibilidad de su sitio web.<\/p>\n<p style=\"padding-left: 40px;\"><strong>Funci\u00f3n:<\/strong> Ayudar a identificar y corregir problemas de accesibilidad relacionados con la lectura de contenido.<\/p>\n<p><strong>&#8211; Ajustes de contraste y tama\u00f1o de texto:<\/strong><\/p>\n<p style=\"padding-left: 40px;\"><strong>Descripci\u00f3n: <\/strong>Permiten a los usuarios personalizar el contraste, el tama\u00f1o y el estilo del texto.<\/p>\n<p style=\"padding-left: 40px;\"><strong>Funci\u00f3n: <\/strong>Mejorar la legibilidad del texto para usuarios con discapacidades visuales o dificultades de lectura.<\/p>\n<p><strong>&#8211; Funciones de lectura en voz alta:<\/strong><\/p>\n<p style=\"padding-left: 40px;\"><strong>Descripci\u00f3n: <\/strong>Ofrecen capacidades de lectura en voz alta para mejorar la accesibilidad para personas con discapacidades visuales o de lectura.<\/p>\n<p style=\"padding-left: 40px;\"><strong>Funci\u00f3n: <\/strong>Proporcionar una alternativa auditiva para la informaci\u00f3n visual.<\/p>\n<p><strong>&#8211; <\/strong><strong>Ayudas de navegaci\u00f3n simplificadas:<\/strong><\/p>\n<p style=\"padding-left: 40px;\"><strong>Descripci\u00f3n: <\/strong>Incluyen opciones como men\u00fas desplegables simplificados o teclas de acceso r\u00e1pido.<\/p>\n<p style=\"padding-left: 40px;\"><strong>Funci\u00f3n: <\/strong>Facilitar la navegaci\u00f3n para usuarios con dificultades motoras o cognitivas.<\/p>\n<p><strong>&#8211; Ajustes de interactividad:<\/strong><\/p>\n<p style=\"padding-left: 40px;\"><strong>Descripci\u00f3n: <\/strong>Permiten ajustar la velocidad de animaciones o desactivar ciertos elementos interactivos.<\/p>\n<p style=\"padding-left: 40px;\"><strong>Funci\u00f3n: <\/strong>Adaptar la interacci\u00f3n del usuario para aquellos que pueden verse afectados negativamente por ciertos est\u00edmulos visuales o interacciones r\u00e1pidas.<\/p>\n<h2><strong>Ventajas y desventajas<\/strong><\/h2>\n<p>Como \u00fanica ventaja se podr\u00eda decir que est\u00e1n creados para dar soluciones r\u00e1pidas y f\u00e1ciles para hacer que lo sitios sean m\u00e1s accesibles, aunque como ya he dicho antes muchos de ellos no abordan los problemas de la accesibilidad.<\/p>\n<p>Si embargo hay bastantes desventajas, en primer lugar, algunos <strong>overlays<\/strong> pueden presentar <strong>desaf\u00edos de accesibilidad<\/strong>, especialmente para personas con discapacidades visuales, algunos te obligan a usar la superposici\u00f3n en lugar de poder usar tus recursos.<\/p>\n<p>En segundo lugar, los <em>overlays<\/em> <strong>pueden no funcionan de manera uniforme en todos los dispositivos y navegadores<\/strong>. Muchos de ellos est\u00e1n dise\u00f1ados para pantallas grandes o no se ajustan bien al cambio de orientaci\u00f3n.<\/p>\n<p>En tercer lugar, <strong>pueden interferir con las funciones normales del navegador<\/strong>, como la navegaci\u00f3n hacia atr\u00e1s o desactivaci\u00f3n del bot\u00f3n derecho del rat\u00f3n.<\/p>\n<p>Tambi\u00e9n, los <em>overlays<\/em> complejos pueden tener un <strong>impacto significativo en el rendimiento de la p\u00e1gina<\/strong> o la aplicaci\u00f3n.<\/p>\n<p>Por \u00faltimo, si hablamos de accesibilidad estamos diciendo que es un <strong>proceso continuo de mantenimiento<\/strong> y los overlays normalmente no se actualizan regularmente, por lo tanto pueden llegar a dejar de ser efectivas.<\/p>\n<h2><strong>Alternativas a los <em>overlays<\/em><\/strong><\/h2>\n<p>Como hab\u00e9is podido observar los <em>overlays<\/em> no siempre son nuestros mejores aliados, por no decir nunca; es mejor ponerse en manos de <a href=\"https:\/\/mtp.global\/es\/servicios\/accesibilidad-digital-y-ux\/\" target=\"_blank\" rel=\"noopener\"><strong>expertos en accesibilidad web<\/strong><\/a>, en vez de caer en la trampa e invertir en herramientas que no son accesibles (ya que te presentan la informaci\u00f3n de manera persuasiva y atractiva) y as\u00ed hacer un mundo m\u00e1s inclusivo para todo tipo de usuarios que navegan por nuestras webs.<\/p>\n<p><strong>\u00a1Mejor, ponte en manos de expertos, la accesibilidad te guiar\u00e1 hacia tus proyectos!<\/strong><\/p>\n<h2><strong>Riesgos legales<\/strong><\/h2>\n<p>Los<strong> proveedores<\/strong> de estos servicios aseguran que son 100% accesibles e intentan imitar a las funcionalidades que ya existen en los navegadores y sistemas operativos. Esto hace que haya p\u00e1ginas en las que navegar por ellas sea dificultoso, adem\u00e1s que solo pueden detectar entre un 20% &#8211; 30% de problemas de accesibilidad.<\/p>\n<p>Hay que a\u00f1adir que dicen que garantizan el cumplimiento legal y reglamentario que cubre la norma WCAG 2.1 y 2.2 AA. <strong>Hasta el d\u00eda de<\/strong> <strong>hoy no hay ninguna tecnolog\u00eda que solucione la accesibilidad en las webs al 100%.<\/strong> Por otro lado, muchos de ellos mienten sobre el n\u00famero de clientes que tienen y los productos parecen m\u00e1s populares de lo que son en realidad.<\/p>\n<p>La mayor\u00eda de las funcionalidades replican caracter\u00edsticas ya presentes en navegadores y sistemas operativos. En lugar de duplicar estas funciones, ser\u00eda m\u00e1s eficiente que los usuarios conocieran las caracter\u00edsticas existentes. Adem\u00e1s, algunas superposiciones pueden rastrear autom\u00e1ticamente el uso de tecnolog\u00edas de asistencia, lo cual puede plantear <strong>problemas de privacidad<\/strong>, ya que la informaci\u00f3n sobre discapacidades suele ser confidencial. La opci\u00f3n de optar por no participar en este seguimiento es crucial.<\/p>\n<p>Las superposiciones no arreglan la accesibilidad de un sitio web y no cumplen con la legislaci\u00f3n europea. Creer lo contrario puede llevar a una percepci\u00f3n equivocada. <strong>La mejora de la accesibilidad debe abordarse directamente en el dise\u00f1o y desarrollo del sitio<\/strong>.<\/p>\n<p>Adem\u00e1s, una gran mayor\u00eda 67% de los encuestados califica estas herramientas como nada o poco efectivas y solo el 3,3% las califica como muy efectiva. En el caso de las personas con discapacidad un 72% en la<strong><u><a href=\"https:\/\/webaim.org\/projects\/practitionersurvey3\/#overlay\" target=\"_blank\" rel=\"noopener\"> encuesta de WebAIM<\/a><\/u><\/strong>, una entidad sin \u00e1nimo de lucro dedicada a la investigaci\u00f3n en accesibilidad web, califica los overlays o widgets de accesibilidad como poco o nada efectivos y solo un 2,4% las calific\u00f3 como muy efectivas. Sus informes revelan que la experiencia del usuario mejora significativamente en p\u00e1ginas que no utilizan estos elementos de accesibilidad.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Explicamos en este post qu\u00e9 son los &#8216;overlays&#8217; en las p\u00e1ginas web y aplicaciones, y los desaf\u00edos que presentan en lo relativo a la accesibilidad digital<\/p>\n","protected":false},"author":9,"featured_media":33609,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[205],"tags":[],"class_list":["post-33611","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-accesibilidad-digital-y-ux"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.1.1 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>\u00bfSon realmente accesibles los overlays en la web?<\/title>\n<meta name=\"description\" content=\"Los overlays pueden ofrecer mejoras o complicar la experiencia de usuario y la accesibilidad digital. Descubre sus pros y contras con MTP.\" \/>\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\/son-realmente-accesibles-overlays-web\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u00bfSon realmente accesibles los overlays en la web?\" \/>\n<meta property=\"og:description\" content=\"Los overlays pueden ofrecer mejoras o complicar la experiencia de usuario y la accesibilidad digital. Descubre sus pros y contras con MTP.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/\" \/>\n<meta property=\"og:site_name\" content=\"MTP Espa\u00f1a\" \/>\n<meta property=\"article:published_time\" content=\"2024-07-03T13:47:14+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/mtp.global\/es\/wp-content\/uploads\/2024\/07\/MTP-Blog-post-overlays.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=\"MTP\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"MTP\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutos\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\u00bfSon realmente accesibles los overlays en la web?","description":"Los overlays pueden ofrecer mejoras o complicar la experiencia de usuario y la accesibilidad digital. Descubre sus pros y contras con MTP.","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\/son-realmente-accesibles-overlays-web\/","og_locale":"es_ES","og_type":"article","og_title":"\u00bfSon realmente accesibles los overlays en la web?","og_description":"Los overlays pueden ofrecer mejoras o complicar la experiencia de usuario y la accesibilidad digital. Descubre sus pros y contras con MTP.","og_url":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/","og_site_name":"MTP Espa\u00f1a","article_published_time":"2024-07-03T13:47:14+00:00","og_image":[{"width":1920,"height":1080,"url":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2024\/07\/MTP-Blog-post-overlays.jpg","type":"image\/jpeg"}],"author":"MTP","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"MTP","Tiempo de lectura":"6 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/#article","isPartOf":{"@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/"},"author":{"name":"MTP","@id":"https:\/\/mtp.global\/es\/#\/schema\/person\/1186350db6f59e8360dd481150654813"},"headline":"\u00bfSon realmente accesibles los &#8216;overlays&#8217; en la web?","datePublished":"2024-07-03T13:47:14+00:00","mainEntityOfPage":{"@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/"},"wordCount":1209,"publisher":{"@id":"https:\/\/mtp.global\/es\/#organization"},"image":{"@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/#primaryimage"},"thumbnailUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2024\/07\/MTP-Blog-post-overlays.jpg","articleSection":["Accesibilidad digital y UX"],"inLanguage":"es"},{"@type":"WebPage","@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/","url":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/","name":"\u00bfSon realmente accesibles los overlays en la web?","isPartOf":{"@id":"https:\/\/mtp.global\/es\/#website"},"primaryImageOfPage":{"@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/#primaryimage"},"image":{"@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/#primaryimage"},"thumbnailUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2024\/07\/MTP-Blog-post-overlays.jpg","datePublished":"2024-07-03T13:47:14+00:00","description":"Los overlays pueden ofrecer mejoras o complicar la experiencia de usuario y la accesibilidad digital. Descubre sus pros y contras con MTP.","breadcrumb":{"@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/#primaryimage","url":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2024\/07\/MTP-Blog-post-overlays.jpg","contentUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2024\/07\/MTP-Blog-post-overlays.jpg","width":1920,"height":1080},{"@type":"BreadcrumbList","@id":"https:\/\/mtp.global\/es\/blog\/accesibilidad-digital-y-ux\/son-realmente-accesibles-overlays-web\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/mtp.global\/es\/home\/"},{"@type":"ListItem","position":2,"name":"\u00bfSon realmente accesibles los &#8216;overlays&#8217; en la web?"}]},{"@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\/1186350db6f59e8360dd481150654813","name":"MTP","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/mtp.global\/es\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/9f80fcebb065607a1066a38846083841707346cf76ca0c1df24aea7a0c5d4047?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/9f80fcebb065607a1066a38846083841707346cf76ca0c1df24aea7a0c5d4047?s=96&d=mm&r=g","caption":"MTP"},"url":"https:\/\/mtp.global\/es\/blog\/author\/marketing\/"}]}},"fimg_url":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2024\/07\/MTP-Blog-post-overlays.jpg","_links":{"self":[{"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/posts\/33611","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\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/comments?post=33611"}],"version-history":[{"count":0,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/posts\/33611\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/media\/33609"}],"wp:attachment":[{"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/media?parent=33611"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/categories?post=33611"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/tags?post=33611"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}