: Standards for long format dialogue when published to web I'm posting some extremely long audio transcripts from 50 minute long radio recordings. I'm afraid that any search engine crawler will

@Ann8826881

HTML5 (CR) has an own section about conversations (e.g., for "dialogues in screenplays").

They recommend to use


p and punctuation
span/b for the speaker name (if a hook is needed for styling purposes)
(but see my comment below regarding cite)
i for stage directions


Simple example:



<p><span>Alice</span>: How are you?</p>
<p><span>Bob</span>: Good.</p>
<p><i>Carol enters the room.</i></p>


I think you could use the cite element for the speaker name instead. It was once explicitly not appropriate to use it for person names, but the spec changed.

<p><cite>Alice</cite>: How are you?</p>
<p><cite>Bob</cite>: Good.</p>


If you quote the content of your transcript, you should use q/blockquote. But I wouldn’t use quotation elements if the transcript is provided on the same site resp. by the same publisher, and it’s serving as alternative to the audio.




I've researched and found that for a dialogue a <dl> <dt></dt> <dd></dd> </dl> is recommended […]


In HTML5, the dl element should not be used, as it’s "inappropriate for marking up dialogue".

Note that the above linked section about conversations shows an example using dl, but this example is not for a dialogue but for a graph of interactive conversations, listing possible responses.

Vote Up Vote Down

@Cofer257

For your specific situation, I would recommend:


Using a th element for the speaker name, as that makes more sense in the table context.
Wrapping the spoken content in a blockquote element. For example, <td><blockquote>What they said.</blockquote></td>


However I feel like there must be a way to achieve the design you want using the dl tag. You can float dt and dd tags to the left and that would gain you the same text layout. The only difference would be making equal height columns that you get for free with tables.

It appears to be invalid to wrap each dt/dd pair in another tag, eg <dl><div><dt>Announcer</dt><dd>Speech</dd></div></dl>. If you did that you could easily use display: table and the like in CSS.

Vote Up Vote Down