Tuesday, September 14, 2010

Acronyms and abbreviations

Two logical styles assist with accessibility, enabling you to provide users with full forms of
abbreviations and acronyms by way of the title attribute:
<abbr title="Cascading Style Sheets">CSS</abbr>
<acronym title="North Atlantic Treaty Organization">NATO</acronym>
This has two uses. For one, it allows users with disabilities (using screen readers) to access
the full form of the words in question. But anyone using a visual web browser can access
the information, too, because title attribute contents are usually displayed as a tooltip
when you hover your mouse over elements they’re used on.
To further draw attention to an abbreviation or acronym, style the tag in
CSS (using a tag selector), thereby making all such tags consistent across
an entire website. The following code is an example of this, the results of
which are shown in the example to the right (including the tooltip triggered
by hovering over the abbr element, which has a title attribute).
abbr {
border-bottom: 1px dotted #000000;
background-color: yellow;
}

No comments:

Post a Comment