HTML : la balise A (une balise très utile)

Un champ d'application très vaste

Cet balise crée un hyperlien.
Le seul attribut obligatoire de cette balise est href : chemin vers une ressource (interne ou externe)
Un autre attribut utile est target qui permet d'ouvrir la ressource dans une nouvelle fenêtre.
La norme HTML5 introduit un nouvel attribut download qui permet de télécharger une ressource au lieu de l'ouvrir.
La balise A permet aussi de créer des liens vers des "ancres" (ancre : élément HTML disposant d'un ID).

Exemples d'utilisation de la balise A

Hyperlien vers une ressource externe qui sera affichée dans un nouvel onglet ; lien textuel

Horaires et réservations SNCF

Hyperlien vers une ressource externe (dans nouvel onglet) ; lien sous forme d'une image

Michelin itinéraires

Lien pour écrire un mail

adresser mail à : coronavirus19ATgmail.com

Cette technique pose problème pour les internautes utilisant un webmail comme justement Gmail (pas de logiciel de messagerie installé sur leur ordinateur).

Télécharger un fichier (plutôt que de l'ouvrir))

Télécharger le pdf

L'attribut download de la balise A introduit par la norme HTML5, permet de télécharger des fichiers via HTML.

Lien vers une ancre dans la même page Retour haut de page

Lien vers une ancre dans une autre page Retour vers le haut de la page 'html_menu.htm'

Le code HTML correspondant

Regardez attentivement ce code afin de vous familiariser avec la syntaxe.

... <div> <p>Hyperlien vers une ressource externe qui sera affichée dans un nouvel onglet ; lien textuel</p> <a href ="https://www.sncf.com" target ="_blank" >Horaires et réservations SNCF</a> </div> <div> <p>Hyperlien vers une ressource externe (dans nouvel onglet) ; lien sous forme d'une image</p> <a href ="https://www.viamichelin.fr" target ="_blank"> <img src ="../images/michelin.png " alt ="Michelin itinéraires" class ="centre" title ="cliquez sur l'image" /> </a> </div> <div> <p>Lien pour écrire un mail</p> <a href ="mailto: coronavirus19@gmail.com" >adresser mail à : coronavirus19ATgmail.com</a> <p>Cette technique pose problème pour les internautes utilisant un webmail (comme justement Gmail) : pas de logiciel de messagerie installé physiquement sur leur ordinateur. </div> <div> <p>Télécharger un fichier (plutôt que de l'ouvrir) </p> <a href ="https://darchevillepatrick.info/documents_fede/arbre_filiation_vierge.pdf" download ="arbre.pdf" > Télécharger le pdf</a> <p>L'attribut <b>download</b> de la balise A -introduit par la norme HTML5 - permet de télécharger des fichiers via HTML. <br>Dans l'exemple, le fichier sera chargé sur le terminal de l'internaute sous le nom "arbre.pdf" ! <p class ="remarque">Cliquez sur le lien et observez le bas de l'écran : un fichier a été téléchargé sous le nom "arbre.pdf". </div> <div> <p>Lien vers une ancre dans la même page</a> <a href ="#haut" >Retour haut de page </a> </div> <div> <p>Lien vers une ancre dans une autre page</a> <a href ="html_menu.htm#debut" >Retour vers le haut de la page 'html_menu.htm'</a> </div> ...

Donc la nouveauté introduite par HTML5 est l'attribut download
Retour menu