Técnica Técnicas generales WCAG 2.2
G140Separar la información y la estructura de la presentación para permitir distintas presentaciones
En resumen
Esta técnica consiste en codificar la estructura del contenido (encabezados, párrafos, listas, tablas) con los recursos semánticos de la tecnología y dejar el formato visual (tipografía, color, tamaño, posición) en una capa de presentación independiente, como CSS en HTML o las etiquetas de un PDF etiquetado. Así las tecnologías de asistencia pueden reconocer la estructura, navegar por ella y presentarla de otra forma. Es la base de un desarrollo accesible y beneficia también al mantenimiento y a la adaptación a distintos dispositivos.
Aplicabilidad
Cualquier tecnología
Descripción
El objetivo de esta técnica es facilitar la interacción de las tecnologías de asistencia con el contenido separando lógicamente la codificación estructural del contenido de la codificación de su presentación. La codificación estructural es la indicación de elementos como encabezados, párrafos, listas, tablas, etc., y se realiza utilizando las funciones de la tecnología reservadas para ese fin. En cambio, la codificación de la presentación es la indicación de efectos de formato, como el tipo de letra, el color, el tamaño, la posición, los bordes, etc., y también se apoya en funciones de la tecnología.
Aunque las características de presentación sugieren visualmente una estructura (los usuarios pueden reconocer encabezados, párrafos, listas, etc. a partir de las convenciones de formato empleadas), estas características no codifican la estructura con la suficiente claridad para que las tecnologías de asistencia puedan interactuar eficazmente con la página. Proporcionar capas separadas de estructura, funcionalidad y presentación permite que la semántica que el formato da a entender pase a ser determinable por software a través de la capa de estructura.
Seguir esta técnica permite a los agentes de usuario:
- Realizar transformaciones significativas de la estructura basadas en la estructura existente del contenido, como reordenar secciones o generar una lista de secciones o una lista de enlaces.
- Admitir la interacción con el contenido basada en características estructurales que las tecnologías de asistencia no pueden determinar solo a partir de la información de presentación. Por ejemplo, puede ser deseable ofrecer interacciones especiales con las listas, como indicar el número de elementos o saltar al final, pero esto solo es posible si la estructura de la lista está codificada además de su presentación.
- Modificar la presentación del contenido sustituyendo las reglas de presentación por otras alternativas asociadas a las características estructurales.
Ejemplos
HTML con CSS
Un documento HTML utiliza las características estructurales de HTML, como párrafos, listas, encabezados, etc., y evita las características de presentación, como los cambios de fuente, las indicaciones de maquetación, etc. Se utiliza CSS para dar formato al documento en función de sus propiedades estructurales. Unos atributos «class» bien pensados en el HTML amplían la semántica del marcado estructural cuando es necesario, para permitir un formato más flexible con CSS. Las tecnologías de asistencia pueden sustituir o ampliar el CSS para modificar la presentación, o ignorar el CSS e interactuar directamente con la codificación estructural.
PDF etiquetado
Un documento PDF consiste principalmente en el contenido con la información de formato incrustada. La información sobre la estructura se proporciona en una sección independiente del documento mediante etiquetas similares a las de XML; es lo que se denomina «PDF etiquetado». Las tecnologías de asistencia pueden utilizar la información de estas etiquetas para realizar transformaciones significativas de la estructura (p. ej., generar una lista de secciones) o para admitir la interacción con el contenido basada en características estructurales (p. ej., saltar al inicio de los formularios).
Pruebas
Procedimiento
- Examinar la codificación de un documento.
- Comprobar que la información estructural y la funcionalidad se proporcionan explícitamente y están separadas lógicamente de la información de presentación.
Resultados esperados
- La comprobación n.º 2 es verdadera
Cómo lo comprobamos en ADDAW
En las auditorías de accesibilidad de ADDAW revisamos cada criterio de conformidad siguiendo este catálogo de técnicas: comprobamos si la web aplica una técnica suficiente y documentamos cada fallo común con capturas y el código afectado, para que el equipo de desarrollo sepa exactamente qué corregir. Los informes siguen la metodología del Observatorio de Accesibilidad y la norma UNE-EN 301 549.
Fuente y licencia
Traducción al español, no oficial, realizada por ADDAW a partir de la técnica G140 del documento «Techniques for WCAG 2.2» del W3C (versión del repositorio público del W3C a 22/10/2026). Copyright © W3C® (MIT, ERCIM, Keio, Beihang). Se publica conforme a la licencia de documentos del W3C. El texto normativo de referencia es el original en inglés; si detecta un error en la traducción, escríbanos.
