Liens externes et internes à la page

Le web est basé sur le lien hypertexte. Il s’agit, à partir d’une page, de pouvoir par un simple clic visiter une autre page, qu’elle soit sur le même serveur (un site est techniquement un ensemble de page disposée sur le même serveur, accessibles via des liens entre ces pages) ou externe.

Précédent | 8/10 | Suivant

Le lien hypertexte vers un page du même domaine

Le cas le plus simple du lien est le lien vers une page liée au même domaine. Dans ce cas, le lien ne spécifique que le lien, le navigateur complète automatique le nom de domaine, qui est celui sur lequel il se trouve déjà. La page peut être éventuellement dans un sous dossier, ou être traitée par une rewrite rule du serveur (mais on ne parlera pas de ça ici).
Tout lien qui ne commence pas par un protocole comme http://, https://, ftp:// sont des liens vers une page du même domaine.

<a href="autrepage.html">Un lien simple</a>
<a href="sousdossier/autrepage.html>Un page dans un sous-dossier</a>

Le lien hypertexte vers un autre site

un lien est techniquement une balise : un morceau de texte, ou une image, ou même un bloc de code deviennent cliquables parce qu’un tag enserre ce contenu. Un attribut href permet au navigateur de savoir vers quel page il doit envoyer le visiteur en cas de clic.
Ce lien est reconnaissable par le fait qu’il commence par le protocole, la plupart du temps http:// ou https://
Ce lien peut être simple, en donnant juste le nom général du site, soit pointer vers une page de ce site, et même transporter une information avec lui (on parle d’entête en "get", mais on en parlera pas ici).

<a href="http://www.site.org">Un lien via du texte</a>
<a href="https://wwww.sitesecurise.net">Un lien en https</a>
<a href="http://www.pagedunsite.net/page">Un lien vers une sous-partie de site</a>
<a href="http://www.site.org/page.php?info=truc">un lien avec une information transportée en get</a>

Un lien vers une sous-partie de la page actuelle

Cas plus rarement employé, un lien peut être interne à la page en cours. On utilise alors un lien commençant par #. On parle alors de la destination du lien comme une ancre.

<a href="#chapitre1">Un lien interne vers l'ancre "chapitre1"</a>

Ce qui signifie que dans cette page, un id du même nom a été donné à l’élément vers lequel on veut pointer.

<!-- navigation interne -->
<a href="#intro">Lien vers "intro"</a>
<a href="#partie_1">Lien vers "partie_1"</a>

<!-- le contenu est ses id de destination-->
<div id="intro">L'intro</div>
Du texte et des tags
<div id="partie_1">Partie 1</div>
Autre texte et tags

Le clic sur un lien interne produit un saut immédiat vers l’endroit de la page où se trouve l’ancre, en le plaçant en haut de la fenêtre.

On peut pointer un lien vers une page externe comportant une ancre, également :

<a href="http://www.monsite.org#chap2">Aller à l'ancre chap2 de la page d'entre de monsite.org</a>

Il faut, évidemment, que cette ancre existe dans la page de ce site...