Skip to content

Esta traducción aún no ha sido revisada editorialmente. La versión alemana es la vinculante. Deutsche Fassung →

Responsive

¿Por qué un sitio web no debe desplazarse lateralmente en el móvil?

Un sitio web no debe desplazarse lateralmente en el móvil, porque los visitantes solo pueden alcanzar contenido si mueven la página con el dedo de un lado a otro. Muchos abandonan antes y dejan el sitio. La directriz de accesibilidad WCAG por lo tanto exige en la regla 1.4.10 que el contenido se adapte al ancho de la pantalla. El servicio de comprobación mide el saliente en píxeles en cuatro tamaños de dispositivo y nombra, donde es claramente reconocible, el elemento causante.

Así surge el desplazamiento lateral en el móvil

La causa casi siempre es un elemento con ancho fijo: una tabla con muchas columnas, una imagen en tamaño original o un componente de una plantilla construida para pantallas grandes. En un monitor de escritorio, esto es apenas perceptible, porque hay suficiente espacio. En un smartphone de 390 píxeles de ancho, el mismo elemento se extiende sobre el borde, y el navegador muestra una barra de desplazamiento horizontal. Los visitantes entonces solo ven una sección del contenido y deben mover la página constantemente mientras leen. Un único elemento demasiado ancho es suficiente para hacer que toda la página sea lateralmente desplazable —por eso vale la pena encontrar exactamente este elemento y arreglarlo.

Así mide el servicio de comprobación el saliente

La comprobación carga su página en un navegador real en cuatro tamaños de dispositivo: 390, 768, 1440 y 1920 píxeles de ancho. Luego compara el ancho del contenido con el ancho de la pantalla e intenta realmente deslizar la página hacia un lado. Solo cuando funciona, el hallazgo aplica —un saliente que el navegador se corta a sí mismo, no genera una barra de desplazamiento y por lo tanto no se reporta como tal. Cada medición se ejecuta dos veces; solo se reporta lo que ambos pasadas ven consistentemente. El informe nombra el saliente en píxeles y, donde es claramente reconocible, el elemento causante junto con una captura de pantalla. Así su agencia sabe de inmediato dónde debe comenzar.

Lo que exige la regla de accesibilidad WCAG 1.4.10

La regla 1.4.10 („Reflow”) de la directriz WCAG requiere que el contenido se adapte al ancho disponible sin que los visitantes tengan que desplazarse en dos direcciones. El pensamiento detrás: Las personas con discapacidad visual agrandan las páginas fuertemente; lo que entonces se extiende lateralmente se pierde para ellas. La misma adaptabilidad ayuda a cada visitante con una pantalla pequeña —es decir, la mayoría, porque hoy muchos sitios web se leen principalmente en el móvil. Una comprobación aprobada es por lo tanto también un paso hacia la accesibilidad y hacia un sitio web más fácil de usar. La comprobación es una investigación técnica; si existen obligaciones legales para su empresa, una asesoría legal lo aclarará.

  • Abra su página de inicio en su propio móvil y deslice hacia la izquierda y derecha. Si la página se mueve lateralmente, hay un saliente.
  • Compruebe especialmente páginas con tablas, imágenes grandes o videos incrustados —el saliente surge con mayor frecuencia allí.
  • Pase a su agencia el elemento nombrado en el informe de comprobación y la cantidad de píxeles, en lugar de hacerlos buscar.
  • Repita la mirada al móvil después de cada cambio importante en el sitio web.

Deutsche Fassung dieser Seite