`Abbr HTML Tag: Here's When To Use It With Abbreviations`

In HTML Tags

Disclosure: Your support helps keep the site running! We earn a referral fee for some of the services we recommend on this page. Learn more

Element of: What On Earth Is Semantic Markup? (And Why Should You Learn To Write It)
What does Abbr HTML Tag: Here's When To Use It With Abbreviations do?: The <abbr> element is used along with a title attribute to associate a full-text explanation with an abbreviation or acronym. Website visitors do not see the text in the title attribute, but browsers, search engines, and assistive technologies do use this information.
Display: inline
Usage: semantic | textual

Contents

1 Code Example
2 Abbreviations and Acronyms
- 2.1 Deprecated <acronym> tag
- 2.2 The <dfn> element
3 Browser Support for abbr
4 Attributes of abbr

Code Example

This website is all about <abbr title="HyperText Markup Language">HTML</abbr>.

This website is all about HTML.

Abbreviations and Acronyms

Ideally, the <abbr> tag should be used any time that you have an abbreviation or an acronym. At the very least, it should be used the first time you introduce an uncommon or non-obvious acronyms or abbreviations.

Whenever the <abbr> tag is used, you should always use the title attribute, which indicates the meaning of the abbreviation or acronym.

Deprecated `<acronym>` tag

Older HTML specifications included a separate <acronym> element. This has now been deprecated in HTML5, and acronyms should be marked up with the <abbr> element instead.

The `<dfn>` element

If you are using an unfamiliar or unusual abbreviation, you may want to consider also including a <dfn> element so provide additional information about the word or phrase.