Citations and quotes

Since Mark Pilgrim began making fine use of cite, I’ve wondering whether my use of said tag has been correct. Mark uses cite to mark up a reference to another source – exactly as I have done with his name in the previous sentence. Conversely, I have always used cite to indicate a quotation from a source (but then I never reckoned on using it to create an archive by citation). Well, it seems we are both right. From the HTML 4.01 spec:

Contains a citation or a reference to other sources.

For those of us who are unsure of precisely what a citation is, the Oxford English Dictionary says:

1. a quotation from or reference to a book, paper, or author, especially in a scholarly work.

So then I recalled we have another tag for quotations in the form of <q>. From the spec again:

Q is intended for short quotations (inline content) that don’t require paragraph breaks.

Hmm. So should I be using cite or q to contain quotations? A sensible answer would seem to be use q for quotations from and cite for references to. But let’s consider the default rendering on the world’s most widely used browser (IE/Win): cite is shown in italic whereas q is not differentiated at all. No quote marks, no italics, no nothing. That’ll be why I’ve never bothered with q then.

During his internal battle with this issue (9 months ago – I’m way behind), Mark exposed some smart CSS2 code to deal with q. Compliant browsers got nice quote marks and IE/Win got italicized text:

Q {
 quotes: '201C' '201D' '2018' '2019';

Q:before {
 content: open-quote;

Q:after {
 content: close-quote;


Mark later back-pedalled and scrapped all use of q. His reason being that JAWS, the popular screen reader, requires IE/Win and could not distinguish when a quotation was reached. Instead Mark chose a server side solution to replace q with quote marks. I’m gonna stick with the CSS method for time being; I reckon that written context and the odd comma should be enough indication to the listener when something is a quotation or not (I could be wrong…).

Which brings me back to cite. One of the reasons that I’ve never used it to mark up a reference to a source is because that’s often done with a link (but only visually, not meaningfully). What a shame there’s no href attribute; this would be nice:

<p><cite href="">Richard Rutter</cite> went on about tedious markup and bored everyone to tears.</p>

  • And now for a little bit of politics. John Le Carré writes in the Times Online, I cringe when I hear my Prime Minister lend his head prefect’s sophistries to this colonialist adventure.