No use el atributo de enlace Target=»_Blank» en estos casos


El uso del atributo de enlace _blank hará que el enlace se abra en una nueva ventana o pestaña del navegador.

Pero no es tan sencillo como parece.

Resulta que el atributo de enlace _blank no solo es un riesgo de seguridad, sino que también hay múltiples situaciones en las que se recomienda usar algo que no sea _blank.

En este artículo, aprenderá cuándo usar el atributo _blank no es una buena idea.

¿Qué es el atributo de enlace _Blank?

El atributo de enlace _blank le dice al navegador que abra un enlace dentro de una nueva pestaña.

Puede tener varios enlaces que usan el atributo de enlace _blank, y cada enlace diferente con ese atributo _blank, cuando se hace clic, generará una nueva pestaña del navegador.

Además, si un usuario hace clic en el mismo enlace una y otra vez, el navegador seguirá generando más y más pestañas.

¿El atributo _Blank no es ético?

Hay quienes opinan que es mejor darle al usuario la opción de abrir una nueva pestaña del navegador.

Algunas personas afirman que no es ético «atrapar» a un usuario en su sitio al abrir enlaces en una nueva ventana del navegador y al mismo tiempo mantener abierta su propia página web.

El problema con ese punto de vista es que muy probablemente la mayoría de las personas no saben que tienen la opción de abrir una nueva ventana del navegador.

Cada audiencia del sitio es técnicamente experto en diferentes niveles.

Pero probablemente sea seguro decir que muchas personas aún no saben que pueden hacer clic derecho (o hacer clic largo en un dispositivo móvil) y elegir abrir una nueva pestaña del navegador.

Por lo tanto, dar a los usuarios una «opción» realmente no es una opción.

Simplemente van a donde los envíes.

La elección «ética» de una persona de abrir un enlace en el mismo navegador web puede confundir al visitante del sitio si intenta volver a la página web original cerrando la pestaña del navegador en la que se encuentra actualmente.

El cuestión de ética se ha dejado de lado en gran medida en la actualidad.

La elección de utilizar o no el atributo de enlace _blank es una elección personal y empresarial.

Hay una razón de seguridad para no usar _Blank

El atributo de enlace target=”_blank” es riesgoso y abre un sitio web a problemas de seguridad y rendimiento.

de Google Página web.dev sobre los riesgos de usar el atributo de enlace _blank se resume así:

“La otra página puede ejecutarse en el mismo proceso que su página. Si la otra página ejecuta una gran cantidad de JavaScript, el rendimiento de su página puede verse afectado.

La otra página puede consentir a su objeto de ventana con la propiedad window.opener. Esto puede permitir que la otra página redirija su página a una URL maliciosa”.

¿La solución?

Utilice los atributos de enlace rel=”noopener” o rel=”noreferrer” para cada enlace.

  • El rel=”noopener” El atributo de enlace evita que el sitio vinculado reciba entrada a la página web original que se está vinculando. Esto evita que el sitio vinculado tome el control o influya de otra manera en el sitio vinculado.
  • El rel = ”noremitente” El atributo de enlace oculta la información de referencia del sitio al que se está enlazando. Cuando un visitante del sitio hace clic en un vínculo rel=”noreferrer”, el sitio al que se vincula no sabrá a qué sitio refirió el visitante.

El atributo de enlace rel=”noreferrer” también funciona igual que el atributo de enlace “noopener” en el sentido de que evita que el sitio vinculado tome el control del sitio vinculado.

Por lo tanto, si desea enviar información de referencia de sitios web mientras se protege de los problemas de seguridad del atributo de enlace _blank, use el atributo de enlace «noopener».

Si prefiere mantener la privacidad y no transmitir información de referencia y, al mismo tiempo, protegerse de los problemas de seguridad asociados con el uso del atributo de enlace _blank, utilice el atributo de enlace rel=”noreferrer”.

Consideraciones de seguridad de datos para páginas confidenciales

Hay situaciones específicas relacionadas con la seguridad en las que un editor puede no querer que un usuario genere varias páginas web. Uno de esos casos es un sitio web que trata con información confidencial de los clientes.

