Quotations, Citations & Abbreviations
When you quote someone, name a work, abbreviate a term or give contact details, HTML has elements that say exactly that. They make the source of information clear to readers, and machine-readable for browsers and search engines.
Block quotations
<blockquote> is for longer quotations set apart from the surrounding text. Browsers indent it by default. The optional cite attribute holds the source URL; it isn't displayed, so name the source in visible text too.
Quotations with a caption
To attach the attribution to the quote properly, wrap both in a <figure>:
Inline quotations
<q> is for short quotes within a sentence. The browser adds the right quotation marks for the language automatically — so don't type them yourself.
Citing a work
<cite> marks the title of a creative work — a book, film, song, article or painting. It's not for the person's name.
Abbreviations and definitions
<abbr> marks an abbreviation; its title gives the full form, shown as a tooltip on hover. Because tooltips aren't available on touch screens or to everyone, it's good practice to spell out an abbreviation in the text the first time you use it. <dfn> marks the place where a term is defined.
Contact information
<address> is for contact details of the page's or article's author or owner — not for any postal address that happens to appear in content.
Summary
| Element | Use it for |
|---|---|
<blockquote> | A long, separate quotation |
<q> | A short quotation inside a sentence |
<cite> | The title of a creative work |
<abbr> | An abbreviation or acronym |
<dfn> | The defining instance of a term |
<address> | Contact information for the author/owner |