1) Qu’est-ce que faire un lien ?
2) Lier vos pages locales
3) Lier des sites. Liens absolus
4) Lien relatifs
5) Lien vers une adresse e-mail
6) Lien vers une ancre
7) Lien avec des images
8) Couleur des liens
9) Lien avec un bouton
10) Lien vers la page précédente
Qu’est-ce que faire un lien ?
C’est permettre de naviguer ! On réalise des hypermots ou des hyperimages, c’est à dire des objets qui réagissent avec la souris le plus souvent, pour atteindre d’autres objets. C’est la base de la navigation.
Un lien se fait oblgatoirement entre deux objets : celui qui envoie et celui qui reçoit.On place le lien dans le fichier qui envoie.
Au début limitez vous à des fichiers dans un même dossier, et réalisez des liens entre eux.
Deux types de liens dominent la navigation :
– Relatifs et locaux pour lier vos pages. (C’est le lien le plus fréquent)
– Absolus et globaux pour lier des sites.
Il faut connaître aussi :
– les liens vers un point précis d’une page : ancre.
– les liens vers une adresse e-mail.
– les liens relatifs.
– les liens vers des fichiers (téléchargement).
Lier vos pages locales
C’est permettre d’atteindre un autre fichier dans un même dossier, sur une même machine.Pour des documents placés dans un autre dossier, voyez liens relatifs.
a) On réalise d’abord le fichier cible
Faites très attention à l’archivage. Notez bien le chemin du dossier et le nom du fichier.
b) Dans le fichier source, on réalise le lien vers ce fichier cible :
Pour cela, on marque un texte, ou bien une image, avec le tag <a> et l’attribut href : <a href= »fichier.htm »> Texte de l’hyper lien vers le document </a>
Exemple : <a href= »adam.htm »>Voir Adam</a>
Lier des sites. Liens absolus
C’est atteindre un document ou une adresse à l’aide du chemin complet et de son nom.
a) Il faut connaître tous les éléments :
– Le type de protocole http:// ou ftp://… et pour des références locales : file://
– Le nom de l’ordinateur pour des liens locaux sur le serveur .
– Le chemin complet ainsi que le nom de fichier.
b) On confie le tout à l’attribut href du tag <a> :
Syntaxe : <a href= »Protocole Serveur Chemin Fichier »> Texte du lien</a>
Exemple : <a href= »http://perso.wanadoo.fr/chatinais/index.htm »>Site Web chenu</a>
Lien relatifs
C’est atteindre un fichier situé dans un autre dossier, sur la même machine.
a) On réalise l’arborescence.
Il est très important d’archiver ses documents de façon structurée.
b) On indique le chemin par rapport au document utilisé
Syntaxe : <a href= »../chemin/fichier>Texte hyper lien </a> (remonte d’un niveau et chemin/descend).
Exemple : Avec l’arborescence ci-contre, nous sommes dans le document « relatif.htm » du dossier « lien ». Pour atteindre le document « index.htm » il faut remonter d’un niveau, ce qui s’écrit ../ en HTML. D’où le lien relatif suivant:
<a href= »../index.htm »>Index</a>
Il est possible de remonter de plusieurs niveaux :
<a href= »../../courhtml/index.htm »</a>donne le même résultat !
Lien vers une adresse e-mail
C’est atteindre un internaute en lui envoyant un message
On utilise le tag <a> avec l’attribut href :
Adresse : <a href= »mailto:E-mail de l’internaute »> Contacter TOTO</a>
Exemple : <a href= »mailto:chenu@wanadoo.fr »> Contacter l’auteur</a>
……
Cours gratuit HTML (98 KO) (Cours PDF)