HTML5 - 5.3 : Les options de liens avancées
Au-delà des attributs basiques, HTML offre plusieurs attributs avancés pour configurer les liens. L'attribut rel décrit la relation entre le document courant et la ressource liée. Par exemple, rel="external" indique un lien vers un serveur externe, dégageant ainsi votre responsabilité quant au contenu externe. Cet attribut est surtout utilisé pour la sémantique et l'optimisation moteurs de recherche.
L'attribut download force le navigateur à télécharger la ressource plutôt que de la naviguer. Spécifiez le nom du fichier après l'attribut : <a href="image.jpg" download="mon-image.jpg">. Cela est utile pour offrir aux utilisateurs la possibilité de sauvegarder des fichiers directement depuis votre site. L'attribut type précise le type MIME de la destination, par exemple type="image/jpg", ce qui aide le navigateur à traiter la ressource correctement.
L'attribut hreflang spécifie la langue de la page cible, utile pour les sites multilingues. Par exemple, hreflang="it" indique qu'une page est en italien. Cela améliore l'accessibilité et l'expérience utilisateur en guidant les visiteurs vers les versions de contenu dans leur langue. Ces attributs peuvent être combinés pour créer des liens robustes et bien documentés.
En utilisant ces options avancées, vous construisez une structure sémantique forte et une meilleure expérience utilisateur. Les moteurs de recherche et les lecteurs d'écran interpréteront mieux vos liens, rendant votre site plus accessible et mieux classé dans les résultats de recherche.
En résumé
Ce cours présente les quatre principaux attributs avancés de la balise HTML `<a>` pour enrichir les liens. L'attribut `rel` permet de spécifier la relation du lien (comme 'external' pour les liens externes), `download` force le téléchargement d'un fichier avec un nom personnalisé, `type` indique le type MIME de la destination, et `hreflang` précise la langue de la ressource liée (utile pour les versions multilingues). Des exemples concrets sur une page de café illustrent chaque fonctionnalité.
Points clés
- L'attribut `rel` identifie la nature du lien : utilisez 'external' pour les liens vers des serveurs externes et dégager votre responsabilité
- L'attribut `download` transforme un lien en déclencheur de téléchargement et prend le nom du fichier comme valeur (ex: `download="coffee.jpg"`)
- L'attribut `type` précise le type MIME de la ressource cible pour aider le navigateur (ex: `type="image/jpg"`)
- L'attribut `hreflang` améliore la sémantique en indiquant la langue (ex: `hreflang="it"` pour l'italien)
- Ces attributs n'ont aucun impact visuel immédiat mais enrichissent la sémantique et le comportement du lien
Questions fréquentes
À quoi sert l'attribut `rel` sur un lien ?
L'attribut `rel` déclare la relation entre votre page et la destination du lien. Utiliser `rel="external"` indique que le lien pointe vers un serveur externe, ce qui dégage votre responsabilité sur le contenu de ce lien.
Comment forcer le téléchargement d'un fichier au lieu de l'ouvrir dans le navigateur ?
Ajoutez l'attribut `download` à la balise `<a>` avec le nom du fichier comme valeur. Par exemple : `<a href="image.jpg" download="coffee.jpg">`. Le navigateur téléchargera le fichier au lieu de l'afficher.
Comment indiquer la langue d'une page liée ?
Utilisez l'attribut `hreflang` avec le code de langue ISO 639-1 (ex: `hreflang="it"` pour l'italien, `hreflang="en"` pour l'anglais). Cela améliore la sémantique et aide les moteurs de recherche à comprendre les versions multilingues.