<cite> & <blockquote> Elements - The Elements Of Meaningful XHTML

Generic Markup Example

						<p>Eric Meyer wrote:</p>
						<p>
						What's so interesting to me is that the guys who decided 
						to focus on the positive went out and did something; 
						those who want to mix in the negative seem to have 
						nothing to offer except complaints.
						</p>
						<p>An excellent contrast between those who want to 
						build new things and those who want to tear them down.
						</p>
					

Adding Meaning Using <cite> And <blockquote>

						<p> <cite>Eric Meyer</cite> wrote:</p>
						<blockquote cite="http://meyerweb.../social-protocols/">
						<p>
						What's so interesting to me is that the guys who decided 
						to focus on the positive went out and did something; 
						those who want to mix in the negative seem to have 
						nothing to offer except complaints.
						</p>
						</blockquote>
						<p>An excellent contrast between those who want to 
						build new things and those who want to tear them down.
						</p>
					

Swooshy Curly Quotes Without Images

Firstly, remove the opening “ from the quote. Replace it with the opening curly quote character entity “. Then replace the closing “ with the entity reference for that, which is ”. Now at least the curlies will look nice and swooshy.

<blockquote> : Semantics, HTML, XHTML, And Structure

Citation: The <blockquote> Element

<blockquote> at W3C: "<blockquote> is for long quotations (block-level content)." Don’t use <blockquote> just for text indenting. If you want to indent text, use CSS {margin:}, {padding:}, or a combination of both. Likewise, if you don’t want to use <blockquote> because of its block-level characteristics, you can use CSS to change them, too.

Include the cited source and title within the BLOCKQUOTE element:

1. Link to the citation:

Use the cite="" attribute for the source’s URI: cite="uri".

						Example
							<blockquote cite="http://w3c.org/" title="Article title, author, date">"I'm citing the W3C here."</blockquote>
					

From W3C regarding the cite="" attribute:
The value of this attribute is a URI that designates a source document or message. This attribute is intended to give information about the source from which the quotation was borrowed.

2. Use the title="" attribute for the source title: title="text":

						Example
							<blockquote cite="http://w3c.org/" title="Article title, author, date">"I’m citing the W3C here."</blockquote>
					

The above markup becomes this:

"I'm citing the W3C here."

It's also recommended to include a visual reference to your citation, as always, perhaps like this:

"I'm citing the W3C here."

Article title, author, date

Note: When you hover your mouse over the quotation in some browsers the title="" information will appear.

Note: While <blockquote> is intended for longer quotations and <q> is intended for shorter quotations, the <q> element is not supported by browsers and even causes problems for some alternative devices, so its use at the moment is not recommended. Hopefully next generation browsers will support it.