WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: usage of abbreviation tag

for

From: Jukka K. Korpela
Date: Sep 18, 2013 12:46AM

2013-09-17 11:01, Joe Chidzik wrote:

> Note also that the abbr element is inaccessible for keyboard users.

It depends. If you mean access to the value of the title attribute, then
it can be arranged (e.g., by setting tabindex on the element and using
abbr:focus:after). But it gets ugly, and the implementation of title
attributes as "tooltips" in graphic browsers is just awful - a horror
example really (tiny font, not controllable by the user or by the
author, and the tooltip disappearing after some seconds).

> I generally advise that when an acronymabbreviation is used for the
> first time on a page, it is expanded in full e.g. BBC (British
> Broadcasting Corporation). This approach is accessible to
> screenreader users, and also gives keyboard users access to the
> expansion.

That's a good general principle, and the only really accessible way -
though the question still arises how to handle that problem that many
people keep forgetting things. They read an explanation, but they have
forgotten when they see the abbreviation used a few pages later. And
there's also the problem of non-linear reading: people can jump into any
point in the text. You can use links to deal with this, but caution is
needed. There is such a thing as over-linking. Too many links confuse
people, especially since there is often no quick way of seeing or
hearing what the link is really about.

Specifically, I would rarely spell out an abbreviation like "BBC". It is
probably better known than its expansion. And if the text is not in
English, then it is probably better to explain, in the language of the
text, what BBC is, rather than show the English expansion.

> Another, accessible, alternative, is using a pure CSS tooltip which
> uses the :focus pseudoclass in addition to :hover so that it is
> accessible to keyboard and mouse users, as well as screenreader
> users.

Yes, that makes much more sense than browsers' "tooltips". But then you
have the problem where to put the CSS tooltip text. It's not
straightforward, and it opens an accessibility problem rather than
solves one. What I mean is that CSS tooltips can be nice, but they are
an approach to presenting information in an interactive way, and then
you need to worry about making that accessible.

Yucca