Abbreviations are really useful especially if you need to write with strict character counts or tight space constraints. Abbreviations and acronyms are used all the time in many technical documents. For example, HTML is an abbreviation that stands for HyperText Markup Language.
However, if you use too many acronyms or abbreviations and don't define them for your readers, you'll have trouble with people misunderstanding or misinterpreting your words. Luckily, there are two XHTML elements that you can use to clarify your meaning on your Web pages when you use abbreviations or acronyms.(1)
<abbr></abbr>
The <abbr> tag is used to define abbreviations. An abbreviation is any shortening of a word or phrase, either by using the first few letters or, in the case of a phrase, the first letter of each word. Some examples of abbreviations are:
- CA = California
- HTML = HyperText Markup Language
With the <abbr> tag you can include a definition of your abbreviation right on the page itself. Most modern browsers(2) then display that word with some type of indication to show that it's got a definition associated with it or by displaying a tool tip when the mouse hovers over the word.. You include your definition in the title attribute of the <abbr> tag:
<abbr title="California">CA</abbr>
<abbr title="HyperText Markup Language">HTML</abbr><acronym></acronym>
The <acronym> tag acts in a very similar way to the <abbr> tag, but rather than defining abbreviations, it defines acronyms. An acronym is a word that is made by using the first letters of a phrase or by combining initial letters or parts of words to get a new word. Some examples of acronyms are:
- NASA = National Aeronautics and Space Administration
- radar = radio detecting and ranging
Many people mistake acronyms as being just shortenings of phrases by taking their first letters, but unless it forms a new word by doing that, it is just an abbreviation.
With the <acronym> tag you can include a definition of your acronym right on the page itself. Modern browsers support the <acronym> tag by either displaying the acronym with some indication that there is a definition associated with it or by displaying a tool tip when the mouse hovers over the word. You include your definition in the title attribute of the <acronym> tag:
<acronym title="National Aeronautics and Space Administration">NASA</acronym>
<acronym title="radio detecting and ranging">radar</acronym>Notes
- I don't use the <abbr> and <acronym> tags on this page because the About content management system does not allow the use of those tags.
- Internet Explorer 6 still does not support the <abbr> tag. Many developers use the <acronym> tag for all abbreviations and acronyms to reap the accessibility benefits and still get support from IE, but this is technically incorrect.
