HTML - Quotations & Citations

Overview

Estimated time: 20–30 minutes

Quote content with the right semantics: use <blockquote> for blocks and <q> for short inline quotes. Use <cite> for cited works (not author names).

Examples

<blockquote cite="https://example.com/article">
  <p>The future is already here — it's just not evenly distributed.</p>
</blockquote>

He said, <q>HTML is the structure of the web.</q>

<p>Source: <cite>The Economist</cite></p>

Common Pitfalls

• Using <cite> for a person’s name instead of a work.
• Styling quotes with CSS only and losing semantics.

Exercises

1. Wrap a paragraph-length quotation in <blockquote> with a cite URL.
2. Use <q> to mark a short inline quote inside a sentence.