Valid use of <q>, <blockquote> and <cite>

Question

Is this valid use of q, blockquote and cite?

<q>Life is what happens when you're busy making other plans</q>
<cite>John Lennon</cite>

or

<blockquote>Life is what happens when you're busy making other plans</blockquote>
<cite>John Lennon</cite>

Answer 1

<q>

The q element represents some phrasing content quoted from another source.

<p>And then he said <q>I heart HTML5.</q></p>

---

<cite>

The cite element represents the title of a work (e.g. a book, a paper, an essay, a poem, a score, a song, a script, a film, a TV show, a game, a sculpture, a painting, a theatre production, a play, an opera, a musical, an exhibition, a legal case report, etc). This can be a work that is being quoted or referenced in detail (i.e. a citation), or it can just be a work that is mentioned in passing.

<p>My favourite book is <cite>Introducing HTML5</cite> by Bruce and Remy.</p>

---

<blockquote>

The blockquote element represents a section that is quoted from another source. Content inside a blockquote must be quoted from another source, whose address, if it has one, may be cited in the cite attribute.

<blockquote>What we have here is a quotation from another source.</blockquote>

Answer 2

Fast answer:

<q> for brief inline quotation.
<blockquote> for "large" or grouped elements that are all part of a quote.
<cite> to give credit to a source.

The W3C HTML5 Spec states the following:

q

The q element represents some phrasing content quoted from another source.

Code example:
<p>The man said <q>Things that are impossible just take longer</q>. I disagreed with him.</p>

blockquote

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.
Code example:
<blockquote>
<p>I contend that we are both atheists. I just believe in one fewer god than you do. When you understand why you dismiss all the other possible gods, you will understand why I dismiss yours.</p>
<footer>— <cite>Stephen Roberts</cite></footer>
</blockquote>

cite

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.
Code example:
<p><cite>Universal Declaration of Human Rights</cite>, United Nations, December 1948. Adopted by General Assembly resolution 217 A (III).</p>

Answer 3

According to what standard?

If I had read this question yesterday, I'd answered "no, it's incorrect". Indeed, until very recently, the HTML5 spec (indeed, both the latest version of the Editor's Draft and the Candidate Recommendation) stated

The cite element represents the title of a work (e.g. a book, a paper, an essay, a poem, a score, a song, a script, a film, a TV show, a game, a sculpture, a painting, a theatre production, a play, an opera, a musical, an exhibition, a legal case report, etc). This can be a work that is being quoted or referenced in detail (i.e. a citation), or it can just be a work that is mentioned in passing.

A person's name is not the title of a work — even if people call that person a piece of work — and the element must therefore not be used to mark up people's names.

Hence, the text contents of the <cite> node has to be the title of a work -- not the name of the author.

However, this evening I discovered that the semantics of the <cite> element in the Editor's Draft has been changed. Now it says

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.

Hence, author names are allowed. In fact, an example equivalent to yours is given in the document.

I don't know which version will 'win' and become a part of the stable recommendation planned for next year (2014).

Answer 4

Example of Blockquote and Quotation tag

Semantically <blockquote> is used for longer quotes that take up an entire paragraph: Note how the <p> is still inside the <blockquote> element.

As for <q> The element is used for shorter quotes that sit within a paragraph. Which puts quotes around an element.