INFORMATIONS

Les Bases du xHTML Auteur : wizad Modifie le : 21/11/2006 à 13h48
Retour
Chapitre: Précédent | Suivant

Chapitre 8 : Les liens

Le meilleur pour la fin, les liens ! Ce qui fait d'une page Web une vraie page hypertexte (le HT de XHTML) et pas un bête document. Les liens se décrivent avec l'élément <a> (qui est, bien sûr, inline), suivi d'attributs.

Lien simple

Le lien de base utilise l'attribut href :

Code source html/xhtml :
  1. Retourner au <a href="http://www.eleves.ens.fr/">serveur des élèves</a>.
  2.  
Parsé en 0.005s par GeSHi 1.0.7.13

On peut utiliser des liens absolus, comme celui ci-dessus, qui donne l'ensemble de l'URL, mais aussi des liens relatifs, qui sont relatifs à l'arborescence de votre site. Admettons que vous ayez dans votre répertoire ~/www/ un répertoire stage qui contient, entre autres, le fichier rapport.html. Pour faire un lien dessus, depuis la page d'accueil, ça donnera :

Code source html/xhtml :
  1. Mon <a href="stage/rapport.html">rapport de stage</a>
  2. parle du lien entre les nombres p-adiques et les phases de
  3. la lune.
Parsé en 0.006s par GeSHi 1.0.7.13

Ancres

Une ancre sert à faire un lien local, c'est-à-dire vers un endroit précis du document. C'est particulièrement utile pour faire une table des matières avec des liens qui pointent vers les titres, ou encore pour faire des références croisées dans un document.

On commence par définir les ancres, c'est-à-dire les endroits vers lesquels on veut pointer. On utilise l'attribut name de l'élément <a> :

Code source html/xhtml :
  1. Les <a name="olm">Olmèques</a> ont véritablement
  2. existé. C'est la première des grandes civilisations précolombiennes...
Parsé en 0.006s par GeSHi 1.0.7.13

Quand vous lisez le document avec un navigateur, l'ancre est invisible. Pour choisir le nom de l'ancre, vous avez à votre disposition tous les caractères alphanumériques, et mêmes les caractères accentués. Veuillez seulement à ne pas utiliser deux fois la même ancre au sein du document.

Pour faire le lien vers cette ancre, on utilise toujours l'attribut href, mais en modifiant la syntaxe avec un # :

Code source html/xhtml :
  1. Esteban, Zia et Tao rencontrent alors les Olmèques, une peuplade extra-terrestre (voir ici la <a href="#olm">véritable histoire
Parsé en 0.005s par GeSHi 1.0.7.13

Vous pouvez positionner un lien vers cette ancre même depuis un autre fichier :

Code source html/xhtml :
  1. Voir <a href="citesdor.html#olm">l'histoire des Olmèques</a>.
Parsé en 0.005s par GeSHi 1.0.7.13

Liens spéciaux

Vous pouvez créer un lien de telle sorte que, lorsqu'on suit ce lien, on vous envoie un courrier électronique. On utilise toujours l'élément <a> et son attribut href. Seulement, le protocole du lien change. Auparavant c'étaient des liens HTTP (Web). Mais vous pouvez aussi utiliser le protocole mailto, qui est le protocole des courriers électroniques.

Code source html/xhtml :
  1. Écrivez-moi : <a href="mailto:mon.adresse@allprogrammic.com">mon.adresse@allprogrammic.com</a>
Parsé en 0.006s par GeSHi 1.0.7.13
du peuple olmèque</a>.

Quand un lecteur suivra ce lien, son navigateur lui proposera de vous envoyer un mail.

Donner une adresse « en clair » sur son site est une excellente manière de recevoir du spam. Mieux vaut utiliser un encodage très simple, à base d'entités, qui vous permettra de damer le pion aux robots collecteurs d'adresses.

Les entités dont vous avez besoin en l'espèce sont &#64; pour une arobase (@) ou encore &#46; pour un point (.) et &#45; pour un tiret (-). Ce qui donne :

Code source html/xhtml :
  1. Mon adresse : <a href="mailto:mon&#45;adresse@allprogrammic.com">jean&#45;paul&#46;sartre&#64;ens&#46;fr</a>
Parsé en 0.006s par GeSHi 1.0.7.13

Complètement illisible, on est bien d'accord ? C'est ce que verra le robot collecteur d'adresses. En revanche, un lecteur normal passant par un navigateur verra correctement votre adresse e-mail.