La metaetiqueta viewport controla como los navegadores m\u00f3viles muestran una p\u00e1gina web. Algunos desarrolladores y temas a\u00f1aden El problema es que bloquear el zoom impide que las personas con baja visi\u00f3n puedan ampliar el contenido para leerlo. Para muchas personas, poder hacer zoom al m\u00f3vil no es una preferencia: es una necesidad.<\/p>\n El criterio WCAG 1.4.4 exige que el texto se pueda redimensionar hasta el 200% sin p\u00e9rdida de contenido o funcionalidad, excepto para subt\u00edtulos e im\u00e1genes de texto.<\/p>\n — MAL: bloquea completamente el zoom —<\/strong> — MAL: limita el zoom al 100% —<\/strong> — BIEN: permite el zoom libre —<\/strong> La raz\u00f3n m\u00e1s habitual para bloquear el zoom es evitar que los dispositivos iOS ampl\u00eden autom\u00e1ticamente los campos de formulario cuando reciben el foco. Pero la soluci\u00f3n correcta no es bloquear el zoom: es asegurarse que los campos de formulario tengan una medida de fuente de al menos 16px, que evita el zoom autom\u00e1tico de iOS sin comprometer la accesibilidad.<\/p>\n A partir de ciertas versiones, Safari en iOS y Chrome en Android ignoran La herramienta de autoevaluaci\u00f3 de webaccessible.cat detecta autom\u00e1ticamente si la metaetiqueta viewport de tu web bloquea el zoom. Si tienes este error, la correcci\u00f3n es sencilla: elimina En WordPress, la metaetiqueta viewport suele estar al Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.<\/p>\n<\/div><\/div><\/div>user-scalable=no<\/code> o maximum-scale=1<\/code> para evitar que los usuarios ampl\u00eden la p\u00e1gina \u2014a menudo para evitar el \u00abzoom accidental\u00bb en campos de formulario o para mantener el dise\u00f1o \u00abperfecto\u00bb.<\/p>\nC\u00f3mo se bloquea el zoom y como no se tiene que hacer<\/h2>\n
\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1, user-scalable=no\"><\/code><\/p>\n
\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1, maximum-scale=1\"><\/code><\/p>\n
\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\"><\/code><\/p>\nEl argumento del ‘zoom accidental’<\/h2>\n
input, select, textarea {
\nfont-size: 16px; \/* Evita el zoom autom\u00e0tic a iOS *\/
\n}<\/code><\/p>\nNavegadores modernos ignoran user-scalable=no<\/h2>\n
user-scalable=no<\/code> por razones de accesibilidad. Pero no todos los navegadores lo hacen, y no se puede depender de este comportamiento. Hay que corregir el c\u00f3digo fuente.<\/p>\nComo detectar y corregir el error<\/h2>\n
user-scalable=no<\/code> y maximum-scale=1<\/code> de la metaetiqueta.<\/p>\nheader.php<\/code> del tema o generada por un plugin. Si usas un tema hijo (child theme), puedes sobrescribirla sin modificar el tema pare.<\/p>\n