Addaw, ir a inicio Donar

Técnica Técnicas generales WCAG 2.2

G200Abrir ventanas o pestañas nuevas solo cuando sea necesario

Nombre oficial en el W3C: Abrir nuevas ventanas y pestañas desde un enlace solo cuando sea necesario

En pocas palabras

Lo normal es que los enlaces y botones abran su destino en la misma pestaña. Abrir ventanas o pestañas nuevas por costumbre desorienta a mucha gente. Solo conviene hacerlo cuando aporta algo claro, como consultar una ayuda sin perder lo que se lleva escrito en un formulario. Y en ese caso hay que avisar antes.

Por qué es importante

Una pestaña nueva cambia el contexto sin que la persona lo haya pedido. Quien no ve la pantalla, o la ve ampliada, puede no darse cuenta del cambio. Luego pulsa «Atrás» y no funciona, porque la pestaña nueva no tiene historial.

Afecta sobre todo a personas ciegas o con baja visión y a personas con discapacidad cognitiva. Es una buena práctica recomendada. Por sí sola no basta para cumplir el criterio 3.2.5 (nivel AAA).

Cómo se hace

  1. Por defecto, no use target="_blank" ni window.open(). Deje que cada persona decida si abre el enlace en otra pestaña.
  2. Reserve la pestaña nueva para casos justificados. Por ejemplo, la ayuda de un campo dentro de un formulario largo: así no se pierden los datos ya escritos.
  3. Cuando abra una pestaña nueva, avise antes con texto o con un icono que también lean los lectores de pantalla (técnica G201).
  4. Revise los enlaces externos, redes sociales y documentos. Abrirlos en otra pestaña «para que no se vayan de la web» no es un motivo de accesibilidad.

Cómo comprobarlo

  1. Busque en el código los enlaces con target="_blank" y los scripts con window.open.
  2. Para cada uno, pregúntese si hay una razón real para abrir otra ventana o pestaña.
  3. Si la hay, compruebe que existe un aviso previo, visible y que lea el lector de pantalla.
Ver el texto completo del W3C (traducción al español)

Esta es una traducción no oficial al español de la técnica G200 de Techniques for WCAG 2.2, del W3C. Puede contener errores. El único documento oficial y normativo es la versión original en inglés, publicada en el sitio web del W3C.

Aplicabilidad

Páginas que abren nuevas ventanas o pestañas

Descripción

El objetivo de esta técnica es limitar el uso de enlaces o botones que abren nuevas ventanas o pestañas dentro del contenido web. En general, es mejor no abrir nuevas ventanas y pestañas, ya que pueden resultar desorientadoras para las personas, especialmente para quienes tienen dificultades para percibir el contenido visual. Sin embargo, hay algunas situaciones en las que, desde el punto de vista de la accesibilidad, es preferible abrir una nueva ventana o pestaña, en particular en los casos en que es importante que el usuario no pierda por accidente la noción de dónde se encuentra en la página actual; por ejemplo, mientras rellena un formulario.

Se recomienda que, cuando los enlaces vayan a abrir una nueva ventana o pestaña, se avise o se dé una pista previa a los usuarios, como un icono de «nueva ventana».

Esta técnica es recomendada. Aunque indicar que un enlace o botón «se abre en una nueva ventana o pestaña» se considera una buena práctica, no es necesario para cumplir los requisitos de ningún criterio de conformidad en particular. A la inversa, por sí sola, esta técnica no será suficiente para satisfacer los requisitos normativos de criterios de conformidad como el 3.2.5 Cambios a petición.

Ejemplo

Formulario en línea

Un formulario en línea ofrece una ayuda contextual extensa para cada campo del formulario en una página separada, porque hay demasiado texto para incluirlo dentro del formulario. Los enlaces a la ayuda contextual se abren en nuevas ventanas o pestañas para evitar la pérdida de los datos del formulario que ya se hayan introducido.

Recursos

Top-10 New Mistakes of Web Design (los diez nuevos errores principales del diseño web, en inglés)

Cómo lo comprobamos en ADDAW

En cada auditoría de ADDAW revisamos esta técnica página a página y le entregamos los errores con capturas y la forma de corregirlos.

Solicitar una auditoría

Basado en la técnica G200 del W3C (WCAG 2.2). Explicación y ejemplos: ADDAW. Traducción no oficial del texto del W3C © W3C, licencia de documentos del W3C. ¿Ha visto un error? Escríbanos.