Les Liens : Cas pratiques

Ouvrir un lien dans la même fenêtre ou dans une fenêtre différente

Au temps de HTML, on utilisait l'attribut target="_blank" pour ouvrir un lien dans une nouvelle fenêtre. La norme W3C de XHTML ne recommande pas cette façon de faire.

<a href="http://julfisher.free.fr/cube" title="Lien externe vers le Rubik's Cube : solution" target="_blank"> JulFisher <img src="images/nouvelle_fenetre.png" alt="Lien externe" /></a>

 

Si vous essayez ce code, il va marcher mais votre code ne suivra pas les normes. C'est juste une question d'éthique pour que votre code soit valide au niveau du W3C. Le principe étant de laisser le choix libre aux visiteurs pour leur façon d'ouvrir le lien.

Certains visiteurs n'aimeront pas avoir à gérer plusieurs fenêtres qui s'ouvrent devant eux. Forcer l'ouverture des liens dans une nouvelle fenêtre pourra alors gêner leur navigation. Afin d'éviter la gène occasionnée, on doit laisser le visiteur décider lui-même de la façon dont il veut ouvrir le lien.

Il a donc été convenu de ne plus utiliser l'attribut target ni d'autres attributs qui permettent l'ouverture de lien dans une nouvelle fenêtre en XHTML.

Par contre, dans le cas où vous êtes vraiment dans l'obligation d'ouvrir un lien dans une autre fenêtre, il y a une solution alternative qui peut s'y substituer : le javascript. En utilisant le javascript pour le lien, non seulement vous aurez ce que vous vouliez mais aussi votre page sera valide. Avec cette autre méthode, il n'y a pas de contrainte de validation mais ceci n'entre pas dans le cadre de ce tutoriel.

Info bulle sur les liens

Afin de donner une indication au visiteur, on peut rajouter une bulle d'info sur le lien. Dès que le visiteur fait passer sa souris sur le lien, la bulle d'info apparaît. Vous pouvez ajouter une petite explication ou une information dans cette bulle.

L'exemple suivant va nous afficher "Voir la suite du tutoriel" dès qu'on pointe sur la zone de liens.

<a href="tutosuite.html" title="Voir la suite du tutoriel">suite </a>

 

Comme nous venons de voir, on a rajouté l'attribut title et on lui a donné comme valeur le texte de l'info-bulle.

Envoyer un mail

Un clic sur un lien peut aussi nous ouvrir facilement notre client mail par défaut (Outook par exemple ). L'ouverture immédiate d'Outlook pourra faciliter la tâche du visiteur quand il veut par exemple vous envoyer un mail. Si vous voulez que la fenêtre d'Outlook ou du client par défaut s'ouvre tout de suite en cliquant sur un lien, voici ce qu'il faut faire:

<a href="mailto:adresse@domain.fr">Contactez-moi</a>

Le mot clé mailto: indique que vous voulez ouvrir le client mail par défaut. Vous placez ensuite après le mailto: l'adresse email du destinataire, et celle-ci apparaîtra automatiquement dans le client mail de l'internaute. Il n'aura pas à retaper l'adresse.

Toutefois, un gros problème se présente avec cette méthode. Des programmes malveillants ou des robots de SPAM reconnaissent facilement les liens de ce type. Par leur propre manipulation, ces programmes essaient d'avoir les adresses mails puis les inondent de SPAM.

Une solution serait par exemple de mettre une image à la place du texte du lien. L'image affiche sous forme textuelle votre adresse email. Les robots ne peuvent pas interpréter une image pour voir ce qui est écrit dessus. Il existe aussi d'autres solutions réalisables en PHP ou en javascript mais elles ne font pas partie des thèmes abordés dans ce tutoriel.

Lien pour ouvrir un fichier PDF

Il est aussi possible de faire un lien vers des fichiers autres que le HTML notamment les fichiers PDF :

<a href="catalog.pdf">Catalogue au format pdf </a>

Lorsque le visiteur cliquera sur ce lien, le document s'ouvrira automatiquement. Le visiteur pourra ensuite lire le fichier PDF à l'aide de Adobe Acrobat Reader par exemple. Dans le cas où aucun programme de ce type n'est installé sur la machine du visiteur, le navigateur va lui proposer de télécharger le fichier.

Lien pour télécharger un fichier au format zip

De la même façon on peut provoquer le téléchargement des fichiers au format zip en utilisant les liens.

Exemple :

<a href="fichier.zip">le texte du lien</a>

Caractères spéciaux dans les URL

Parfois vous rencontrez des liens avec plusieurs paramètres. Il s'agit des liens de la forme page.php?a=valeur1&b=valeur2 par exemple. En XHTML, les ‘e' commerciales & doivent s'écrire dans le code source &amp;,

Au final, vous devriez avoir un lien comme ceci :

<a href="page.php?a=valeur1&amp;b=valeur2">Lien avec paramètre vers la page</a>

 

A propos de l'auteur

Nicolas Galle

Nicolas Galle est développeur web sénior pour l'agence SEO Aseox.