Carnet de notes

Attri­buer une cita­tion en HTML

On parle de HTML 5, le web n’est qu’une multi­tude de liens, et on ne sait toujours pas attri­buer une cita­tion. Comment est-ce que je source le Au-revoir de Valéry Giscard d’Es­taing ?

<blockquote>Au revoir.</blockquote>

Il y a bien un attri­but cite dans <blockquote>. Je peux y mettre un lien mais ce lien ne sera ni affi­ché ni action­nable dans les navi­ga­teurs.

Je peux aussi mettre un texte dans un attri­but data-source et l’af­fi­cher avec le lien via quelques geeke­ries CSS. C’est un peu mieux mais le lien n’est ni cliquable ni sélec­tion­nable pour un copier-coller : Plus frus­trant du meurs.

Je ne parle même pas d’al­ler indiquer la date dans la cita­tion avec la balise <time>, là on entre­rait dans la science fiction.

<style>
blockquote::after { content: "-- " attr(data-source) ", " attr(cite);
</style>

La solu­tion du pauvre – celle que j’uti­lise sur ce blog – c’est de mettre la source direc­te­ment dans le <blockquote>. Il s’agit toute­fois d’un détour­ne­ment du sens des balises, parce que l’at­tri­bu­tion ne fait pas partie du bloc cité.

D’autres proposent de mettre ça dans un <footer> du <blockquote>, éven­tuel­le­ment avec un <cite>. C’est un peu mieux – le <footer> est offi­ciel­le­ment fait pour être de la méta­don­née à propos du bloc parent – mais ça reste bancal : Le code ne permet pas de sépa­rer ce qu’on cite de l’at­tri­bu­tion elle-même.

<blockquote>
  Au revoir.
  <footer>
    -- Valéry Giscard d'Estaing, 
    <cite>
      <a href="http://www.ina.fr/video/I08358793">
        dans son discours du 
        <time datetime="1981-05-19">le 19 mai 1981</time> 
        avant la passation de pouvoir à François Mitterrand
      </a>
    </cite>
  </footer>
</blockquote>

La balise <figure> peut venir à notre rescousse. On englobe le <blockquote> dans la <figure> et on ajoute un <figcaption> pour l’at­tri­bu­tion, avec éven­tuel­le­ment un <cite> correc­te­ment placé.

<figure>
  <blockquote>Au revoir.</blockquote>
  <figcaption>
    -- Valéry Giscard d'Estaing, 
    <cite>
      <a href="http://www.ina.fr/video/I08358793">
        dans son discours du 
        <time datetime="1981-05-19">le 19 mai 1981</time> 
        avant la passation de pouvoir à François Mitterrand
      </a>
    </cite>
  </figcaption>
</figure>

Quelque part j’ai encore mal parce qu’un robot ne reliera pas l’at­tri­bu­tion et la cita­tion.

Reste aussi que la défi­ni­tion de <figure> indique que l’em­pla­ce­ment de son contenu dans le texte envi­ron­nant n’a pas d’im­por­tance, ce qui ne me parait pas forcé­ment vrai pour une cita­tion.

On sait expri­mer tout ça à desti­na­tion des moteurs de recherche en rdfa, en micro data ou en json-ld, le tout avec un voca­bu­laire normé, mais on n’a toujours rien pour les données visibles de l’uti­li­sa­teur. Que la spéci­fi­ca­tion HTML 5 ait été diri­gée par un éditeur de Google ne peut être qu’une coïn­ci­dence.

Éric

7 réponses à “Attri­buer une cita­tion en HTML”

  1. Tu soulignes un vrai problème ! Voir comment Karl a géré cette question sur la-grange.net, même s’il s’agit également de bricolage :
    `
    <blockquote cite= »978-2-7143-0303-5″>
    Le courant qui passe au fil de la plume ne <em>va</em> personne.
    </blockquote>
    Julien Gracq, <cite>En lisant, <em>en écrivant</em></cite>
    `
    Karl avait écrit des billets à ce sujet, que je ne retrouve pas ;)

    Répondre

    • L’attribut cite ne devrait contenir qu’une URL. À la limite en préfixant par « urn:isbn: » mais je ne sais pas qui s’en servirait.

      Mon problème avec cette forme, c’est que l’attribution est une simple ligne de texte sans liaison avec la citation.

  2. Deux liens sur le sujet :
    – Un billet autrefois où je parlais de l’extension que Karl avait développé pour afficher les attributs « cite » (la version Opera ne semble plus exister mais celle de Firefox si. Je l’utilise toujours) http://emmanuel.clement.free.fr/blog/index.php/post/2012/11/21/Citations Par ailleurs, le code de Karl est sur Github https://github.com/karlcow/QuoteLink ;
    – un second billet que j’avais écrit à propos de la forme des citations et épigraphes : http://emmanuel.clement.free.fr/blog/index.php/post/2014/03/07/La-forme-d-une-citation

    Je n’ai pas les compétences techniques mais ça serait chouette de faire évoluer cette extension :-)

    Répondre

  3. Je pense que le message d’Antoine a été mangé, car j’utilise des urn:isbn pour les citations sauf erreurs. Et en effet, l’attribut cite n’est que pour les choses que tu peux lier par une URI.

    Il n’existe pas de solutions uniformes et tous les efforts réalisés dans ce sens pour rendre une citation dont la source est cliquable ont été vains.

    [blockquote cite= »cite_uri »][p]le texte[/p] [/blockquote]
    [cite]Titre[/cite]

    Note que tu pourrais faire un JS pour associer la référence de l’attribut cite à l’élément cite en faisant: [cite][a href= »cite_uri »]Titre[/a][/cite].

    Au moins la référence sémantique est là et l’expérience utilisateur est améliorée pour les gens avec des moteurs comprenant le JS (progressive enhancement).

    Mon rêve aurait été un système suivant ce modèle.

    ===

    L’auteur de [cite for= »foobar »]Titre[/cite] blahablablah en 1345 nous a laissé ce passage :

    [blockquote cite= »cite_uri » id= »foobar »] [p]le texte[/p] [/blockquote]
    blablablaha.
    ===

    sur le même modèle que les formulaires qui deviendraient un lien associatif entre le cite et le blockquote/quote.

    Répondre

  4. Toi qui attache de l’importance à la typo, il me semble que les deux tirets « — » que tu utilises pour l’auteur d’une citation peuvent être avantageusement remplacés par un tiret cadratin, — en HTML. (Mais je crois qu’on peut utiliser au choi le tiret cadratin ou le demi-cadratin. Il me semble que le double tiret est une mesure pour reproduire le tiret long. ) Cf. l’article Wikipédia : https://fr.wikipedia.org/wiki/Tiret

    Répondre

    • Je ne retrouve pas cet usage typographique du cadratin pour introduire une source de citation. Historiquement les citations sont plutôt en notes en bas de page avec un renvoi.

      Le double tiret – espace je l’attribue aux signatures e-mail et newsgroup, mais peut-être me trompe-je

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée.