{"id":29320,"date":"2022-11-03T14:00:08","date_gmt":"2022-11-03T13:00:08","guid":{"rendered":"https:\/\/www.mtp.es\/?p=29320"},"modified":"2026-03-24T10:48:05","modified_gmt":"2026-03-24T09:48:05","slug":"como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible","status":"publish","type":"post","link":"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/","title":{"rendered":"C\u00f3mo asegurar la creaci\u00f3n de contenido din\u00e1mico a trav\u00e9s de c\u00f3digo para que sea accesible"},"content":{"rendered":"<p>El aseguramiento de la <a href=\"https:\/\/mtp.global\/es\/servicios\/accesibilidad-digital-y-ux\/\"><strong>accesibilidad web<\/strong><\/a> y de apps es una tarea en la que trabaja MTP a trav\u00e9s de su <strong>departamento de <a href=\"https:\/\/mtp.global\/es\/experiencia-usuario-ux\/\">UX<\/a><\/strong>. Conseguir ese objetivo requiere la aplicaci\u00f3n de una serie de buenas pr\u00e1cticas de dise\u00f1o y desarrollo, basadas en los criterios de accesibilidad de las WCAG 2.1.<\/p>\n<p>A continuaci\u00f3n, comentaremos los criterios de accesibilidad de las WCAG 2.1 relacionados con el apartado al que dedicamos este post de hoy, que es el de la creaci\u00f3n de contenido din\u00e1mico.<\/p>\n<h2><strong>Criterios WCAG 2.1. relacionados con contenido din\u00e1mico<\/strong><\/h2>\n<p><strong>Criterio 1.1.1. Contenido no textual:<\/strong> Hacer que el contenido no textual tenga alternativas textuales.<\/p>\n<p><strong>Criterio 1.3.1. Informaci\u00f3n y relaciones<\/strong>: Asegurar que la informaci\u00f3n y los elementos relacionados como encabezados, listas, tablas y formularios, se mantengan incluso cuando se cambie el formato de presentaci\u00f3n.<\/p>\n<p><strong>Criterio 1.3.2. Secuencia con sentido<\/strong>: Mantener el orden de lectura correcto para su comprensi\u00f3n.<\/p>\n<p><strong>Criterio 1.4.13 Contenido en Hover o Focus<\/strong>: Asegurar que los contenidos que se muestran u ocultan cuando reciben o pierden el puntero o el foco del teclado pueden ser percibidos y descartados.<\/p>\n<p><strong>Criterio 2.1.1. Teclado<\/strong>: Garantizar que el usuario pueda operar a trav\u00e9s de teclado, todo el contenido, tanto los iniciales como los generados din\u00e1micamente.<\/p>\n<p><strong>Criterio 2.1.2. Sin trampas de teclado<\/strong>: Comprobar que la navegaci\u00f3n mediante tabulador no quede atrapada en ninguna parte del contenido.<\/p>\n<p><strong>Criterio 2.2.1. Secuencia temporal ajustable:<\/strong> Cerciorarse que los usuarios con discapacidad tienen el tiempo suficiente para interactuar con el contenido.<\/p>\n<p><strong>Criterio 2.4.3. Orden del foco:<\/strong> Verificar que los usuarios pueden interactuar a trav\u00e9s del teclado, navegar de forma secuencial por el contenido y encontrar la informaci\u00f3n en el orden que corresponde.<\/p>\n<p><strong>Criterio 2.4.4. Prop\u00f3sito de los enlaces (en contexto): <\/strong>Asegurar que el prop\u00f3sito de los enlaces sea comprensible de tal forma que el usuario pueda decir si seguir el enlace o no.<\/p>\n<p><strong>Criterio 2.4.7. Foco visible<\/strong>: Garantizar que el indicador del foco del teclado se pueda localizar visualmente en todo momento.<\/p>\n<p><strong>Criterio 3.2.1. Al recibir el foco<\/strong>: Verificar que cuando cualquier componente de la interfaz recibe el foco, no inicia un cambio.<\/p>\n<p><strong>Criterio 3.2.2. Al recibir entradas<\/strong>: Asegurar que el introducir datos o seleccionar un control no provoca un cambio autom\u00e1tico de contexto o que, al menos, se informe al usuario previamente.<\/p>\n<p><strong>Criterio 4.1.2. Nombre, rol y valor:<\/strong> Cerciorarse que los productos de apoyo puedan obtener informaci\u00f3n, interactuar y saber el estado de los controles de <em>interfaz<\/em> de usuario como enlaces, formularios, etc.<\/p>\n<h3><a name=\"_Toc112832867\"><\/a><strong>T\u00e9cnicas WCAG 2.1. relacionados con contenido din\u00e1mico<\/strong><\/h3>\n<p>Las WCAG 2.1. contienen un apartado de <strong>t\u00e9cnicas<\/strong> que son orientativas\/informativas, no obligatorias, pero complementarias para el contenido de los criterios. Hay que recordar que, para el cumplimiento de las WCAG, es necesaria la conformidad de los criterios, no de las t\u00e9cnicas.<\/p>\n<p>Las t\u00e9cnicas relacionadas a <em>Scripts<\/em> las podemos encontrar en el apartado <a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Techniques\/#client-side-script\" target=\"_blank\" rel=\"noopener\"><strong>Client-Side Script Techniques<\/strong>,<\/a> siendo las t\u00e9cnicas que empiezan con el c\u00f3digo \u201cSCR\u201d.<\/p>\n<p>A continuaci\u00f3n, expondremos algunos de los aspectos m\u00e1s relevantes y las t\u00e9cnicas a las que est\u00e1n relacionados.<\/p>\n<h2><strong>Independencia del dispositivo<\/strong><\/h2>\n<p>Es importante tener en cuenta que no todas las personas navegan de la misma forma. Es posible que nos encontremos con usuarios que solamente usen teclado, que usen pantalla t\u00e1ctil o que usen perif\u00e9ricos adaptados como teclados y ratones adaptados, conmutadores, <em>joystick<\/em>, \u2026<\/p>\n<p>La t\u00e9cnica del <a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Techniques\/client-side-script\/SCR20\" target=\"_blank\" rel=\"noopener\">SCR20: Uso del teclado y otras funciones espec\u00edficas del dispositivo<\/a>, est\u00e1 relacionada con el criterio 2.1.1. Teclado y el objetivo de esta t\u00e9cnica es proporcionar un evento de teclado que ejecute la misma funci\u00f3n que los eventos de <em>mouse<\/em>. Por ejemplo:<\/p>\n<table>\n<tbody>\n<tr>\n<td width=\"132\">\n<p style=\"text-align: center;\">Mousedown<\/p>\n<\/td>\n<td style=\"text-align: center;\" width=\"132\">Keydown<\/td>\n<\/tr>\n<tr>\n<td width=\"132\">\n<p style=\"text-align: center;\">Mouseup<\/p>\n<\/td>\n<td style=\"text-align: center;\" width=\"132\">Keyup<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center;\" width=\"132\">Click<\/td>\n<td width=\"132\">\n<p style=\"text-align: center;\">Keypress<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center;\" width=\"132\">Mouseover<\/td>\n<td width=\"132\">\n<p style=\"text-align: center;\">Focus<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center;\" width=\"132\">mouseout<\/td>\n<td width=\"132\">\n<p style=\"text-align: center;\">Blur<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p>La t\u00e9cnica <a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Techniques\/client-side-script\/SCR29\" target=\"_blank\" rel=\"noopener\">SCR29: para a\u00f1adir acciones accesibles desde teclado a elementos HTML est\u00e1ticos<\/a> est\u00e1 relacionada con el criterio 2.1.1. Teclado y el objetivo de esta t\u00e9cnica es mostrar como proporcionar acceso a trav\u00e9s de teclado a elementos est\u00e1ticos de HTML como son <em>div<\/em> o <em>span<\/em>, permitiendo que los elementos puedan recibir el foco del teclado y que se pueda desencadenar la acci\u00f3n desde teclado.<\/p>\n<h2><strong>Cambios din\u00e1micos de contexto<\/strong><\/h2>\n<p>Los eventos pueden disparar acciones inesperadas sin que el usuario sea consciente de que se van a producir o que ya se han producido, por ejemplo, contenido que se actualiza din\u00e1micamente, elementos que se muestran u ocultan, etc. Es importante no modificar el contexto de la pantalla sin anunciarlo a las tecnolog\u00edas de asistencia para que avisen de los cambios.<\/p>\n<p>La t\u00e9cnica del <a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Techniques\/client-side-script\/SCR19\" target=\"_blank\" rel=\"noopener\">SCR19: Usar un evento de cambio en un elemento sin causar un cambio de contexto<\/a>, est\u00e1 relacionada con los criterios 3.2.2. Al recibir entradas y el criterio 3.2.5. Cambio a petici\u00f3n (AAA) y el objetivo de esta t\u00e9cnica es mostrar c\u00f3mo utilizar el evento <em>onchange<\/em> en un elemento <em>select<\/em> para actualizar elementos de una p\u00e1gina sin que se cambie el contexto.<\/p>\n<p>La t\u00e9cnica del <a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Techniques\/client-side-script\/SCR21\" target=\"_blank\" rel=\"noopener\">SCR21: Uso de funciones del DOM para agregar contenido<\/a>, est\u00e1 relacionada con el criterio 1.3.1. Informaci\u00f3n y relaciones y el objetivo de esta t\u00e9cnica es mostrar que funciones utilizar para agregar contenido dentro del DOM.<\/p>\n<p>Esta t\u00e9cnica recomienda no utilizar los m\u00e9todos document.write(), innerHTML, outsideHTML, innerText y outsideText por no ser m\u00e9todos est\u00e1ndar de la especificaci\u00f3n DOM y, en su defecto recomienda utilizar los m\u00e9todos, createElement(), createTextNode(), appendChild(), removeChild(), insertBefore() y replaceChild().<\/p>\n<p>La t\u00e9cnica del <a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Techniques\/client-side-script\/SCR26\" target=\"_blank\" rel=\"noopener\">SCR26: Insertar contenido din\u00e1mico en el DOM inmediatamente despu\u00e9s de su elemento disparador<\/a>, est\u00e1 relacionada con el criterio 2.4.3. Orden del foco y el objetivo de esta t\u00e9cnica es colocar los elementos de <em>la interfaz<\/em> de usuario insertados en el DOM de tal manera que el orden de tabulaci\u00f3n y el orden de lectura del lector de pantalla sea el correcto.<\/p>\n<p>La t\u00e9cnica del <a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Techniques\/client-side-script\/SCR32\" target=\"_blank\" rel=\"noopener\">SCR32: Proporcionar validaci\u00f3n del lado del cliente y agregar texto de error a trav\u00e9s del DOM<\/a>, est\u00e1 relacionada con el criterio 3.3.1. Identificaci\u00f3n del error y el criterio 3.3.3. Sugerencias de error y el objetivo de esta t\u00e9cnica es mostrar un mensaje de error cuando falla la validaci\u00f3n de los campos de un formulario. El mensaje de error lo muestra en una lista que se encuentra antes del formulario. Los elementos de la lista est\u00e1n creados como enlaces que llevan a cada campo al que corresponde el error.<\/p>\n<h2><strong>Ventanas emergentes<\/strong><\/h2>\n<p>En el caso de las ventanas emergentes, nos podemos encontrar casos en los que la ventana se abra de forma autom\u00e1tica o por la acci\u00f3n directa del usuario a trav\u00e9s de la activaci\u00f3n de un enlace o bot\u00f3n.<\/p>\n<p>Pueden surgir diversas barreras, como que el usuario se mantenga ajeno a lo ocurrido porque la apertura de la ventana fue autom\u00e1tica y no notificada. O que fue activado, pero no correctamente notificado que se abrir\u00eda una nueva ventana. Tambi\u00e9n puede ocurrir que la nueva ventana no tome foco y se convierta en una barrera para personas que naveguen con teclado y usuarios de lector de pantalla.<\/p>\n<p>Lo m\u00e1s apropiado es que las ventanas aparezcan a petici\u00f3n del usuario como desencadenante de la acci\u00f3n de un bot\u00f3n o enlace, que \u00e9ste tenga un nombre indique claramente su prop\u00f3sito y que notifique a los lectores de pantalla que se abrir\u00e1 una nueva ventana. La nueva ventana tambi\u00e9n debe mantener su capacidad de redimensionarla para que las personas con baja visi\u00f3n puedan seguir navegando con su configuraci\u00f3n sin tener p\u00e9rdidas de informaci\u00f3n.<\/p>\n<p>La t\u00e9cnica del <a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Techniques\/client-side-script\/SCR37\" target=\"_blank\" rel=\"noopener\">SCR37: Creaci\u00f3n de cuadros de di\u00e1logo personalizados de forma independiente del dispositivo<\/a>, est\u00e1 relacionada con el criterio 2.4.3. Orden de foco y el objetivo de esta t\u00e9cnica es crear un cuadro de di\u00e1logo personalizado, alternativo al cuadro de di\u00e1logo proporcionado por el navegador.<\/p>\n<p>La t\u00e9cnica del <a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Techniques\/client-side-script\/SCR39\" target=\"_blank\" rel=\"noopener\">SCR39: Hacer que el contenido en \u201cfocus\u201d o \u201chover\u201d sea \u201choverable\u201d, descartable y persistente<\/a>, est\u00e1 relacionada con el criterio 1.4.13. Contenido en <em>\u201chover\u201d<\/em> o en <em>\u201cfocus\u201d<\/em> y el objetivo de esta t\u00e9cnica es proporcionar tiempo a los usuarios para leer e interactuar con el contenido que se dispara al mover el puntero o moviendo el foco. Este contenido debe permanecer visible y debe permitir que el usuario pueda mover el puntero sobre el contenido adicional.<\/p>\n<h2><strong>Tiempo<\/strong><\/h2>\n<p>En ocasi\u00f3n, hay personas que requieren de tiempo adicional para poder interactuar con el contenido. Personas con movilidad reducida, personas con baja visi\u00f3n, personas ciegas que usen lector de pantalla, personas con limitaciones cognitivas o personas que no dominen el idioma, son algunos de los ejemplos que nos podemos encontrar entre los usuarios que visiten la p\u00e1gina. Es por esta raz\u00f3n que es necesario proporcionar un tiempo razonable y\/o proporcionar la posibilidad de extender el l\u00edmite de tiempo.<\/p>\n<p>La t\u00e9cnica del <a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Techniques\/client-side-script\/SCR1\" target=\"_blank\" rel=\"noopener\">SCR1: Permitir al usuario extender el l\u00edmite de tiempo predeterminado<\/a>, est\u00e1 relacionada con el criterio 2.2.1. Secuencia de tiempo ajustable y el objetivo de esta t\u00e9cnica es permitir que el usuario pueda ampliar el tiempo predeterminado proporcionando una funcionalidad que permita solicitar un tiempo adicional.<\/p>\n<p>La t\u00e9cnica del <a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Techniques\/client-side-script\/SCR16\" target=\"_blank\" rel=\"noopener\">SCSR16: Proporcionar al usuario una advertencia de que el l\u00edmite de tiempo est\u00e1 a punto de expirar<\/a>, est\u00e1 relacionada con el criterio 2.2.1. Secuencia de tiempo ajustable y el objetivo de esta t\u00e9cnica es notificar al usuario de que el tiempo para completar la acci\u00f3n se est\u00e1 agotando.<\/p>\n<p>Como hemos mencionado anteriormente, el uso de estas t\u00e9cnicas no asegura que nuestra p\u00e1gina sea accesible, para eso deberemos cerciorarnos del cumplimiento de los criterios pero, aun as\u00ed, la aplicaci\u00f3n de estas t\u00e9cnicas ser\u00e1 un gran aporte para la accesibilidad de nuestro espacio.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>La creaci\u00f3n de contenido din\u00e1mico a trav\u00e9s de c\u00f3digo puede aportar muchos beneficios, como actualizar dicho contenido sin tener que volver a cargar la p\u00e1gina completa o hacer los elementos m\u00e1s interactivos o llamativos. Sin embargo, tambi\u00e9n puede conllevar que hagamos de nuestra web un lugar m\u00e1s inaccesible. Incluimos en este post algunos criterios y t\u00e9cnicas para intentar asegurar la accesibilidad de la web o app.<\/p>\n","protected":false},"author":9,"featured_media":29318,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[204],"tags":[],"class_list":["post-29320","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-archivo"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.1.1 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Contenido din\u00e1mico accesible: c\u00f3mo lograrlo | MTP<\/title>\n<meta name=\"description\" content=\"La creaci\u00f3n de contenido din\u00e1mico a trav\u00e9s de c\u00f3digo aporta muchos beneficios, Recordamos criterios y t\u00e9cnicas para asegurar la accesibilidad.\" \/>\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\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Contenido din\u00e1mico accesible: c\u00f3mo lograrlo | MTP\" \/>\n<meta property=\"og:description\" content=\"La creaci\u00f3n de contenido din\u00e1mico a trav\u00e9s de c\u00f3digo aporta muchos beneficios, Recordamos criterios y t\u00e9cnicas para asegurar la accesibilidad.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/\" \/>\n<meta property=\"og:site_name\" content=\"MTP Espa\u00f1a\" \/>\n<meta property=\"article:published_time\" content=\"2022-11-03T13:00:08+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-03-24T09:48:05+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/mtp.global\/es\/wp-content\/uploads\/2022\/11\/diseno-Ux-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=\"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=\"8 minutos\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Contenido din\u00e1mico accesible: c\u00f3mo lograrlo | MTP","description":"La creaci\u00f3n de contenido din\u00e1mico a trav\u00e9s de c\u00f3digo aporta muchos beneficios, Recordamos criterios y t\u00e9cnicas para asegurar la accesibilidad.","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\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/","og_locale":"es_ES","og_type":"article","og_title":"Contenido din\u00e1mico accesible: c\u00f3mo lograrlo | MTP","og_description":"La creaci\u00f3n de contenido din\u00e1mico a trav\u00e9s de c\u00f3digo aporta muchos beneficios, Recordamos criterios y t\u00e9cnicas para asegurar la accesibilidad.","og_url":"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/","og_site_name":"MTP Espa\u00f1a","article_published_time":"2022-11-03T13:00:08+00:00","article_modified_time":"2026-03-24T09:48:05+00:00","og_image":[{"width":1920,"height":1080,"url":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2022\/11\/diseno-Ux-accesibilidad.jpg","type":"image\/jpeg"}],"author":"MTP","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"MTP","Tiempo de lectura":"8 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/#article","isPartOf":{"@id":"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/"},"author":{"name":"MTP","@id":"https:\/\/mtp.global\/es\/#\/schema\/person\/1186350db6f59e8360dd481150654813"},"headline":"C\u00f3mo asegurar la creaci\u00f3n de contenido din\u00e1mico a trav\u00e9s de c\u00f3digo para que sea accesible","datePublished":"2022-11-03T13:00:08+00:00","dateModified":"2026-03-24T09:48:05+00:00","mainEntityOfPage":{"@id":"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/"},"wordCount":1647,"publisher":{"@id":"https:\/\/mtp.global\/es\/#organization"},"image":{"@id":"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/#primaryimage"},"thumbnailUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2022\/11\/diseno-Ux-accesibilidad.jpg","articleSection":["Archivo"],"inLanguage":"es"},{"@type":"WebPage","@id":"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/","url":"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/","name":"Contenido din\u00e1mico accesible: c\u00f3mo lograrlo | MTP","isPartOf":{"@id":"https:\/\/mtp.global\/es\/#website"},"primaryImageOfPage":{"@id":"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/#primaryimage"},"image":{"@id":"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/#primaryimage"},"thumbnailUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2022\/11\/diseno-Ux-accesibilidad.jpg","datePublished":"2022-11-03T13:00:08+00:00","dateModified":"2026-03-24T09:48:05+00:00","description":"La creaci\u00f3n de contenido din\u00e1mico a trav\u00e9s de c\u00f3digo aporta muchos beneficios, Recordamos criterios y t\u00e9cnicas para asegurar la accesibilidad.","breadcrumb":{"@id":"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/#primaryimage","url":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2022\/11\/diseno-Ux-accesibilidad.jpg","contentUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2022\/11\/diseno-Ux-accesibilidad.jpg","width":1920,"height":1080,"caption":"WCAG 2.1"},{"@type":"BreadcrumbList","@id":"https:\/\/mtp.global\/es\/blog\/archivo\/como-asegurar-la-creacion-de-contenido-dinamico-a-traves-de-codigo-para-que-sea-accesible\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/mtp.global\/es\/home\/"},{"@type":"ListItem","position":2,"name":"C\u00f3mo asegurar la creaci\u00f3n de contenido din\u00e1mico a trav\u00e9s de c\u00f3digo para que sea accesible"}]},{"@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\/2022\/11\/diseno-Ux-accesibilidad.jpg","_links":{"self":[{"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/posts\/29320","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=29320"}],"version-history":[{"count":0,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/posts\/29320\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/media\/29318"}],"wp:attachment":[{"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/media?parent=29320"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/categories?post=29320"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/tags?post=29320"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}