SELFHTML/Aides à la navigation HTML/XHML Liens (Links)| SELFHTML/Aides à la navigation HTML/XHML Liens (Links) |
 |
Liens du projet internes au projet |
|
|
 | |
Liens d'un projet à d'autres fichiers HTMLUn projet Web comprend, c'est caractéristique, plusieurs, voire de nombreuses pages distinctes reliées entre elles par des liens. Vous trouverez des remarques d'introduction à ce sujet dans la partie sur la 
Répartition de l'information et organisation des fichiers.
Pour définir des liens à d'autres fichiers du projet, il est recommandé d'utiliser des mentions de cible de lien relatives. Le projet y gagne en souplesse, et les liens fonctionnent aussi dans d'autres environnements (par exemple aussi longtemps que vous voulez bâtir et tester votre projet localement sur votre ordinateur, ou si vous voulez le présenter sur CD-ROM).
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body>
<h1>Page d'accueil</h1>
<p>Ceci est une page d'accueil tout à fait simple
Avec un <a href="pagedeux.htm">lien à une autre page du projet</a>.
Une <a href="../../tableaux/affichage/miseenpage.htm">page d'accueil plus élaborée avec des liens internes au projet
</a> peut pourtant être appelée de la même façon.</p>
</body>
</html>
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body>
<div style="width:100%; border:thin solid gray; padding:5px">
<a href="index.htm">page d'accueil</a>
</div>
<h1>Deuxième page</h1>
<p>oui bravo, c'est gagné!</p>
</body>
</html>
|
L'exemple montre deux fichiers HTML modestes. Le premier - nommé index.htm - contient un lien au deuxième fichier. Le nom du deuxième fichier est pagedeux.htm. Les deux fichiers sont rangés dans le même répertoire. C'est pourquoi la mention du fichier pour href= suffit sans autre ajout. Dans l'exemple du fichier index.htm est toutefois également indiqué comment définir des liens à des fichiers situés dans d'autres répertoires. La syntaxe exacte de ce genre de mention relatives est décrite dans la partie expliquant comment référencer avec des mentions de chemins relatifs à l'URI de base.
Le deuxième fichier de l'exemple (pagedeux.htm) contient un "lien de retour" typique à la première page, à la "page d'accueil" donc. Un lien de retour n'est pas un lien spécial mais tout simplement encore un lien au fichier désiré. Étant donné que les deux fichiers se trouvent dans le même répertoire, la mention du nom de fichier suffit à nouveau dans ce cas, à savoir href="index.htm"
Le "lien de retour" du deuxième fichier est mis en valeur d'emblée grâce à un "lien de retour" dans le deuxième fichier de l'exemple ci-dessus grâce à un élément général pour des passages de texte, auquel quelques formats CSS ont été affectés. Il se trouve au début de la partie visible du corps de fichier et grâce au cadre qu'il reçoit grâce aux CSS, le passage fait office d'une barre de navigation. Il est vivement recommandé de noter ce genre de liens de navigation typiques toujours au même endroit sur la page et de le mettre en forme de telle façon que son but pour la navigation soit visible. HTML ne propose aucun lien spécial, ni possibilité de mise en forme pour les barres de navigation. Vous devez créer vous même, les barres de navigation avec les moyens du bord. (Prise au pied de la lettre, cette affirmation est fausse: HTML propose bien quelque chose de tel, à savoir la possibilité de définir des relations logiques. Malheureusement ceci n'est pas encore soutenu par les navigateurs à la date d'aujourd'hui.)
|
Définir des ancres et des liens à des ancresVous pouvez définir des ancres à l'intérieur d'un fichier HTML. Ensuite, vous pouvez poser des liens à de telles ancres pour faire un saut exactement à l'endroit de l'ancre dans le fichier. Le lien peut se trouver dans le même fichier. Alors, le saut s'effectue à l'intérieur de la page affichée. Mais le lien peut aussi se trouver dans un autre fichier. Alors, le fichier-cible est chargé et le navigateur saute, dès qu'il a chargé l'endroit avec l'ancre, à l'endroit correspondant du fichier.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML Strict//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body>
<h1><a name="debut">Longue page</a></h1>
<p><a href="#chap02">chapitre 2</a></p>
<hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr>
<!-- etc. plein de lignes de séparation pour remplir de l'espace -->
<h2><a name="chap02">Chapitre 2</a></h2>
<p><a href="#debut">début de la page</a> ou bien
<a href="../projetinterne.htm#ancre">définir une ancre et des liens à une ancre</a></p>
<hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr>
<!-- etc... plein de lignes de séparation pour remplir de l'espace -->
</body>
</html>
|
Une ancre est créée exactement comme un lien avec le repère a. La référence réside en ce qu'aucun attribut href= n'est noté mais à la place un attribut name=. Une ancre complète a donc l'aspect suivant:
<a name="nomdancre">...</a>
Vous pouvez attribuer un nom d'ancre de votre choix. N'attribuez pas de nom trop long. Les noms ne peuvent contenir aucun espace ni caractère spécial (accents). Le premier signe doit être alphabétique. puis les chiffres sont également permis. Utilisez comme caractère spécial dans le nom d'ancre tout au plus le tiret de soulignement (_), Le trait d'union (-), les deux points (:) ou le point (.).
Ce que vous notez entre <a name="nomdancre"> et </a> comme contenu est la cible du saut pour les liens qui mènent à cette ancre. Il est parfaitement permis de noter une ancre vide donc <a name="nomdancre"></a>. Quelques navigateurs plus anciens n'exécutent pourtant pas les liens à des ancres vides, c'est pourquoi il est préférable de poser l'ancre à un contenu concret. Mais pensez en le faisant que l'élément a est lui-même un élément incorporé et qu'aucun élément de bloc ne peut être placé dans son contenu. Si donc vous voulez définir par exemple un titre comme ancre ce qui est assez typique, notez l'imbrication d'éléments sous la forme:
<h2><a name="nomdancre">Texte du titre</a></h2>
Pour noter dans un fichier un lien à une ancre existant dans ce fichier, le schéma suivant s'applique:
<a href="#nomdancre">texte du lien</a>.
La cible du lien commence donc avec le signe dièse #, suivi immédiatement du nom de l'ancre.
Quand le lien doit mener à une ancre située dans un autre fichier, c'est le fichier qui est adressé en premier. Derrière le nom de fichier est placé le signe dièse # suivi lui-même du nom de l'ancre.
Bien que HTML ne différencie pas les majuscules des minuscules, il est recommandé dans tous les cas d'écrire de la même façon les noms d'ancre pour l'ancre et pour le lien. Quelques navigateurs n'exécutent à vrai dire pas le lien quand le nom de l'ancre utilise des casses (majuscules/minuscules)différentes pour l'ancre et pour le lien.
Quand vous voulez travailler conformément à XHTML vous devez impérativement veiller à l'homogénéité de la casse, étant donné que XHTML à la différence de HTML différencie rigoureusement les majuscules des minuscules.
Pour des liens à l'intérieur d'un fichier, le navigateur Web ne crée pas un nouvel accès au serveur quand le fichier est affiché dans un environnement http, dans la mesure où le fichier est suffisamment chargé dans la mémoire de travail pour qu'il puisse exécuter le saut.
Quelques navigateurs, par exemple l'Explorer Internet connaissent aussi des noms d'ancres "réservés internes" tels que top. Si vous notez donc un lien <a href="#top">...</a> et qu'aucune ancre de ce nom n'existe dans le fichier, le navigateur saute au début de la page quand il exécute le lien.
Certains navigateurs ont des difficultés pour sauter à des ancres qui sont notées dans un 
tableau.
Il est tout à fait possible de noter des repères a qui ont aussi bien un attribut href qu'un attribut name! Vous pouvez créer par exemple intentionnellement des liens qui se réfèrent à eux mêmes de la façon suivante:
<a name="ici" href="#ici">toujours bien rester ici!</a>
|
| |
 |
Liens du projet externes au projet
|
 |
Définir et mettre en forme des liens
|
| SELFHTML/Aides à la navigation HTML/XHML Liens (Links) |
© 2001 Stefan Münz / © 2003 Traduction 
Serge François, 13405@free.fr selfhtml@fr.selfhtml.org
