Esta traducción aún no ha sido revisada editorialmente. La versión alemana es la vinculante. Deutsche Fassung →
Barrierefreiheit
¿Cómo permanece un sitio web legible sin desplazamiento lateral en teléfono?
Un sitio web permanece legible sin desplazamiento lateral cuando su contenido en pantalla estrecha — el estándar establece 320 píxeles de ancho — se ajusta automáticamente en una sola columna. Este ancho corresponde a un teléfono estrecho o una vista muy ampliada en la computadora. Quien debe desplazarse hacia los lados para cada línea pierde el hilo al leer.
Ajuste de flujo: el contenido se organiza según el ancho
El ajuste de flujo significa: cuando el área de visualización se hace más estrecha, el contenido se reorganiza — las columnas lado a lado se deslizan una debajo de la otra, las imágenes se reducen, las líneas se rompen antes. Esto afecta a dos grupos simultáneamente. Primero, los usuarios de teléfonos móviles, es decir, para muchos sitios web la mayoría de los visitantes. En segundo lugar, personas con discapacidad visual en la computadora que amplían las páginas significativamente: con ampliación fuerte, la vista visible corresponde exactamente a tal presentación estrecha. Si la página no se ajusta, deben desplazarse hacia la derecha y hacia atrás para cada línea individual — la lectura se convierte en una prueba de paciencia. Las causas típicas son tablas de ancho fijo, mapas incrustados demasiado grandes e imágenes con dimensiones de píxeles fijos.
Así mide nuestro núcleo de medición el desplazamiento lateral
Nuestro núcleo de medición renderiza su página en un navegador real en varios anchos de pantalla — incluyendo la vista estrecha de 320 píxeles — y mide si aparece una barra de desplazamiento horizontal y cuántos píxeles se desborda el contenido. Solo el desplazamiento medido realmente cuenta como un hallazgo; para excluir aciertos al azar por retrasos de carga, la prueba mide dos veces si hay dudas y muestra resultados fluctuantes honestamente como "verifique en dispositivo real". Cada hallazgo nombra el ancho de pantalla afectado y se evidencia con una captura de pantalla. Los resultados fluyen tanto hacia el área de comprobación de accesibilidad como hacia el área de comprobación de respuesta — es la misma medición.
Beispiele
Feste Breite auf dem Handy
.inhalt { width: 1100px; }
.tabelle { min-width: 900px; }.inhalt { max-width: 1100px; width: 100%; }
.tabelle-huelle { overflow-x: auto; }Bei 320 Pixel Breite (400 Prozent Zoom) fließt der Inhalt um; nur Tabellen und Karten dürfen einen eigenen Scrollbereich haben.
- Reduzca gradualmente la ventana del navegador en la computadora hasta la columna estrecha — si aparece una barra de desplazamiento horizontal, hay un problema.
- Verifique primero las tablas: las grandes tablas de datos necesitan una solución propia en móvil, como contenedores desplazables con indicador visible.
- Pida a su agencia que reemplace anchos de píxel fijos en imágenes y contenedores con especificaciones adaptables.
- Pruebe contenido incrustado como mapas y videos en vista estrecha — los componentes externos rompen el marco con mayor frecuencia.
- Verifique la visualización móvil después de cada actualización de contenido mayor, antes de que la página sea publicada.