abbr-design-pattern

Abbr design pattern

Purpose

• Use the abbr-design-pattern to make text that is human readable also formally machine readable
• Avoiding using the abbr-design-pattern to re-encode human text or to hide data

How to use it

• enclose the human-friendly text that you want to make machine readable with <abbr>
• as per the class-design-pattern, add the appropriate class attribute to the abbr element
• add a title attribute to the abbr element with the machine readable data as the value

Example

The datetime-design-pattern formally encodes (the notoriously unparsable) datetimes into an abbr element.

Before:

The party is at 10 o'clock on the 10th.

After:

The party is at 
<abbr class="dtstart" title="20051010T10:10:10-0100">10 o'clock on the 10th</abbr>.

Discussion

This discussion is culled from here. Consider two possible uses for the abbr-design-pattern:

1. using ABBR to encode machine readable data around human readable data

   <abbr class="dtstart" title="20051010T10:10:10-0100">10 o'clock on the 10th</abbr>
   

2. using ABBR to encode more formal human data around something less formal

   <abbr class="author" title="Danny Ayers">Danny</abbr> 
   

Use #1 is encouraged if there's a reasonable need for it. Use #2 is discouraged under the Don't Repeat Yourself principle, as: "#2 is a case of *more* information being invisibly present, namely, the last name in this case. If someone is not willing to make some information visible, then we shouldn't be encouraging them to store that information invisibly, for all the same reasons that invisible metadata is bad/futile in the first place."

I'd like to delete this below, as the points are covered above

• Theoretically, this could be done with almost any HTML element. But is it a good idea? If it's not, is abbr the only one? DavidJanes
• abbr-design-pattern should be avoided, if possible. RobertBachmann
  • why, or under what circumstances? For example, it is quite useful with datetimes. Should there not be other potentially analogous situations? DavidJanes
  • Under circumstances where the text in the title would be gobbledegook if read by a screenreader. JAWS and other screenreaders use abbr, when used properly (as in this example from the WCAG group) to pronounce words which would otherwise be unreadable or confusing. Using Datetime as a title might technically be a correct semantic use of abbr, but until screen readers can turn DATETIME's into something comprehensible, this will lead to poor accessibility.

<p>Sugar is commonly sold in 5 <abbr title="pound">lb.<abbr> bags.</p>
<p>Welcome to the <abbr title="World Wide Web">WWW</abbr>!</p>

See Also

• All microformat design patterns
• discussion in microformats-discuss
• datetime-design-pattern uses abbr-design-pattern
• HTML 4.01 definition