References

Beginner-friendly references for web development, with live, editable examples.

The HTML <abbr> tag

Element All modern browsers Updated
Quick answer

The HTML <abbr> element marks up an abbreviation or acronym. Add the global title attribute to provide the full expansion, which browsers show as a tooltip.

Overview

The <abbr> element marks up an abbreviation or acronym — like HTML or WHO. Give it a title attribute containing the full expansion, and most browsers show that as a hover tooltip; some assistive technologies can announce it as well.

There is an important accessibility limitation, though: tooltips are not available to keyboard or touch users, who cannot hover. So the title alone is not a reliable way to convey the expansion.

The robust pattern is to spell out an abbreviation in full the first time it appears, with the <abbr> reinforcing it — for example "HyperText Markup Language (<abbr>HTML</abbr>)" — so every reader gets the meaning regardless of input device.

Syntax

<abbr title="Cascading Style Sheets">CSS</abbr>

Example

Live example 
<p><abbr title="HyperText Markup Language">HTML</abbr> structures the web.</p>

Best practices

  • Give every <abbr> a title with the full expansion.
  • Spell the term out in full on first use, since tooltips are not available to keyboard or touch users.
  • Use it consistently for the same abbreviation throughout the page.
  • Do not rely on the title tooltip as the only way the expansion is conveyed.

Frequently asked questions

What is the abbr element for?
To mark up an abbreviation or acronym, optionally giving its full form in the title attribute.
How do I show the full form of an abbreviation?
Add a title attribute with the expansion; browsers show it as a tooltip on hover. Also spell it out in full on first use for non-hover users.
Is the title tooltip accessible?
Not fully. Tooltips are not reachable by keyboard or touch, so do not rely on title alone — expand the term in the text on first use.
Should I use abbr for acronyms too?
Yes. HTML5 merged the old <acronym> into <abbr>, so use <abbr> for both abbreviations and acronyms.
a address