Il existe en HTML un certain nombre de manières, finalement assez peu connues, d’afficher références et citations au sein d’une page HTML. En français, au moins, on se contente la plupart du temps de souligner les citations ou de les mettre en italique, la mise en forme prenant, une fois de plus, le pas sur la sémantique, fut-elle uniquement structurelle.

Pour faire référence à une source

HTML 4 et XHTML disposent de la balise cite, qui permet de spécifier que le texte est une référence externe, que ce soit le titre d’un ouvrage, ou l’auteur d’une citation.

Comme le disait <cite>Archimède</cite>, tout corps plongé dans l'eau en ressort mouillé.

Ou :

"Maraud, faquin, butor de pied plat ridicule", <cite>Cyrano de Bergerac, acte 1, scène 4</cite>.

Cite dispose également de l’attribut title, dans lequel il est possible, par exemple, de mettre une référence plus complète que celle affichée dans le flot du texte.

Dans le cadre d’HTML 5, Eric Meyer a proposé d’enrichir la balise cite, en lui permettant désormais de pointer vers une source externe, avec l’attribut href, et d’indiquer le type de média.

Le <cite href="http://rails-envy-podcast.s3.amazonaws.com/podcast%2073.mp3" media="audio/x-mp3">Podcast 73 de Railsenvy</cite> est bien, abonnez-vous.

J’aime beaucoup cette approche, mais il semble qu’elle n’ait, pour l’instant, pas été retenue.

Au passage, vous remarquerez que, malgré son nom, cite ne permet pas de faire de citations. En anglais, une citation se dit en effet quote.

Pour des citations courtes

Les citations courtes se font via l’utilisation de la balise q, pour quote. Notre premier exemple précédent devient alors :

Comme le disait <cite>Archimède</cite>, <q>tout corps plongé dans l'eau en ressort mouillé</q>.

Q permet également d’indiquer la langue dans laquelle se trouve la citation :

Comme le disait <cite>Archimède</cite>, <q lang="fr-FR">tout corps plongé dans l'eau en ressort mouillé</q>.

En HTML et XHTML, on pourra également utiliser l’attribut cite, mais celui-ci n’est supporté par aucun des grands navigateurs.

Comme le disait <cite>Archimède</cite>, <q lang="fr-FR" cite="http://fr.wikipedia.org/wiki/Archimède">tout corps plongé dans l'eau en ressort mouillé</q>.

Pour des citations longues

Tout comme Q est une balise de type inline, HTML et XHTML permettent d’effectuer des citations longues à l’aide de la balise blockquote.

<blockquote cite="http://www.synec-doc.be/escrime/dico/anth8.htm">
  <p>Le Vicomte. <br />
     Maraud, faquin, butor de pied plat ridicule !</p>

  <p>Cyrano, ôtant son chapeau et saluant comme si le vicomte venait de seprésenter.<br />
  Ah?... Et moi, Cyrano-Savinien-Hercule de Bergerac.</p>
</blockquote>

La balise blockquote est une balise de type bloc, qui rajoute par défaut de la mise en forme au bloc ainsi créé : marge à gauche, espace en haut et en bas. Ceci permet de distinguer le bloc du reste du document.

Là encore, l’attribut cite n’est pas supporté par les principaux navigateurs du marché.

Et voilà, c’est fini. J’avais envie de mettre en lumière ces balises HTML trop souvent oubliées ou ignorées à mon goût, alors qu’elles existent pourtant, et remplissent à peu près leur office malgré quelques manques flagrants dans un univers hypertexte.

Sources :

Perry the Platypus wants you to subscribe now! Even if you don't visit my site on a regular basis, you can get the latest posts delivered to you for free via Email: