cite and blockquote – reloaded

Celý článek

The definitions of the blockquote and cite elements in the HTML specification have recently been updated. This article explains what the changes mean for developers.

Russian translation: Сite и blockquote: перезагрузка

blockquote definition updated

The blockquote element represents content that  is quoted from another source, optionally with a citation which must be within a footer or cite element, and optionally with in-line changes such as annotations and abbreviations.
Content inside a blockquote other than citations and in-line changes must be quoted from another source, whose address, if it has one, may be cited in the cite attribute. [emphasis mine]
– 4.4.4 the Blockquote element , Faulkner et al. 2016

Note the added emphasis indicated via an inline note using square brackets “[emphasis mine]”

What the changes to blockquote mean for developers

Previously in HTML5 it is was not conforming to include citations within blockquote elements. Now it is, as long as the citation content is within a cite or footer element. Citations inside blockquote elements are a common markup pattern (data indicates approximately 60% of blockquote elements include citations), the change to the HTML spec acknowledges this and provides semantic mechanisms to differentiate quoted content from citations.

Example of footer and cite used inside a blockquote:

<blockquote>
<p>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.</p>
<footer>
— <cite><a href="http://www.brucelawson.co.uk/2013/on-citing-quotations-again/">Bruce Lawson</a></cite>
</footer>
</blockquote>

The above example is indicative of what authors are doing anyway, so rather than maintain a theoretical purity which serves no one, the definition has been modified to solve a real problem using existing HTML features, rather than re-inventing the wheel.

An edge case

One of the arguments against allowing use of cite and footer in blockquote to identify citation content is that the quoted content itself may contain these elements. The simple reason for dismissing this argument is that the vast majority of instances of quotations in blockquote elements this will not be the case. Denying the utility of cite and footer for an edge case is another example of theoretical purity that serves  minimal practical purpose.

If the case does arise for you, one method the HTML speccurrently suggests is you comment out the elements from the source (This is still an open issue and advice may change):

(added 20/11/13) In response to feedback the suggestion in the HTML spec is to use a class attribute (a defined extensibility mechanism) on the cite element to identify it as an inclusion from the quoted source:

  <blockquote>
  <p>My favorite book is <cite class="from-quote">At Swim-Two-Birds</cite></p>
  <footer>- <cite>Mike[tm]Smith</cite></footer>
  </blockquote>

cite definition updated

The cite element represents a reference to a creative work. It must include the title of the work or the name of the author (person, people or organization) or an URL reference, which may be in an abbreviated form as per the conventions used for the addition of citation metadata. [emphasis mine]
– 4.51 the Cite element , Berjon et al. 2013

What the changes to cite mean for developers

Previously in HTML5 it is was not conforming to cite an author by name or include other reference information for a creative work in a cite element, the use of cite was reserved (theoretically) to identify the title of a creative work. This was an attempt to rip up a cow path, that authors had created over the last 14 years of the cite elements existence.

Authors railed against the change in definition:

Join me in a campaign of civil disobedience against the unnecessarily restrictive, backwards-incompatible change to the cite element. Start using HTML5 but start using it sensibly. Let’s ensure that bad advice remains fictitious.

Jeremy Keith, 2009

They also provided use cases and real world examples of citation usage. As a result of research, data analysis and discussion, authors can now, again, use the cite element to identify a wider range of references to a creative work; the title of the work or the name of the author (person, people or organization) or an URL reference. What we lose in theoretical purity we gain in utility:

part of the reason why <cite> can now be used with an URL (not to mention @bing‘s identical use. http://t.co/h3qp3ujfzX

— Steve Faulkner (@stevefaulkner) October 22, 2013

What do you think?

Please read the definitions in HTML 5.1, your feedback as always is welcome!

• 4.5.6 The cite element
• 4.4.4 The blockquote element

Big up! to Doctor Oli whose research helped mold the changes made to the cite and blockquote elements. And to Doctor Bruce for insisting that it his right to cite his mum.

cite and blockquote – reloaded originally appeared on HTML5 Doctor on November 4, 2013.