How to Mark Up a Citation in HTML

In school, we all learn to write footnotes and bibliographies. On your web pages you should also cite your sources. HTML provides specific markup for doing so.

Long Quotes

For long quotes...

1. Wrap the quote in <blockquote> tags.
2. Use the cite attribute to point to the source of the quote.

Example

<blockquote cite="https://www.goodreads.com/quotes/6396-the-paradoxical-commandments-people-are-illogical-unreasonable-and-self-centered-love">
  <p>People are illogical, unreasonable, and self-centered.</p>
  <p>Love them anyway.<p>
  <p>If you do good, people will accuse you of selfish ulterior motives.</p>
  <p>Do good anyway.</p>
  <p>If you are successful, you will win false friends and true enemies.</p>
  <p>Succeed anyway.</p>
</blockquote>

Short Quotes

For short quotes...

1. Wrap the quote in <q> tags.
2. Use the cite attribute to point to the source of the quote.

Example

<p>
  <q cite="https://www.goodreads.com/quotes/48-three-things-in-human-life-are-important-the-first-is">Three
  things in human life are important: the first is to be kind; the second is to be kind; and the third is to be
  kind.</q> - Henry James
</p>