Accédez à nos cours concernant des domaines et thématiques différentes. Vous pouvez aussi contribuer en rédigeant des articles.
Consulter les coursParcourez notre annuaire d’écoles, instituts et universités du monde. Si votre école n’est pas listée, vous pouvez l’ajouter très facilement.
Consulter les écolesAccédez à notre messagerie instantanée pour échanger avec d’autres membres inscrits et aussi les invités. Aucune inscription n’est obligatoire.
Accéder au tchatLes liens XHTML constituent les vaisseaux du Web. En fait c'est eux qui nourrissent la notion de l'hypertexte. Qu'est-ce qu'un lien ? Comment peut-on créer un lien ? Quels sont les types des liens ? Hmm... 
J'ai encore d'autres questions qui me viennent à l'esprit...Pas de panique les gars. Le présent chapitre répondra à toutes vos questions.
Un lien est un mot, une phrase ou une image (Image sous forme de lien ou image cliquable) qui lorsqu'on clique sur lui on se rend
généralement dans une autre page. La balise qui permet de créer des liens est <a>, "a" veut dire "anchor" en français c'est "ancre" 
et comme vous le savez une ancre et un instrument en métal doté de deux dents et qui sert à fixer les navires.
Lorsque vous cliquez sur un lien, vous serez transporté dans le début ou à un endroit bien déterminé dans une page, c'est ce qui représente une ancre c'est-à-dire l'endroit où le lien est ancré ou si vous voulez l'endroit où le lien pointe. Les liens sont au cœur du système web car c'est eux qui alimentent la notion de l'hypertexte (méthode qui permet de joindre une un mot ou une image à une autre page pour faciliter l'accès à la documentation) et c'est eux qui permettent d'interconnecter toutes les ressources mises dans la toile d'où leur importance impérative.
La balise des liens "<a>" doit impérativement avoir l'attribut "href" (href = hyper référence = référence hypertexte) qui détermine l'URL (Uniform Resource Locator) : le chemin d'accès à la ressource qui constitue la destination du lien. Grosso modo en XHTML, un lien ressemble à ceci :
<a href="URL ou adresse du fichier" > le texte du lien sur lequel on va cliquer </a>
La balise <a> est une balise en-ligne (inline : éléments incorporés) non remplacée, ceci dit qu'il doit être placée dans une balise de type bloc (block) comme un paragraphe (<p>), une citation, un tableau etc. autrement dit elle ne doit pas être placée directement dans le corps entre les deux balises <body></body> sinon votre document ne sera pas validé pour les variantes "strict".
Je vous invite à consulter les deux articles "DTD ou doctype" et "le validateur w3c et la validation des documents html, xhtml et css" (cette règle est valable pour tous les autres éléments en-ligne).
Un lien peut contenir du texte (PCDATA) ou des éléments en-ligne (éléments incorporés) à part la balise <a> (un lien ne doit pas avoir un autre lien enfant ou un lien parent).
Un lien peut être placé dans des éléments de type bloc ou en-ligne (à part <button> et <a>).
Voici deux lignes de commentaires extraites du DTD strict :
<!-- a elements use %Inline; excluding a --> : l'élément a ne doit pas contenir un autre élément a.
<!-- button uses %Flow; but excludes a, form and form controls --> : l'élément button ne doit pas contenir : a, form et les contrôles de formulaire (input, textarea, select etc.).
(consultez : les imbrications interdites aux éléments a et button en xhtml 1.0)
Il y a deux types de liens, relatifs et absolus :
lien relatif : lien vers une page web se situant dans le même serveur c'est le cas par exemple d'un lien de la page http://www.wikipedia.com/index.html vers la page http://www.wikipedia.com/webmastering/javascript.html. On aura par exemple :
<a href="webmastering/javascript.html" >texte du lien</a>
Les deux pages "index.html" (page d'accueil qui comporte le lien) et "javascript.html" (page de destination) se trouve dans le même nom de domaine à savoir "www.wikipedia.com" donc inutile de faire une référence absolue (mais rien ne vous en empêche sauf que ça sera stupide 
) pour lier les deux pages.
lien absolu : lien vers un serveur distant, c'est le cas par exemple d'un lien du site http://www.commentcamarche.com vers http://www.wikipedia.com. Dans ce cas on va utiliser une adresse complète :
<a href="http://www.wikipedia.com" >texte du lien</a>.
Une adresse complète doit comporter le nom du protocole de communication (http, https, ftp, gopher etc.), le nom du domaine (www.wikipedia.com) et les dossiers et sous-dossiers (séparés par un slash "/") jusqu'à la ressource (page xhtml, fichier PDF, Word etc.) qui comporte le nom du fichier et son extension (zip, html, pdf, doc, ppt etc.).
Dans cette situation on est obligé de mettre une adresse complète pour lier les deux pages d'accueil se trouvant dans deux sites différents, car il s'agit de deux noms de domaine différents : www.wikipedia.com et www.commentcamarche.com.
On va créer deux pages "origine.html" et "destination.html", en premier lieu on va les mettre dans le même répertoire (un répertoire est un alias du mot dossier), supposons que ce répertoire se situe dans le bureau.
J'ai crée deux fichiers et je les ai mis dans le même répertoire "repertoire1", notez bien l'adresse marquée par la couleur jaune, à titre de rappel
Windows se sert des antislashs "\" pour séparer les dossiers, mais dans la toile on utilise le slash "/". J'ai
crée un lien dans la page "origine.html" qui pointe vers la page "destination.html".
Voici le lien :
<a href="destination.html"> lien pour se rendre à la page destination.html </a>
L'attribut href (qui indique l'URL de la page où on va se rendre) comporte seulement le nom du fichier "destination.html", car les deux fichiers se trouvent dans le même répertoire et au même niveau.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>essai lien</title>
</head>
<body>
<h1>Page d'origine</h1>
<a href="destination.html"> lien pour se rendre à la page destination.html </a>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>essai lien</title>
</head>
<body>
<h1>Page de destination </h1>
</body>
</html>
Lorsqu'on va cliquer sur ce lien, la page "destination.html" va s'ouvrir dans la page "origine.html" ce qui aura pour effet de l'écraser, pour forcer le navigateur à ouvrir la page "destination.html" dans une nouvelle fenêtre (ou un nouveau onglet) tout en gardant l'ancienne, on doit ajouter l'attribut "target" qui signifie "cible" et on va lui donner pour valeur "_blank" (lien ouvrant une nouvelle fenêtre grâce à l'attribut target).
Par défaut les liens apparaissent avec une couleur bleue et soulignés, lorsqu'un lien est survolé le curseur prend la forme d'une main 
et lorsqu'il est visité (cliquer sur le lien et revenir à la page du lien) il prend une couleur violette et demeure souligné (consultez les propriétés css de formatage du texte : "color" et "text-decoration", ainsi que les pseudo-classes :link (lien), :active (lien activé), :visited (lien visité), :hover (lien survolé).
Si les deux fichiers se trouvent dans des dossiers différents, on va changer d'URL (adresse), supposons que pour cette fois la page "destination.html" se trouve dans un sous-dossier "repertoire2".
Le lien va devenir :
<a href="repertoire2/destination.html" >.
On va ajouter le nom du sous-dossier "repertoire3". Si notre fichier se trouve dans un dossier "repertoire3" lui même se trouvant dans le sous-dossier "repertoire2". Le lien va devenir :
<a href="repertoire3/repertoire2/destination.html" >.
Inutile de vous donner plus d'exemples, je parie que vous avez compris le principe. Si le fichier d'arrivée se trouve en bas (dans des sous-dossiers) vous devez ajouter les noms des répertoires séparés par des slash "/" et enfin mettez le nom du fichier de destination.
Dans le cas contraire, si le fichier de départ se trouve en bas c'est-à-dire dans des sous-dossiers et que le fichier de destination se trouve en haut. Dans ce cas pour chaque sous-dossier mettez deux points juxtaposés ".." dans l'URL.
Pour cet exemple le lien sera :
<a href="../destination.html"> lien pour se rendre à la page destination.html </a>.
Si notre fichier de départ se trouve dans un sous-dossier lui aussi compris dans un autre sous-dossier l'URL va devenir "../../destination.html". Pour résumer ; dans le cas où le fichier de destination se trouve dans un rang supérieur à celui du fichier d'origine comportant le lien, vous devez mettre ".." séparés par des slashs "/" pour chaque dossier englobant le fichier d'origine avant de mettre son nom.
Dans le chapitre suivant on va aborder une notion vachement importante (comme d'hab. 
). On fait j'estime que certains d'entre vous, vont trouver le sujet un peu endormant 
Mais croyez-moi, le spectacle est garanti 
Tuto suivant : des liens accessibles.