Frames dépréciées ; utilisez uniquement _blank
La seule valeur actuellement pertinente de target est _blank. Les autres valeurs de target étaient utilisées pour spécifier des cadres spécifiques. Cependant, les cadres ont été dépréciés en HTML5.
Cible par défaut
Si aucun target n’est spécifié, le lien s’ouvrira dans le contexte actuel, sauf si l’utilisateur ou le navigateur spécifie le contraire.
a target= »_blank » Ouvrir dans un nouvel onglet (ou une nouvelle fenêtre) du navigateur)
L’attribut target spécifie où le document lié s’ouvrira lorsque le lien est cliqué. La valeur par défaut est la fenêtre actuelle. Si target="_blank", le document lié s’ouvrira dans un nouvel onglet ou (sur les navigateurs plus anciens) dans une nouvelle fenêtre.
Pourquoi ouvrir dans un nouveau navigateur?
La raison la plus courante d’utiliser `target= »_blank » est que les liens hors site s’ouvrent dans un onglet séparé. Cela permet à un utilisateur de cliquer sur une référence et d’y revenir plus tard sans quitter la page actuelle. Cela permet de garder les visiteurs sur votre site plus longtemps et d’améliorer la plupart de vos métriques : taux de rebond, conversion, pages visitées.
Ouvrir tous les liens externes dans un nouvel onglet avec JavaScript
Vous n’avez pas besoin d’ajouter manuellement target="_blank" à chaque lien sur votre site. Si vous créez beaucoup de liens (ce que vous devriez faire), il est facile d’ajouter un peu de code JavaScript à votre site et de transformer automatiquement tous les liens externes en liens _blank.
jQuery(document.links) .filter(function() { return this.hostname != window.location.hostname; }) .attr('target', '_blank'); (Vous pouvez voir une forme légèrement modifiée de ce code en action sur chaque page de ce site Web). Cette astuce nécessite jQuery, mais il y a de fortes chances que vous l’utilisiez déjà. Il est utilisé dans les frameworks et les systèmes de gestion de contenu les plus populaires, notamment WordPress, Drupal et Twitter Bootstrap. Si vous devez le faire sans jQuery, c’est également possible. Voici une version « 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(); En plus de faciliter les choses, cela nettoie considérablement votre balisage.
Raisons de ne pas utiliser `target= »_blank »
Certains affirment que les utilisateurs ne préfèrent pas ouvrir les liens dans un nouveau contexte de navigation. Ils pensent que faire cela est similaire aux publicités popup et à d’autres comportements gênants. Avec l’essor de la navigation par onglets, cet argument a largement disparu. La plupart des utilisateurs préfèrent ouvrir des liens dans un nouvel onglet, car cela leur permet de venir mettre en file d’attente des liens référencés pour une lecture ultérieure sans perdre leur contexte de navigation actuel.
Valeurs de l’attribut cible
| Notes | ||
|---|---|---|
| _blank | Ouvre le document lié dans un nouvel onglet ou une nouvelle fenêtre. | |
| _parent | Ouvre le lien dans le cadre parent. Les cadres sont dépréciés en HTML5. | |
| _self | Ouvrir le lien dans le cadre actuel. | |
| _top | Ouvrir le lien dans le cadre le plus haut. Les cadres sont dépréciés en HTML5. | |
| Nom du cadre | Ouvre le lien dans le cadre nommé. Les cadres sont dépréciés en HTML5. |
Tous les attributs de l’élément ancre
| Nom de l’attribut | Valeurs | Notes |
|---|---|---|
| hreflang | Spécifie la langue de la ressource liée. | |
| download | Dirige le navigateur à télécharger la ressource liée plutôt que de l’ouvrir. | target | _blank _parent _self _top frame name |
Spécifie le contexte dans lequel la ressource liée s’ouvrira. |
| Titre | texte | Définit le titre d’un lien, qui apparaît à l’utilisateur comme une infobulle. |
| href | url | Spécifie le document, la ressource ou l’emplacement lié. |
| Nom |