Si un sitio web relacionado con la salud o las finanzas usa _blank para enlaces a información privada, puede hacer que el visitante del sitio genere varias páginas web con información confidencial.

Sin saberlo, pueden dejar estas ventanas abiertas sin querer.

Por ejemplo, pueden cerrar la ventana principal y otra ventana y no darse cuenta de que puede haber una tercera ventana con información altamente confidencial aún abierta en una pestaña de fondo del navegador.

En ese caso, el editor de un sitio puede optar por utilizar un atributo de enlace diferente como «en blanco» (con el guión bajo _).

El atributo de enlace «en blanco» abrirá un enlace en una nueva pestaña del navegador.

Sin embargo, a diferencia del atributo de enlace _blank, todos los demás enlaces en la página web original también abrirán la página enlazada en la misma pestaña que el primer enlace en el que se hizo clic.

Por lo tanto, si tiene cinco enlaces en una página que usan el atributo de enlace «en blanco», y un usuario hace clic en el primer enlace, cualquiera de los otros cuatro enlaces cuando se hace clic abrirá las páginas web en la misma pestaña del navegador que el primer enlace en el que se hizo clic. .

Alternativo a _Atributo en blanco

Por cierto, no tienes que usar _blank. Puedes usar una palabra diferente.

La diferencia entre usar _blank y cualquier otra palabra es que usar otra palabra restringirá todos los enlaces en esa página para que se abran dentro de la misma pestaña nueva del navegador.

Por ejemplo, si codifica un enlace como este:

<a href="https://www.example.com/" target="_SEJ" rel="noreferrer">

El enlace anterior se abrirá en una nueva pestaña del navegador.

Ahora, si tiene dos enlaces con el mismo atributo de enlace:

<a href="https://www.example.com/" target="_SEJ" rel="noreferrer">

<a href="https://www.example.net/" target="_SEJ" rel="noreferrer">

Si un visitante del sitio hace clic en el primer enlace, se generará una nueva pestaña del navegador.

Si el visitante del sitio hace clic en el segundo enlace, se abrirá el enlace en la misma pestaña del navegador que el primer enlace en el que se hizo clic, esencialmente reutilizando esa misma pestaña del navegador.

Es posible que no desee utilizar _Blank para marcos en línea

Puede haber ocasiones en las que un editor necesite usar algo que no sea el atributo _blank.

Uno de esos casos es para marcos en línea.

Un marco en línea es un elemento HTML que puede contener otro documento web dentro de él.

Por ejemplo, algunos anuncios están contenidos dentro de un iframe para que terminen siendo una página web dentro de una página web.

Un marco en línea se codifica con el elemento iframe (también llamado etiqueta iframe).

Debido a que un iframe es esencialmente una página web que está incrustada dentro de otra página web, las especificaciones HTML tienen atributos de enlace que son específicos de los iframes que harán que los enlaces incrustados dentro de un iframe se comporten de cierta manera.

Todavía es posible usar _blank dentro de un iframe para generar una página web en una nueva pestaña del navegador. Pero no se recomienda si desea un comportamiento específico para un iframe.

Hay tres atributos de enlace específicos de iframe para elegir:

  1. _padre: Abrirá un enlace fuera de un iframe (así como dentro de la misma página web).
  2. _uno mismo: Abrirá el enlace dentro del mismo iframe (o la misma página web), pero solo si el enlace está en el mismo dominio. No funcionará si el enlace es a otro dominio.
  3. _cima: Se abrirá fuera de un iframe (así como dentro de la misma página web).

_Atributos de enlace en blanco

Cuando se trata del atributo de enlace _blank, probablemente esté bien generalizar y simplemente usarlo siempre que tenga un atributo de enlace noreferrer o noopener adjunto.

Dicho esto, es bueno saber que hay alternativas.

En última instancia, el uso del atributo de enlace _blank es tan fácil y complicado como usted quiera, y depende de sus necesidades específicas.

Más recursos:


Imagen destacada: Viktoria Kurpas/Shutterstock





Consultar el artículo en la publicación original

No use el atributo de enlace Target=»_Blank» en estos casos