RETOUR SOMMAIRE
Le lien hypertexte sert à naviguer sur le Web. Le lien hypertexte est créé avec la balise de type conteneur
<a>.
Il peut être réalisé sur un mot ou une image. On crée une zone sensible qui par action de la souris, permet d'atteindre d'autres objets.
Ce lien peut se faire à l'intérieur même du document, vers un autre document ou vers l'extérieur.
- Attributs de <a>
- Liens internes (même page)
- Liens internes (pages différentes)
- Liens externes
- Particularités des liens sur image ou bouton
- Lien e-mail
- Récapitulatif
- Attributs de <a>
- href : spécifie l'URL (Uniform resource locator) du document à afficher. Ce document peut-être une autre page, une image, une vidéo, etc…
- target : (cible) sert à déterminer l'endroit où sera ouvert le document précisé par l'URL. On s'en sert surtout dans un site composé de cadres.
- style : permet de spécifier une feuille de style.
- title : permet de spécifier une description du lien (identique à l'attribut <alt> pour une image et uniquement avec Internet Explorer)
- Liens internes (même page)
Les liens internes permettent de se déplacer à l'intérieur d'une page sans être obligé de faire défiler la page. Après avoir cliqué sur le lien,
on sera amené sur une cible appelée ancre.
Donc, la création d'un lien interne se fait en 2 étapes : définir l'ancre et associer au lien cette ancre.
- Définir l'ancre.
Exemple de syntaxe pour cette page au niveau du paragraphe 2 :
<a name="deux">Texte ciblé éventuel</a>
Note:
- dans ce cas, il n'est pas nécessaire de mettre du texte entre les balises d'ouverture et de fermeture.
- name ne doit pas contenir ni d'espaces, ni d'accents, ni de caractères spéciaux.
- Associer un lien à une ancre.
Exemple de syntaxe pour cette page au niveau du sommaire, paragraphe 2 :
<a href="#deux">Liens internes (pages différentes)</a>
- Liens internes (pages différentes)
- Lien vers une page située sans le même répertoire
Exemple : <a href="nom.htm">Cliquez ici</a>
- Lien dans un répertoire différent
Exemple : <a href="dossier/nom.htm">Cliquez ici</a>
- Lien dans un même répertoire et vers une ancre d'une autre page
Exemple : <a href="nom.htm#ancre">Cliquez ici</a>
- Lien dans un répertoire différent et vers une ancre d'une autre page
Exemple : <a href="dossier/nom.htm#ancre">Cliquez ici</a>
- Liens externes
Même protocole, mais la syntaxe de l'URL varie suivant le type de lien:
- Lien externe vers un site http
Exemple : <a href="http://www.lesite.com">Aller sur ce site</a>
- Lien externe vers un serveur FTP
Exemple : <a href="ftp://ftp.lesite.com">FTP de ce site</a>
- Lien externe vers un serveur de news (Attention pour que ce lien soit valide il faut que le visiteur soit abonné à ce serveur de news)
Exemple : <a href="news:news.site">Serveur de news</a>
Note : Avec un lien externe, on peut également proposer un fichier (.exe ou .zip) en téléchargement
Exemple : <a href="fichier.exe">Cliquer ici pour télécharger le fichier</a>
- Particularités des liens sur image ou bouton
- Liens sur image
C'est rendre une image réactive, pour accéder à un autre objet (autre page, image,etc…)
Forme de la syntaxe : <a href="fichier_cible.htm"><img src="image.gif ou .jpg"></a>
Exemple d'un lien sur l'image ci-dessous permettant d'accéder à la page "decrypt.html", traitant du logiciel DVD Decrypter. Pour cet exemple, la syntaxe est :
Pour aller sur la page de DVD decrypter, cliquer sur l'icône dossier <a href="decrypt.html"><img src="images/dossier.gif"></a>
Pour aller sur la page de DVD decrypter, cliquer sur l'icône dossier
Note : la même image sans lien
. Il n'y a pas le cadre qui est créé par le lien hypertexte.
Pour ne pas avoir de cadre sur un lien image, il faut ajouter à la balise <img> l'attribut border="0". Ce qui donne :
<a href="decrypt.html"><img src="images/dossier.gif" border="0"></a>
- Liens sur bouton
Possibilité d'offrir un bouton pour naviguer. Style de la syntaxe :
<form action="fichier ou dossier.html à atteindre">
<input type"submit" value="libellé bouton">
</form>
Autre syntaxe ayant le même fonctionnement, vue sur http://www.htmlhelp.com/fr/faq/html/ mais apparemment non usitée :
<form action="fichier ou dossier.html à atteindre" method=get>
<input type"submit" value="libellé bouton">
</form>
Exemple 1: bouton pour accéder à une autre page et retour par le retour du navigateur
<form action="decrypt.html">
<input type"submit" value="Bouton">
</form>
Exemple 2: bouton pour accéder à une autre page et retour par un autre bouton. Pb blocage scripts
<form action="bouton.html">
<input type"submit" value="Bouton">
</form>
- Lien e-mail
- Récapitulatif
RETOUR SOMMAIRE