"Correct" way to mark up testimonials in HTML - html

Question

I thought this would be an easy enough thing to find online but it seems not. I'm trying to find out what would be considered the correct way to mark up a list of testimonials - quotes with authors - on a page.
e.g.
"This is what I think"
- My Name, My Company
I'd imagine the quote should go in a blockquote. I've also seen some use of cite to shown where a quote comes from but the HTML reference seems to show that this should be used to give the URL of a web page that the quote comes from, not the name of the person.
Does anyone have any suggestions for how this should be marked up?

Answer 1

The "old" way:
I might be chiming in very late, but I think the following is the correct way to mark up a testimonial:
<figure>
<blockquote>
"This is what I think"
</blockquote>
<footer>
— <cite class="author">My Name</cite>, <cite class="company">My Company</cite>
</footer>
</figure>
Per the W3C spec:
...the citation is contained within the footer of a figure element, this groups and associates the information, about the quote, with the quote...
.
.
.
The figure element represents some flow content, optionally with a caption, that is self-contained (like a complete sentence)...
Update:
As #MCTaylor17 has pointed out, the best practice has changed in regards to citing a quote. Here's the new spec (as of December 2017): https://www.w3.org/TR/html52/textlevel-semantics.html#the-cite-element
Now the <cite> element is expected anywhere you would expect Phrasing Content. This means that it should go within a <p>, <blockquote>, etc.
Example 17 in the spec demonstrates using a <cite> within a <blockquote>:
<blockquote>"Money is the real cause of poverty,"
<footer>
<cite id="baseref">The Ragged-Trousered Philanthropists, page 89.</cite>
</footer>
</blockquote>
To apply this to your own quote:
<blockquote>
"This is what I think"
<footer>
— <cite class="author">My Name</cite>, <cite class="company">My Company</cite>
</footer>
</blockquote>

Answer 2

You are correct in your assumption that a quote is supposed to go into a blockquote element and that the cite attribute should be used for the URI. Personally I handle the author of the quote with a separate div or p at the bottom of the quote like so:
<blockquote cite="http://a.uri.com/">
<p>This is a really insightful sentence.</p>
<p class="quoteCite">Darko Z</p>
</blockquote>
Then I just use CSS to make it look nice. Pretty basic. You might want to go look at Microformats.org as well and search around for ideas.
Hope this helps
EDIT: Its late and it slipped my mind but you could also use the cite element
<blockquote cite="http://a.uri.com/">
<p>This is a really insightful sentence.</p>
<cite>Darko Z</cite>
</blockquote>
but im not a 100% sure how well its supported, to be honest
EDIT 2: According to the HTML 5 draft, cite shoudn't be an author name so for future proofing you probably shouldn't use cite for that purpose.

Answer 3

Things changed. I think a proper structure in this century should look like:
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
<footer>
<cite title="Source Title">
Bill Gates
</cite>
</footer>
</blockquote>

Answer 4

You may be interested in using the hReview format--Google is rumored to support it, and it's pretty much applicable to your situation, depending on whether you're only interested in the appearance, or whether you want to facilitate machine readability as well.

Answer 5

Following the Mozilla Developer API this is the correct way to mark up a testimonial:
<figure>
<blockquote>
"This is my testimonial"
</blockquote>
<figcaption>
— <cite class="author">My Name</cite>, <cite class="company">My Company</cite>
</figcaption>
</figure>

Answer 6

Here are two solutions based on the HTML Living Standard:
<blockquote>
<p>This is what I think</p>
</blockquote>
<p>- My Name, My Company</p>
<figure>
<blockquote>
<p>This is what I think</p>
</blockquote>
<figcaption>My Name, My Company</figcaption>
</figure>
As Darko Z. says in the edit of his answer you should not use <cite> for the author's name. This is because, according to the spec today, <cite> is for marking up the title of a work, not for naming the author. In WHATWG's own words:
The cite element represents the title of a work... 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.
The spec also says, that "attribution for the quotation, if any, must be placed outside the blockquote element."

Answer 7

If you are asking how this should be marked up semantically, yes, use a block quote, and yes, the cite attribute is for URL's. As for presentation, you could use whatever you want and style it accordingly.
Visitors will never see the difference unless they look at the source code, and I can't imagine that it would affect SEO either.

Answer 8

HTML5 includes a <figcaption> tag. To whit:
<figure>
<blockquote cite="http://example.com/page">
Nevermore
</blockquote>
<figcaption>
The Raven
</figcaption>
</figure>

Answer 9

A lot of comments here suggesting to use the cite element for the name of the person who wrote the review.
The <cite> HTML element is used to describe a reference to a cited creative work, and must include the title of that work.
The Citation element

Answer 10

<!DOCTYPE html>
<blockquote>
<p>Quote
</blockquote>
<p>Author
would be the most correct.