Frames obsoletos; usa sólo _blank
El único valor actualmente relevante de target
es _blank
. Los demás valores de target
se utilizaban para especificar marcos concretos. Sin embargo, los marcos han quedado obsoletos en HTML5.
Destino por defecto
Si no se especifica ningún target
, el enlace se abrirá en el contexto actual, a menos que el usuario o el navegador especifiquen lo contrario.
a target=»_blank» Open in New Browser Tab (or Window)
El atributo target
especifica dónde se abrirá el documento enlazado cuando se haga clic en el enlace. El valor predeterminado es la ventana actual. Si target="_blank"
, el documento enlazado se abrirá en una nueva pestaña o (en los navegadores más antiguos) en una nueva ventana.
¿Por qué se abre en un nuevo navegador?
La razón más común para utilizar `target=»_blank» es para que los enlaces externos se abran en una pestaña aparte. Esto permite a un usuario hacer clic en una referencia y volver a ella más tarde sin salir de la página actual. Mantiene a los visitantes en tu sitio durante más tiempo y mejora la mayoría de tus métricas: tasa de rebote, conversión, páginas visitadas.
Abre todos los enlaces externos en una nueva pestaña con JavaScript
No necesitas añadir manualmente target="_blank"
a cada enlace de tu sitio. Si enlazas mucho hacia fuera (lo que deberías hacer), es fácil añadir algo de código JavaScript a tu sitio y convertir todos los enlaces externos en enlaces _blank
automáticamente.
jQuery(document.links) .filter(function() { return this.hostname != window.location.hostname; }) .attr('target', '_blank');
(Puedes ver una forma ligeramente modificada de este código en acción en cada página de este sitio web). Este truco requiere jQuery, pero es muy probable que ya lo estés usando. Se utiliza en los frameworks y sistemas de gestión de contenidos más populares, incluyendo WordPress, Drupal y Twitter Bootstrap. Si necesitas hacerlo sin jQuery, también se puede hacer. Aquí tienes una versión «plain JavaScript»:
function externalLinks() { for(var c = document.getElementsByTagName("a"), a = 0;a < c.length;a++) { var b = c; b.getAttribute("href") && b.hostname !== location.hostname && (b.target = "_blank") } } ; externalLinks();
Además de facilitarlo, esto limpia tu marcado considerablemente.
Razones para no usar `target=»_blank»
Algunas personas argumentan que los usuarios no prefieren abrir los enlaces en un nuevo contexto de navegación. Piensan que hacerlo es similar a los anuncios emergentes y otros comportamientos molestos. Con el auge de la navegación por pestañas, este argumento ha desaparecido en gran medida. La mayoría de los usuarios prefieren abrir los enlaces en una nueva pestaña, porque les permite venir a la cola de los enlaces referenciados para leerlos más tarde sin perder su contexto de navegación actual.
Valores del Atributo de destino
Nombre del valor | Notas | _blank | Abre el documento enlazado en una nueva pestaña o ventana. |
---|---|
_parent | Abre el enlace en el marco padre. Los marcos están obsoletos en HTML5. |
_self | Abre el enlace en el marco actual. | _top | Abre el enlace en el marco superior. Los marcos están obsoletos en HTML5. |
nombre del marco | Abre el enlace en el marco nombrado. Los marcos están obsoletos en HTML5. |
Nombre del atributo | Valores | Notas |
---|---|---|
hreflang | Especifica el idioma del recurso enlazado. | |
descargar | Indica al navegador que descargue el recurso enlazado en lugar de abrirlo. | |
destino | Blanco Padre Auto Nombre del marco |
Especifica el contexto en el que se abrirá el recurso enlazado. |
título | texto | Define el título de un enlace, que aparece al usuario como tooltip. |
href | url | Especifica el documento, recurso o ubicación enlazado. | Nombre |