Comment utiliser <abbr> en HTML?

L’élément HTML abbr indique qu’un mot est une abréviation (au sens large, ce qui regroupe les sigles, acronymes, et plus généralement toute écriture raccourcie). Lorsqu’on souhaite indiquer le sens de l’abréviation, on peut utiliser l’attribut title:

<abbr title="c’est-à-dire">c.-à-d.</abbr>

Les navigateurs web afficheront le contenu de l’attribut title si l’utilisateur survole l’élément. On peut utiliser les styles CSS pour signaler les abréviations de manière bien visible.

Voilà pour la théorie. Reste un problème simple: pourquoi et quand utiliser abbr? Quels sont les bénéfices attendus? Est-ce que ça vaut la peine de s’embêter à écrire des <abbr title="…">…</abbr> un peu partout?

Les principaux cas d’usage

  1. Marquer comme abréviation

    Commençons par le cas le plus simple: sans chercher à donner une information supplémentaire, on veut simplement indiquer que le mot ou l’expression est une abréviation. Par exemple en écrivant <abbr>HTML</abbr>, <abbr>JS</abbr> ou <abbr>adv.</abbr>.

  2. Version longue d’un sigle ou d’un acronyme

    Par exemple <abbr title="Société nationale des chemins de fer français">SNCF</abbr> ou <abbr title="Belgique-Néerlande-Luxembourg">Benelux</abbr>.

  3. Écriture en toutes lettres de l’origine d’une abréviation

    De nombreuses abréviations viennent de langues étrangères ou de langues mortes (notamment du latin), ou de jargons peu connus du grand public. On peut être tenté de donner l’origine d’une abréviation, par exemple <abbr title="confer" lang="la">c.f.</abbr>.

  4. Lecture commune d’une abréviation courante

    Par opposition à l’exemple ci-dessus, on peut choisir de donner la lecture courante d’une abréviation, sans chercher à expliciter son origine: <abbr title="se référer à">c.f.</abbr>.

  5. Sens exact d’une abréviation peu courante

    Certains contenus des pages web doivent tenir dans des espaces exigus: en-têtes de tableau, labels de formulaire, éléments de navigation, etc. Pour gagner de la place, on est parfois amené à écrire des abréviations peu communes, par exemple <abbr title="quantité">quant.</abbr> (ou encore <abbr title="quantité">q<sup>té</sup></abbr>).

Quels usages sont pertinents?

Utiliser abbr seul (exemple 1) ne donne pas d’information exploitable à l’utilisateur ou au navigateur. On lit parfois que cela permet aux synthèses vocales de savoir s’il faut épeler un mot, mais cela ne fonctionne pas: beaucoup d’abréviations ne sont pas des sigles et donc ne sont pas épelées, et même parmi les sigles certains sont épelés (OMS) et d’autres pas (UNESCO). On peut noter que HTML 4, qui proposait un élément acronym en plus de abbr, ne résolvait pas ce problème.

Un autre usage que j’écarte d’emblée: indiquer l’origine d’une abréviation (exemple 3). L’abréviation américaine i.e. est lue that is (ou encore in other words), et pas id est. Si vous souhaitez indiquer le sens d’une abréviation courante telle que c.f., c.-à-d. ou autre, donnez plutôt la lecture «naturelle» de cette abréviation. Si vous souhaitez expliquer que cette abréviation vient du latin ou de l’ouzbèque, écrivez à part un article sur son étymologie.

Les seuls usages pertinents consistent à donner la formulation longue d’une abréviation. Soit les exemples 2, 4 et 5 ci-dessus. Cette formulation longue ne doit pas être une définition, une description ou une information sur l’étymologie de l’abréviation, ou tout autre contenu qui aura sa place dans un lexique, une note de bas de page, un encart ou un article séparé.

Faites simple, limitez les usages de abbr!

De manière générale, je recommande de ne pas surcharger le code HTML avec des éléments abbr utilisés à la moindre occasion. Pour les abréviations servant à articuler le discours, n’explicitez que celles qui sont peu communes. Nul besoin d’écrire <abbr title="et cetera desunt" lang="la">etc.</abbr>, ou même <abbr title="et ainsi de suite">etc.</abbr>; cela ferait perdre du temps à la fois au rédacteur… et au lecteur de l’article qui se demandera pourquoi cette abréviation commune est soulignée, et ce que ce soulignement peut bien vouloir dire.

Mieux, limitez autant que possible les abréviations dans vos textes! En dehors d’une dizaine d’abréviations très courantes, écrivez en toutes lettres. Et pour ces abréviations communes, ne perdez pas de temps à les expliciter à coup de abbr et title. S’il vous semble utile d’expliciter l’abréviation, c’est qu’elle n’est pas assez commune pour être utilisée.

Enfin, pour les sigles, noms de technologies ou d’organisations, ne vous reposez pas sur abbr! Nombre d’utilisateurs n’auront pas accès à l’information dans l’attribut title: parce qu’ils utilisent une revue d’écran qui ne la signale pas, parce qu’ils n’utilisent pas la souris (coucou les écrans tactile), ou tout simplement parce qu’ils ne connaissent pas ce mécanisme et ne penseront pas à laisser le pointeur sur un texte souligné en pointillés. À vous de voir si l’information est importante ou accessoire. Si elle est importante, on la donnera en toutes lettres dans le texte (par exemple entre parenthèses). Si elle est accessoire, on pourra utiliser abbr, un renvoi de note ou autre mécanisme.