HTML Quotations

HTML provides specific elements to mark quoted content.
Using the correct quotation tags gives clear meaning to quoted text and improves accessibility.

Block Quotations

Use <blockquote> for long quotations taken from another source.

<blockquote 
  cite="https://example.com/source"
  title="Famous quote">
  The best way to learn HTML is by practicing it regularly.
</blockquote>

Attributes Used

  • cite → source URL of the quotation
  • title → tooltip text

Short Quotations

Use <q> for short inline quotations.

<p>
  Learning HTML is <q cite="https://example.com">easy and practical</q>.
</p>

Attribute Used

  • cite → quotation source

Browsers automatically add quotation marks.

Abbreviations

Use <abbr> to define abbreviations or acronyms.

<p>
  <abbr title="HyperText Markup Language">HTML</abbr> 
  is the standard markup language for the web.
</p>

Attribute Used

  • title → full form of the abbreviation

Contact Information

Use <address> for author or contact details.

<address>
  Written by John Doe<br>
  Email: contact@example.com
</address>

Citation Text

Use <cite> to reference creative works.

<p>
  <cite>HTML Reference Guide</cite> is a helpful resource.
</p>

Important Notes

  • Use quotation tags for meaning, not styling
  • <blockquote> is a block-level element
  • <q> is an inline element
  • Proper quotation tags improve SEO and accessibility

Focus Keyword