Des liens se trouvent dans presque toutes les pages Web. Les liens permettent aux utilisateurs de cliquer sur leur chemin d’une page à l’autre.
Liens HTML – Hyperliens
Les liens HTML sont des hyperliens.
Vous pouvez cliquer sur un lien et accéder à un autre document.
Lorsque vous déplacez la souris sur un lien, la flèche de la souris se transforme en une petite main.
Remarque: Un lien ne doit pas nécessairement être du texte. Il peut s’agir d’une image ou de tout autre élément HTML.
Liens HTML – Syntaxe
Les hyperliens sont définis avec la <a>balise HTML :
<a href= »url« >texte du lien</a>
Exemple
<a href= »http://ar-ans.be/blog »>Visitez notre site</a>
L’ hrefattribut spécifie l’adresse de destination ( http://ar-ans.be/blog/) du lien.
Le texte du lien est la partie visible (Visitez notre site).
Un clic sur le texte du lien vous enverra à l’adresse indiquée.
Remarque: Sans barre oblique à la fin des adresses de sous-dossier, vous pouvez générer deux requêtes vers le serveur. De nombreux serveurs ajoutent automatiquement une barre oblique à la fin de l’adresse, puis créent une nouvelle demande.
Liens locaux
L’exemple ci-dessus utilise une URL absolue (une adresse Web complète).
Un lien local (lien vers le même site Web) est spécifié avec une URL relative (sans https: // www ….).
Exemple
<a href= »html_images.asp »>HTML Images</a>
Liens HTML – L’attribut cible
L’ targetattribut spécifie où ouvrir le document lié.
L’ targetattribut peut avoir l’une des valeurs suivantes:
_blank– Ouvre le document lié dans une nouvelle fenêtre ou un nouvel onglet_self– Ouvre le document lié dans la même fenêtre / onglet que celui sur lequel il a été cliqué (c’est la valeur par défaut)_parent– Ouvre le document lié dans le cadre parent_top– Ouvre le document lié dans le corps complet de la fenêtre- framename – Ouvre le document lié dans un cadre nommé
Cet exemple ouvrira le document lié dans une nouvelle fenêtre / onglet de navigateur:
Exemple
<a href= »http://ar-ans.be/blog/ » target= »_blank »>Visitez notre site!</a>
Conseil: Si votre page Web est verrouillée dans un cadre, vous pouvez utiliser target="_top"pour sortir du cadre:
Exemple
<a href= »http://ar-ans;be/blog/ » target= »_top »>HTML5 tutorial!</a>
Liens HTML – Image en tant que lien
Il est courant d’utiliser des images comme liens:
Exemple
<a href= »default.asp »>
<img src= »smiley.gif » alt= »HTML tutorial » style= »width:42px;height:42px;border:0; »>
</a>
Remarque: border:0; est ajouté pour empêcher IE9 (et versions antérieures) d’afficher une bordure autour de l’image (lorsque l’image est un lien).
Bouton comme lien
Pour utiliser un bouton HTML comme lien, vous devez ajouter du code JavaScript.
JavaScript vous permet de spécifier ce qui se passe lors de certains événements, comme un clic sur un bouton:
Exemple
<button onclick= »document.location = ‘default.asp' »>HTML Tutorial</button>
Liens de titres
L’ titleattribut spécifie des informations supplémentaires sur un élément. Les informations sont le plus souvent affichées sous forme d’infobulle lorsque la souris se déplace sur l’élément.
Exemple
<a href= »http://ar-ans.be/blog/ » title= »Se rendre sur la page d’accueil de notre site »>Visitez notres site</a>
Chemins externes
Les pages externes peuvent être référencées avec une URL complète ou avec un chemin d’accès relatif à la page Web actuelle.
Cet exemple utilise une URL complète pour créer un lien vers une page Web: