If you’ve read the HTML 4 specification recently trying to understand the difference between the abbr and acronym elements you may have come away feeling a little confused, I know I did. This article contains an explanation of the difference between the two tags, and when it is appropriate to use one or the other. The first element of business then is to explain what each of the words means, to do this I’ve enlisted the help of my trusty dictionary.

A shortened form of a word or phrase used chiefly in writing to represent the complete form; for example, U.K. for United Kingdom. Compare contraction.
A word formed from the initial parts of a name, such as NATO, from North Atlantic Treaty Organisation, or Commintern, from Communist International.

From the above definitions it is clear that an acronym is a particular class of abbreviation, abbreviation is the more general of the two. The HTML spec however is quite inconsistent in its use of examples for these two elements.

The HTML 4.01 Specification (Section 9.2.1) states:

The ABBR and ACRONYM elements allow authors to clearly indicate occurrences of abbreviations and acronyms. Western languages make extensive use of acronyms such as “GmbH”, “NATO”, and “F.B.I.”, as well as abbreviations like “M.”, “Inc.”, “et al.”, “etc.”

As can be seen the inconsistency between the W3’s definition of an Acronym and the dictionary definition may be difficult to determine from the above text. To illuminate the matter a little more I’ll introduce another definition.

An abbreviation of a phrase consisting of the initial letter of each word in the phrase; distinguishable from an acronym in that it is not pronounced as a single word; for example B.B.C., C.I.A.

This now illuminates the inconsistency (between the spec’s definition and the definition used in the English language) in the W3 specification. The specification gives examples of using the acronym tag with initialisms such as F.B.I. when the dictionary definition of an initialism clearly distinguishes it from an acronym.

Some Examples of Using <ABBR> and <ACRONYM>

The Acronym Element

<acronym title="Communist International">Commintern</acronym>
<acronym title="North Atlantic Treaty Organisation">NATO</acronym>

The Abbreviation Element, (with a few classes)

<abbr title="Cascading Style Sheets">CSS</abbr>
<abbr title="Hyper Text Mark-up Language">HTML</abbr>
<abbr title="Europe">Eur</abbr>

The classes are added to support styling of the elements using style sheets, they do not add any semantics in the same way, I have used meaningful names as they are useful from the authoring point of view.

Aural styling of these elements using CSS

acronym {speak : normal;}
abbr.initialism {speak : spell-out;}
abbr.truncation {speak : normal;}


Archive of the Usenet Thread that prompted this article

Archives of other discussions on this subject

Useful articles and weblog entries on this subject