HTML Quotes and Citations: blockquote, q, cite, abbr, address and time

HTML has elements that describe quotations, sources, abbreviations, contact details and dates. They help browsers, search engines and assistive technology understand your text.

Long quotations: blockquote#

<blockquote> marks a quotation that stands on its own, usually a paragraph or more. Browsers indent it:

<p>A well-known line from the Tao Te Ching reads:</p>
<blockquote>
  <p>A journey of a thousand miles begins with a single step.</p>
</blockquote>
<p>It is a reminder that big projects start small.</p>

Put paragraphs inside the <blockquote>. If the quote comes from a web page, you can add its address with the cite attribute: <blockquote cite="https://example.com/source">. Browsers do not display this attribute; it is information for software.

Short quotations: q#

<q> is for short quotations inside a sentence. Browsers add quotation marks automatically:

<p>My teacher always says <q>practice beats talent</q>.</p>

Do not type your own quote marks around a <q>, or you will get two sets.

Titles of works: cite#

The <cite> element marks the title of a creative work: a book, film, song, article or website. Browsers show it in italics:

<p>My favourite book is <cite>Wings of Fire</cite> by A. P. J. Abdul Kalam.</p>

Use <cite> for the title of the work, not for the person's name.

Abbreviations: abbr#

<abbr> marks an abbreviation. Use the title attribute for the full form, which most browsers show as a tooltip on hover:

<p>Pages are written in <abbr title="HyperText Markup Language">HTML</abbr>.</p>
<p>The <abbr title="World Health Organization">WHO</abbr> was founded in 1948.</p>

Because a tooltip is not available on touch screens or to every user, also spell out the full form in the text the first time it appears, when that matters.

Contact information: address#

<address> holds contact information for the person or organization behind a page or article: an email, phone number, postal address or link:

<address>
  Written by <a href="mailto:hello@example.com">Asha Rao</a>.<br>
  Hyderabad, India
</address>

Use it for contact details of the page owner or author, not for every postal address that appears in your content.

Dates and times: time#

<time> marks a date or time. The datetime attribute holds a machine-readable version, so the visible text can be written any way you like:

<p>The workshop starts on <time datetime="2026-11-14">14 November</time>.</p>
<p>Doors open at <time datetime="09:30">9:30 in the morning</time>.</p>

Search engines, calendars and browser extensions can read the datetime value. The format is year-month-day (2026-11-14) and 24-hour time (09:30).

Practice#

<p><cite>Pride and Prejudice</cite> was first published in <time datetime="1813">1813</time>.</p>
<blockquote>
  <p>To be, or not to be, that is the question.</p>
</blockquote>
<p>From <cite>Hamlet</cite> by William Shakespeare.</p>

Key takeaway#