Addaw, ir a inicio Donar

Fallo común Fallos comunes WCAG 2.2

F102Fallo del criterio de conformidad 1.4.10 debido a que el contenido desaparece y no está disponible al reajustarse a una ventana gráfica de 320 píxeles

En resumen

Este fallo se produce cuando, al estrechar la ventana del navegador o ampliar el zoom hasta un ancho equivalente a 320 píxeles, desaparece contenido que sí se veía en pantallas anchas (menús, buscadores, columnas laterales, imágenes informativas) y no hay forma de llegar a él. Perjudica a quienes usan mucho zoom por baja visión y a quienes navegan desde el móvil. Compruébelo con un zoom del 400 % sobre una ventana de 1280 píxeles.

Aplicabilidad

Todas las tecnologías.

Descripción

Este documento describe un fallo que se produce cuando un cambio del ancho de la ventana gráfica (viewport) a 320 px hace desaparecer contenido que estaba disponible con anchos de ventana gráfica mayores. Puede que parte del contenido disponible con anchos mayores no se muestre de la misma forma ni en la misma posición con un ancho de ventana gráfica de 320 px, simplemente porque hay menos espacio («superficie» de pantalla) para presentarlo. No obstante, ese contenido debería seguir estando disponible tras el reajuste (reflow) a un ancho de ventana gráfica de 320 px, ya sea reubicándolo en una vista de una sola columna, o mediante alguna interacción que ofrezca la información de otra manera, por ejemplo, en un área desplegable, en un diálogo o a través de un enlace a otra vista.

Ejemplos

Los siguientes ejemplos muestran el fallo de no hacer que el contenido visible con un ancho de ventana gráfica mayor esté también disponible tras un reajuste a 320 px:

  • Un bloque de enlaces a entradas del blog situado en una columna lateral desaparece por completo tras el reajuste (es decir, no está disponible más abajo en la vista de una sola columna).
  • Las etiquetas situadas sobre los campos de texto se ocultan y se sustituyen por texto de marcador (placeholder) tras el reajuste, sin una técnica que muestre etiquetas específicas al dar el foco a los campos.
  • Secciones de texto del contenido desaparecen tras el reajuste, sin que estén disponibles a través de algún componente desplegable.
  • Imágenes que aportan información desaparecen tras el reajuste, sin un enlace ni la disponibilidad de una alternativa equivalente.
  • Un campo de búsqueda global desaparece tras el reajuste, sin un icono ni una opción de menú que muestre una función de búsqueda o permita llegar a una página de búsqueda equivalente.

Pruebas

Procedimiento

  1. Revisar los elementos de contenido visibles con un ancho de ventana gráfica de escritorio, por ejemplo 1280 px.
  2. Establecer el ancho de la ventana gráfica en 320 px estrechando la ventana del navegador, o ampliando el zoom de forma que el ancho de la ventana gráfica pase a ser de 320 px (si se parte de un ancho de ventana gráfica de 1280 px con un zoom del navegador del 100 %, esto se consigue ampliando el zoom al 400 %).
  3. Para cada elemento de contenido que no se ofrece con el ancho de ventana gráfica de 320 px, comprobar que existe una forma de llegar al mismo contenido o a uno equivalente mediante componentes desplegables, ventanas emergentes o enlaces a otras vistas.

Resultados esperados

  • Si la comprobación n.º 3 es falsa, entonces se da esta condición de fallo y el contenido falla este criterio de conformidad.

Cómo lo comprobamos en ADDAW

Este fallo es uno de los que buscamos en cada auditoría de accesibilidad de ADDAW: lo documentamos con capturas y el código afectado, indicamos el criterio que incumple y la técnica suficiente con la que se corrige. Los informes siguen la metodología del Observatorio de Accesibilidad y la norma UNE-EN 301 549.

Solicitar una auditoría

Fuente y licencia

Traducción al español, no oficial, realizada por ADDAW a partir de la técnica F102 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.

Financiado por la unión europea Gobierno de españa red.es Plan de recuperación transformación y resilencia kit digital