Using the ABBR and ACRONYM tags is a great technique that is simple and works very well—with standards-compliant browsers, that is. Until IE complies to world web standards, coders must hack the functionality in. I despise hacking for IE and try to avoid it. But, we have to admit that around 85% of users are still on IE and we should try to go out of our way sometimes to gratify them. If this is you, please try a standards-compliant browser such as Firefox or Netscape.
The ABBR and ACRONYM tags give the user the full text for an abbreviation and acronym. For example, ID would have “identification” associated with it. Example:
ID
But this won’t work in IE due to its lack of standards-compliancy. The method I’ve used the for word “ID” above so that it works in IE also is as follows: (the CSS would be in a global stylesheet, of course):
ID
Is this the best method for now? Should we coders be using these methods at all?
6 replies on “Abbreviation and Acronym Issue”
I love ABBR and ACRONYM. I really think text/web-editors aren’t using these or promoting these features like they should. If, and when, content writers use these then many will get used to them and follow.
I feel the same about the DT & DD tag sets. Google may soon have a term-lookup search option and the ABBR, ACRONYM, DT/DD tags will become mega important then, I feel.
Yea, the DT and DD (data term and definition) tags are cool. I’ve used them on a couple XHTML sites, and is a good technique for future-proofing your sites.
Joe Clark has an interesting discussion about abbreviations and acronyms on his web site.
– In the first instance of a particular abbrevation or acronym on a page, use the title attribute to expand it. Subsequent instances do not need the title attribute.
– Exception to these rules include units of measurement, which should be handled automatically by screen reader software. So, MB and KB don’t need to be encased by … tags.
– Since screen readers sometimes spell out capitalised words, regardless of whether they are abbreviations or not, use normal case in the markup and apply a style to convert the text to upper case. For example, Microsoft and the stylesheet would contain the following class definition: .allcaps { text-transform: uppercase; }
Great article, thanks Simon. The issue I’m focusing on is the fact that IE does not display Abbreviation or Acronym text any differently than regular text. So you have to add CSS to the tags to visually indicate they’re present, while good browsers already do this.
This is good CSS to add for screenreaders, etc.:
abbr {speak:spell-out;}
acronym {speak:normal;}
FYI: The Acronym tag has been deprecated in XHTML 2.0! See this excellent article on A List Apart: http://www.alistapart.com/articles/hattrick