Fallo Común F52 de WCAG 2.1: Apertura automática de nuevas ventanas al cargar una página

Persona navegando en una tienda en línea en su laptop con una ventana emergente en la pantalla.

Abrir una nueva ventana automáticamente cuando se carga una página web puede ser confuso y molesto para los usuarios. Para las personas con discapacidades, este comportamiento puede ser aún más problemático, ya que interrumpe su experiencia de navegación y puede desorientarlas.

El fallo F52 ocurre cuando una página web abre una nueva ventana o pestaña de forma automática al cargar, sin la acción explícita del usuario. Esto incumple los criterios de conformidad de WCAG 2.1:

  • 3.2.1: Al recibir el foco → Los cambios de contexto no deben ocurrir automáticamente sin el consentimiento del usuario.
  • 3.2.5: Cambio por solicitud → No se deben realizar cambios de contexto a menos que el usuario los solicite.

Este problema es común en sitios web que utilizan pop-ups de publicidad o redirecciones a nuevas ventanas sin previo aviso, lo que afecta la accesibilidad y usabilidad del sitio.

Acerca de este fallo

Cuando una nueva ventana se abre de inmediato al cargar una página, los usuarios pueden:

  • Perder el foco en la página principal, lo que interfiere con su flujo de navegación.
  • Dificultarse en la navegación, especialmente si utilizan lectores de pantalla o dispositivos con asistencia.
  • Confundirse al no entender de dónde proviene la nueva ventana o cómo volver a la anterior.

Casos donde ocurre este fallo:

  • Páginas que abren automáticamente pop-ups de anuncios o promociones.
  • Sitios web que lanzan una nueva ventana de bienvenida sin interacción del usuario.
  • Aplicaciones web que cargan contenido en una nueva pestaña sin notificación previa.

Ejemplos

Ejemplo incorrecto 1: Uso de JavaScript para abrir una nueva ventana automáticamente

En este ejemplo, un script abre una nueva ventana tan pronto como la página se carga.

<script>
window.onload = function() {
window.open('oferta.html', '_blank', 'width=500,height=300');
};
</script>

🔴 Problema:

  • La nueva ventana se abre sin que el usuario lo solicite.
  • Puede causar desorientación, especialmente para usuarios de lectores de pantalla.

Solución correcta:

Elimina la apertura automática de la nueva ventana y usa un enlace para que el usuario decida si desea abrirla.

<a href="oferta.html" target="_blank">Ver oferta especial</a>

✅ ¿Qué mejora?: 

  • El usuario tiene el control de abrir o no la nueva ventana.
  • Se respeta el flujo de navegación sin interrupciones.

Ejemplo incorrecto 1: Evento onload para abrir una ventana emergente

<script>
window.addEventListener("load", function() {
window.open('publicidad.html', '_blank', 'width=400,height=200');
});
</script>

🔴 Problema:

  • La ventana emergente interrumpe la navegación del usuario.
  • No hay manera de evitarla antes de que se cargue.

Solución correcta:

Usar un botón o un enlace con un aviso claro para que el usuario decida abrir la nueva ventana.

<button onclick="window.open('publicidad.html', '_blank', 'width=400,height=200')">
Ver anuncio
</button>

✅ ¿Qué mejora?: 

El usuario decide si interactuar con el contenido.

Se evita que la página modifique el contexto sin previo aviso.

Errores comunes y cómo evitarlos

Errores frecuentes:

  • Uso de window.onload o window.open() para abrir una nueva ventana sin previo aviso.
  • Pop-ups de publicidad automática, que alteran la navegación.
  • Apertura de páginas en nuevas pestañas sin interacción del usuario.

Cómo evitar estos errores:

  • Usa enlaces (<a href="..." target="_blank">) en lugar de scripts automáticos.
  • Si es necesario abrir una nueva ventana, informa al usuario con un botón o mensaje.
  • Prioriza un diseño accesible y centrado en el usuario, evitando interrupciones innecesarias.

Preguntas frecuentes sobre el fallo común F52

¿Está prohibido abrir nuevas ventanas en WCAG?

No, pero solo deben abrirse si el usuario lo solicita. Las aperturas automáticas son lo que WCAG prohíbe.

¿Cómo saber si mi sitio web tiene este problema?

Si al cargar una página aparece una nueva ventana sin hacer clic en nada, tu sitio falla en este criterio.

¿Es accesible abrir enlaces en una nueva pestaña?

Sí, si se hace de manera informada. Agregar target="_blank" en enlaces y notificar al usuario es una práctica válida.

¿Por qué es un problema abrir ventanas automáticamente?

Porque interrumpe la navegación, confunde a los usuarios y puede dificultar la interacción con tecnologías de asistencia.

¿Cómo puedo corregir este fallo?

Elimina scripts que abren ventanas sin interacción y reemplázalos por enlaces o botones de acción.

¿Las ventanas emergentes de cookies incumplen este criterio?

No, porque suelen estar integradas en la página y no cambian el foco del usuario de manera inesperada.

Recursos relacionados

Pruebas y validación

Procedimiento

  1. Cargar la página web en un navegador.
  2. Verificar si una nueva ventana o pestaña se abre automáticamente.
  3. Comprobar si la nueva ventana recibe automáticamente el foco.

Resultados esperados

  • ✅ Si no se abre una nueva ventana automáticamente, el contenido cumple con WCAG 3.2.1 y 3.2.5.
  • ❌ Si la nueva ventana se abre sin interacción del usuario y recibe foco, la página falla estos criterios.

Evitar la apertura automática de nuevas ventanas mejora la accesibilidad y usabilidad de un sitio web. Implementa prácticas que den control al usuario y aseguren una experiencia fluida para todos.

💡 ¿Necesitas ayuda con la accesibilidad de tu web? Contáctanos y optimiza tu sitio para todos los usuarios. ✅

¿Tienes dudas? Solicita una consultoría inicial gratuita

Evaluamos tu sitio web para identificar barreras que dificultan el acceso a personas con discapacidad. Te entregamos un informe con errores detectados y soluciones para que tu web sea usable por todos.

Solicitar Consultoría

Textos legales

Redes sociales

Linkedin