Webmaster Forum / HTML, CSS, Scripts / CSS / January 2005

This isn't about CSS but HTML. F'ups set accordingly.

Both <abbr> and <acronym> are rather useless, for several reasons, see
http://www.cs.tut.fi/~jkorpela/html/abbr.html

Search engines probably don't use content of title attributes much (not to
be confused with <title> elements, which are very important). There's no
reason why they couldn't or shouldn't, but they probably don't. And, after
all, those attributes aren't part of the normal textual content, which is
what really matters to search engines.

The simple way to make the expansion of an attribute accessible to search
engines, and to human beings, is to explain them in normal text. For
example,
... foo, abbreviated "f", ...
or
... foo (f) ...

ObCSS: If you use <abbr> or <acronym>, it's best to include at least

@media print { abbr, acronym { border: none; } }

to remove the default bottom border that many browsers draw (and that might
be useful on screen, but hardly on paper), and

abbr, acronym   { font-variant: inherit; letter-spacing: inherit; }

as a cheap insurance against future browsers that might apply the clueless
"sample style sheet for HTML" contained in the CSS 2.0 specification
(and preserved even in the CSS 2.1 draft, now named as "default style
sheet!").

If the text is important enough to the page subject that you think
users will be searching for it then maybe the text should be in the
plain content? After all not all browsers support <abbr> (IE doesn't)
and not all browsers support title (and remember that it is intended
for supplementary information rather than essential page content).

A possible solution would be to do something like this
<abbr title="foo">f<span> (foo)</span></abbr>
with the CSS
abbr span {display:none;}

The redundency of the two 'foo's is a bit annoying and it's possible
to use JavaScript to dynamically convert
<abbr>f<span> (foo)</span></abbr> to <abbr title="foo">f</abbr> on
page load.

    Steve