L'élément a (pour anchor, c'est à dire ancre) est l'élément qui permet de créer un lien sur un autre page.
Le code ci-dessus apparaît comme suit dans la page :Un lien sur la page google.
Un clic gauche sur le lien remplace la page en cours par la page ciblée.
L'élément target permet notamment de faire en sorte que la page ciblée s'ouvre dans un nouvel onglet au lieu de remplacer la page parent.
Pour cela, on donne la valeur _blank à cet attribut target.
Testez en cliquant sur le lien : la page google s'ouvre dans un nouvel onglet.
Choisir systématiquement cet attribut pour vos liens peut être agaçant pour le visiteur de votre site. Un choix fréquent est de ne pas indiquer target="_blank" pour tous les liens internes à votre site et d'indiquer target="_blank" pour les liens externes.
Vous pouvez aussi choisir un nom explicite pour vos nouveaux onglets.
Par exemple, dans le menu gauche de cette page, sous le menu www, il y a plusieurs liens sur le site w3schools. L'attribut target avec la valeur w3 (ce qui donne donc target="w3") a été attribué à chacun de ces liens : cliquez dessus pour voir ce qu'il se passe. Quand on clique sur ces liens, le premier ouvre un nouvel onglet (qui se nomme donc ici w3, même si ce nom n'apparaît pas) et les clics suivants ouvrent la nouvelle page dans le même onglet w3. On évite ainsi au visiteur de la page de multiplier les nouveaux onglets (mais il peut bien sûr toujours choisir de créer un nouvel onglet à chaque page avec un clic droit sur le lien).
Lorsqu'on cible une page comme la page de recherche de google, c'est à dire une page extérieure à son site, on donne l'adresse absolue(ou url absolue).
Lorsqu'on cible une page de son propre site, on donne une adresse relative (ou url relative).
Pour clarifier les exemples qui suivent, on suppose que la structure de notre site est la suivante :
Une flèche d'un répertoire (ou dossier) vers un fichier signifie que le répertoire contient le fichier. De même une flèche d'un répertoire X vers un répertoire Y signifie que X contient Y (on dit alors que X est un sur-répertoire de Y ou que Y est un sous-répertoire de X).
Si j'écris dans le fichier f4 et que je veux faire un lien vers le fichier f5, comme ils se situent dans le même répertoire de mon site, il suffit d'écrire le nom du fichier ciblé comme valeur de l'attribut href :
Supposons maintenant que l'on écrive dans le fichier f3.html et que l'on veuille faire un lien vers le fichier f2.html, il faut indiquer le nom du dossier contenant f2 et le nom du fichier :
Pour un lien de f6.html vers f2.html :
Supposons maintenant que l'on écrive dans le fichier f2.html et que l'on veuille faire un lien vers le fichier f3.html, il faut indiquer le fait que l'on doit sortir du répertoire contenant f2.html :
De façon analogue, pour un lien de f2.html vers f1.html, on doit d'abord sortir de F puis de E puis rentrer dans D :
Dans le menu gauche de cette page, dans la partie cours, se trouvent plusieurs liens sur des parties de cette page. Comment définit-on un tel lien ?
On commence par ajouter un attribut id (identifiant) à l'élément html que l'on veut cibler. Par exemple, sur la partie intitulée "l'élément a", on a ajouté l'identifiant id="ancre" à la balise article contenant l'ensemble du paragraphe, ce qui donne :
Si l'on veut maintenant ajouter ici un lien vers cette partie, on donne la valeur #ancre à l'attribut href de notre lien :
Ce qui donne : lien vers l'article sur ancre.
Essayez en cliquant sur ce lien.
En reprenant l'arborescence de site donnée ci-dessus, si dans le fichier f4.html un paragraphe p possède un attribut id de valeur coucou : on pourra faire un lien directement sur ce paragraphe depuis n'importe quel autre fichier. Par exemple, depuis le fichier f2 :