UX / UI Impacto alto Fácil 2 minutos

Zoom de página bloqueada

Nunca impida que el usuario haga zoom en la página.

Qué es

Algunos sitios desactivan el zoom en el meta de la ventana gráfica mediante user-scalable=no o Maximum-scale=1. Entonces el usuario no puede "pellizcar" para estirar la página.

Por qué importa

Desactivar el zoom es un grave problema de accesibilidad: las personas con problemas de visión necesitan ampliar el contenido. Es una infracción de las WCAG y perjudica directamente la usabilidad en dispositivos móviles. No aporta ningún beneficio real.

Cómo hacerlo

1Elimine user-scalable=no y Maximum-scale de la metaetiqueta de la ventana gráfica.
2Mantenga solo "ancho = ancho del dispositivo, escala inicial = 1".
3Si el zoom "rompió" el diseño, corríjalo con CSS responsivo, no desactivando el zoom.

Ejemplo

Incorrecto

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

Correcto

<meta name="viewport" content="width=device-width, initial-scale=1">

Conclusión

Nunca desactives el zoom: es una solución de dos minutos con un impacto directo en la accesibilidad. Elimine user-scalable=no y la escala máxima y permita que los usuarios hagan zoom. Pertenece a las victorias rápidas e importantes en UX.

Temas relacionados