Souvent, je me suis demandé s’il fallait attribuer un traitement différent aux liens allant vers un site autre que celui le référençant (dans le jargon, un lien sortant). Cette petite réflexion m’est venu en constatant que souvent, je pestais quand j’étais sur un autre navigateur que Firefox et que ce dernier ne m’affichait pas l’url au survol de la souris.

Nous ne parlerons pas ici de problématiques SEO avec les attribut nofollow et dofollow mais bien d’expérience utilisateur, à savoir :

• Le comportement du lien; c’est à dire s’il va s’ouvrir dans un nouvel onglet ou nouvelle page,
• l’apparence du lien (couleur, typo, graisse, icône…).

Quel comportement ?

En tant que webmaster, blogger, e-commerçant ou que sais-je encore, nous sommes parfois tenté de vouloir conserver les internautes sur nos pages. Il peut y avoir plusieurs stratégies à cela, dont les plus extrêmes sont de ne faire aucun lien pointant à l’extérieur de son site parce que “ça fait perdre des utilisateurs”. C’est un peu comme si on tentait de prévenir la fuite des cerveaux par l’interdiction de sortie du territoire…

Si vous avez décidé d’embrasser le web et d’assumer que la richesse c’est aussi d’aller vers les autres – avec des liens – deux écoles s’affrontent : utiliser l’attribut target="_blank" pour ouvrir le lien dans un nouvel onglet ou laisser le comportement par défaut.

Là c’est un peu la bataille des arguments. Bien que à l’instar de Facebook, certains grands sites utilisent de manière systématique l’ouverture d’un nouvel onglet pour les liens externes, la tendance va à laisser le comportement par défaut.

J’ai pour ma part, après pas mal de lecture pris la décision qu’il ne fallait pas utiliser le target="_blank" dans la plupart des cas. Parmi les arguments qui pèsent vraiment dans la balance, retenons que :

• Selon la configuration du navigateur le target="_blank" peut s’ouvrir dans un nouvel onglet ou une nouvelle fenêtre (l’expérience utilisateur dans le cas de l’ouverture d’une nouvelle fenêtre est vraiment nulle);
• Pour les utilisateurs qui veulent avoir le choix, il est toujours possible via un ctrl/cmd clic (ou un clic droit) d’ouvrir le lien dans un nouvel onglet. À l’inverse, si on force l’ouverture, on ne laisse pas le choix à l’utilisateur (personnellement je fais un cmd clic et le lien s’ouvre en arrière-plan dans un nouvel onglet afin que je puisse le consulter plus tard);
• Sur mobile, rien n’est plus désagréable !
• À l’heure du web accessible, ce n’est pas vraiment compatible avec les lecteurs d’écrans etc.

Quelle apparence ?

D’intéressants débats sur stackexchange abordent la question du style des liens externes : y-a-t-il une convention pour distinguer les liens internes des liens externes ? [en] et comment distinguer les liens externes [en].

Sur le fil, la question semble assez tranchée et il faudrait distinguer les liens internes des liens externes. Trois manières peuvent alors être envisagées :

• Mettre les liens externes en bas de page, avec dans le corps de l’article une référence (ancre interne) menant à cette sorte d’index,
• Placer une icône ou changer le style des liens externes (c’est aussi ce que fait Wikipedia avec sa petite icône),
• On peut tout simplement clarifier le texte du lien pour préciser sa destination, par exemple “cet article du figaro sur …”,
• Enfin, on peut renseigner l’attribut title du lien pour qu’une description apparaisse au survol.

On peut d’ailleurs facilement modifier l’apparence des liens externes grâce au CSS :

a[href^="http://"]:not([href*="exemple.fr"]):after,
a[href^="https://"]:not([href*="exemple.fr"]):after {
    content: " " url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAVklEQVR4Xn3PgQkAMQhDUXfqTu7kTtkpd5RA8AInfArtQ2iRXFWT2QedAfttj2FsPIOE1eCOlEuoWWjgzYaB/IkeGOrxXhqB+uA9Bfcm0lAZuh+YIeAD+cAqSz4kCMUAAAAASUVORK5CYII=);  
}

Conclusion

L’apparence des liens est une question à régler au cas par cas. La majorité des sites avec un tant soit peu de rédactionnel ne font pas la différence entre liens internes et externes, ce qui en terme d’UX ne perturbe donc pas l’internaute puisque c’est le comportement auquel il s’attend. Ce choix s’explique naturellement par la forte proportion de liens externes dans ce types de sites, ce qui en fait alors la norme.

Par conséquent, je n’ai pas choisi de différencier les différents types de liens sur le présent blog. Néanmoins, dans le cadre d’un autre type de site, ou pour une webapp par exemple, il serait peut-être judicieux de penser la question différemment.