Bruce Lawson’s personal site

On citing quotations. Again.

Every so often, the conversation about how to cite quotations in HTML comes up again.

I’ve experimented throughout the years. In the heady XHTML days, I did

<blockquote cite=”http://example.com/foo”>
Blah blah
<cite><a href=”http://example.com/foo”>Your mum</a></cite>
</blockquote>

but it annoyed me that I was repeating a URL, and the cite attribute was invisible, anyway, so dropped it for

<blockquote>
Blah blah
<cite><a href=”http://example.com/foo”>Your mum</a></cite>
</blockquote>

Then, HTML5 came about and changed the definition of the <cite> element to explicitly disallow citing the name of people. This was a mistake: HTML4 allowed it, so it broke backwards compatibility. Millions of WordPress websites used <cite> to mark up the names of commenters, so it made a very common use case suddently non-conforming. Anyway, no validator could possibly know whether <cite>Jane Eyre</cite> was citing the book or the person.

But, anyway, as part of learning HTML5 I was determined to “do it right” so I switched to using

<blockquote>
Blah blah
<footer><a href=”http://example.com/foo”>Your mum</a></footer>
</blockquote>

because <footer> is explictly allowed inside a blockquote, and the spec says “A footer typically contains information about its section such as who wrote it, links to related documents, copyright data, and the like.”, which seemed highly appropriate.

However, Hixie nixed this idea; apparently, this was for quoting a footer rather than attributing a quotation. (What about quoting a header?). Also, the metadata about the blockquote isn’t actually part of the blockquote.

As my fellow HTML5 Doctor, Oli Studholme has showed, people seldom quote exactly – so sacrosanctity of the quoted text isn’t a useful ideal – and in print etc, citations almost always appear as part of the quotation – it’s highly conventional.

Some have suggested

<figure>
<blockquote>
Blah blah
</blockquote>
<figcaption><a href=”http://example.com/foo”>Your mum</a></figcaption>
</figure>

and that’s fine, but requires more markup, and potentially more complex CSS.

The advantage of cite-inside-blockquote is that it’s obvious what refers to what, because the citation is nested inside the quotation. Without CSS, browsers tend to italicise the citation, so it’s visually obvious that it’s not part of the quotation, but it is indented with the quotation as is very common with print. Also, crucially, it’s a very common markup pattern used by authors, as Steve Faulker has showed.

Once again, I propose that the definition of <cite> be reverted to include the real-world use for marking up names of those cited, and that the spec note that cite-inside-blockquote is one way (although not the only way) to link a quotation with the work or the person being quoted.

Also see

26 Responses to “ On citing quotations. Again. ”

Comment by steve

apparently, this was for quoting a footer rather than attributing a quotation.

How often does the original source code get included as part of a quote? How does that even work? does it mean that any code inside a blockquote or q have to be from original source?? Seems like a red herring to me. quoting is about text primarily and if the text includes code it should be represented as a code example visible to the user no?

Comment by James Smith

@John Faulds – same here… cite inside blockquote just seems to make semantic sense to me, and it’s simple and convenient. Unless you’re writing some kind of scholarly essay it’s rare to use cite as a proper source attribution – most use cases from my experience seem to be for things like client testimonials with their name and job title in the nested cite element.

Comment by Bruce

Oli

nope, it doesn’t solve the whole problem. But it does solve the common, simple use case of putting a quotation on a page and saying who said it.

Comment by Koen Cornelis

As i’m still learning html this might be a daft question: but why not use a data attribute for a span? Something like this:

Blah blah
Your mum

Wouldn’t that solve the problem?

Comment by Koen Cornelis

hm, since it seems my escape wasn’t sufficient to block the code and the code even got modified here’s what i ment with () instead of

(blockquote)
Blah blah (span data-type=”cite”)(a href=”http://example.com/foo)Your mom(/a)(/span)
(/blockquote)

hope that works

Comment by Erik Vorhes

I’m still smarting over the debate I had with Hixie back in 2009. &lt;cite /&gt; should be the right element to use for marking up citations, period.

In the given use-case, you might see a piece of punctuation before the citation; you could provide that using ::before in CSS. Other included text usually is a person’s title or other “metadata” that relates directly to the person being quoted or to the quote itself. In either case, it’s hard to imagine that text as being anything other than part of a citation.

Comment by steve faulkner

@Bruce

I have updated the definition of the cite element in the HTML 5.1 editors draft, please review and comment.

The cite element represents reference information about the source of quoted text. It may be formal reference (i.e. an academic citation), which may include the author(s) name, the title of a work, page number(s) date of publication or other information typically included, dependent on the citation style being used. It may also be an informal reference such as the author’s name.
– HTML 5.1

Comment by Ron

Wait. I’m confused. So, does Hixie say what we _should_ use instead of the FOOTER element?

The CITE element looks like its supposed to be for titles of works, only, never names of people. So which element should we use for the person being quoted?

Comment by steve faulkner

after feedback on the cite element definition in the HTML 5.1 editors draft, i have updated please review and comment.

Leave a Reply

HTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> . To display code, manually escape it.