Markup HTML pour des questions / réponses

Juste une petite note pour rebondir sur un billet de Karl Dubost concernant la syntaxe HTML pour écrire une série de questions / réponses.

Alors que dans l'exemple fournit par Karl, la distinction entre question et réponse n'a lieu que par la feuille de styles appliquée, ce qui rend le document difficilement lisible sans les CSS (c'est le sujet du billet), il faut noter que les spécifications HTML prévoient l'utilisation des listes de description pour ce type de contenu :

Name-value groups may be terms and definitions, metadata topics and values, questions and answers, or any other groups of name-value data.

ref (emphase de mon fait).

On peut donc écrire quelque chose comme :

<dl class="faq">
    <dt>Question</dt>
    <dd>Réponse</dd>
</dl>
Utilisation des listes de description pour des couples questions / réponses.
/* 

faq
===========================

Classe pour styliser une liste de description sous forme de
questions / réponses. 

example:
    <dl class="faq">
        <dt>Question</dt>
        <dd>Réponse</dd>
    </dl>

*/

.faq > dt {
    padding: 0;
    margin: 0 0 0.75rem 1.5rem;
}
.faq > dd {
    padding: 0;
    margin: 0 0 0 1.5rem;
}
.faq > dt:before,
.faq > dd:before {
    display: inline-block;
    width: 1.5rem;
    margin-left: -1.5rem;
    font-weight: bold;
}
.faq > dt:before {
    content: "Q:";
}
.faq > dd:before {
    content: "R:";
}
Styles pour des couples questions / réponses.
Do you think the Python community is especially welcoming or supportive of women compared to other development communities, either FOSS or corporate?
It's hard to comment on other communities from the outside, nor would I want to undermine their outreach efforts by focusing on isolated incidents. That said, I do think the Python community is particularly welcoming to women.
Exemple.

Le contenu sera à la fois lisible avec et sans les styles.

DUBOST, Karl. Un markup en manque de sens. Les carnets Web de La Grange,

RAGGETT, Dave ; LE, Hors ; JACOBS, Ian. Spécification HTML 4.01. W3C, . 4.5.8 The dl element