Enlever les pointillés autour des liens

Publié le 28 août 2008 par Easyconcept

En présentant l'évolution d'un site statique en construction, j'ai expliqué au client que nous avions externalisé le menu. De cette manière, il pourra en changer l'ordre des items et son contenu en modifiant un seul fichier, lui évitant ainsi de devoir travailler sur tous les fichiers du site. J'ai alors pu constater que, graphiquement, nous pouvions améliorer l'aspect du menu en supprimant les pointillés entourant l'item lors du clic.

Ce pointillé peut être géré en CSS par le biais de la propriété "Outline" (contours). Les contours, à l'inverse des bordures, n'occupent pas d'espace et sont toujours tracés au-dessus de la zone qu'ils délimitent.

Pour supprimer le pointillé entourant le lien, il suffit de préciser que vous ne souhaitez pas voir les contours sur les liens : a {outline: none;}

Graphiquement, cette astuce est assez intéressante. Il faut cependant être conscient qu'il s'agit sans doute d'une entrave à la navigation par clavier. En effet, cette modification empêche les personnes qui utilisent l'appui sur la touche de tabulation de visualiser l'endroit où elles se situent dans le menu. A utiliser en connaissance de cause, donc !