- Cuadros obsoletos; solo use _blank
- Destino predeterminado
- a target=» _blank » Abrir en una nueva pestaña (o ventana) del navegador
- ¿Por qué abrir en un Navegador nuevo?
- Abra todos los enlaces externos en una nueva pestaña con JavaScript
- Razones para no usar ‘target =» _blank »
- Valores del atributo de destino
- Todos los Atributos del Elemento de anclaje
Cuadros obsoletos; solo use _blank
El único valor relevante de target
es _blank
. Los otros valores de target
se utilizaron para especificar marcos específicos. Sin embargo, los marcos han quedado obsoletos en HTML5.
Destino predeterminado
Si no se especifica target
, el enlace se abrirá en el contexto actual, a menos que el usuario o el navegador especifique lo contrario.
El atributo target
especifica dónde se abrirá el documento vinculado cuando se haga clic en el enlace. El valor predeterminado es la ventana actual. Si target="_blank"
, el documento vinculado se abrirá en una nueva pestaña o (en navegadores antiguos) en una nueva ventana.
La razón más común para usar ‘target =» _blank » es que los enlaces externos se abran en una pestaña separada. Esto permite al 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 por más tiempo y mejora la mayoría de tus métricas: tasa de rebote, conversión, páginas visitadas.
Abra todos los enlaces externos en una nueva pestaña con JavaScript
No necesita agregar manualmente target="_blank"
a todos los enlaces de su sitio. Si se enlaza mucho (lo que debería hacer), es fácil agregar código JavaScript a su 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');
(Puede 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 contenido más populares, incluidos WordPress, Drupal y Twitter Bootstrap. Si necesita hacerlo sin jQuery, eso también se puede hacer. Aquí hay una versión «JavaScript simple»:
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 hacerlo más fácil, esto limpia considerablemente tu margen de beneficio.
Razones para no usar ‘target =» _blank »
Algunas personas argumentan que los usuarios no prefieren abrir 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 enlaces en una nueva pestaña, ya que les permite acceder a enlaces de referencia de cola para su lectura posterior sin perder su contexto de navegación actual.
Valores del atributo de destino
Nombre de valor | Notas |
---|---|
_blank | Abre el documento vinculado en una nueva pestaña o ventana. |
_parent | Abre el vínculo en el marco principal. Los marcos están obsoletos en HTML5. |
_self | Abra el enlace en el fotograma actual. |
_top | Abre el enlace en la parte superior del marco. Los marcos están obsoletos en HTML5. |
nombre de marco | Abre el enlace en el marco con nombre. Los marcos están obsoletos en HTML5. |
Todos los Atributos del Elemento de anclaje
el nombre del Atributo | Valores | Notas |
---|---|---|
hreflang | Especifica el lenguaje de los recursos. | |
descargar | Indica al navegador que descargue el recurso vinculado en lugar de abrirlo. | |
target | _blank _parent _self _top frame name |
Especifica el contexto en el que se abrirá el recurso vinculado. |
title | text | Define el título de un enlace, que aparece para el usuario como una información sobre herramientas. |
href | url | Especifica el documento vinculado, de recursos, o la ubicación. |
nombre |