Comment pouvez-vous définir un hyperlien pour qu'il s'ouvre dans une nouvelle fenêtre ou un nouvel onglet du navigateur ?

Utilisation de l'attribut target avec une valeur de '_blank' pour ouvrir un hyperlien dans une nouvelle fenêtre ou un nouvel onglet

Lors de la création d'un site web, il peut être nécessaire de faire en sorte qu'un hyperlien s'ouvre dans une nouvelle fenêtre ou un nouvel onglet de navigateur. Pour cela, HTML (HyperText Markup Language) dispose d'une solution simple et efficace : l'utilisation de l'attribut target avec la valeur "_blank".

Explication de l'attribut "target"

L'attribut "target" en HTML est utilisé pour spécifier où ouvrir le document lié. C'est un attribut optionnel et peut être utilisé avec des éléments de balise d'ancre (<a>). Il existe plusieurs valeurs que cet attribut peut accepter ;

  • "_blank": pour ouvrir le document lié dans une nouvelle fenêtre ou un nouvel onglet
  • "_self" : pour ouvrir le document dans la même fenêtre/tab (c'est la valeur par défaut)
  • "_parent" : pour ouvrir le document dans le cadre parent
  • "_top" : pour ouvrir le document dans le corps entier de la fenêtre

Dans le cas de notre question, la valeur qui nous intéresse est "_blank".

Exemple d'utilisation avec _blank

Voici un exemple d'hyperlien ouvrant une nouvelle fenêtre ou un nouvel onglet de navigateur :

<a href="https://www.example.com" target="_blank">Cliquez ici</a>

Dans cet exemple, lorsque l'utilisateur clic sur le lien "Cliquez ici", le site www.example.com s'ouvrira dans une nouvelle fenêtre ou un nouvel onglet.

Bonnes pratiques

Il est important de noter que l'utilisation de "_blank" doit être faite avec parcimonie. L'ouverture de nouveaux onglets ou fenêtres peut, en effet, être perturbante pour l'utilisateur.

Dans les cas où son utilisation est jugée nécessaire, pensez également à utiliser rel="noopener" ou rel="noreferrer" pour des raisons de performance et de sécurité. En effet, sans ces attributs, la page liée pourrait potentiellement accéder à votre page via la propriété window.opener et rediriger votre page vers une URL différente.

Ainsi, l'exemple précédent devient :

<a href="https://www.example.com" target="_blank" rel="noopener noreferrer">Cliquez ici</a>

En résumé, l'attribut target="_blank" en HTML est une manière facile et pratique d'ouvrir un hyperlien dans une nouvelle fenêtre ou un nouvel onglet du navigateur. Cependant, l'utilisation de cet attribut doit être soigneusement réfléchie afin de ne pas gêner l'expérience utilisateur.

Trouvez-vous cela utile?