This rather simple HTML technique produces a floated
discretionary image link, in addition to an in-line text link within running text.
The technique works by including, within the scope of a single
anchor link (
A) element, not only the desired link
text, but also an
IMG specifying an
RIGHT as the case
The benefits, relative to having separate links to the same
destination from the image, and from the in-line text, are several.
Let me stress the point that this technique is for
an image whose specific purpose is to offer an alternative
link to a resource which is anyway linked from the running text.
The image is meant to be visually intuitive to those who are
browsing in graphical mode, but would represent a pointless
distraction to a text-only reader.
For regular text-mode readers, the image can be made to disappear
entirely, by using ALT="". Since the image is not standing alone
A element, and its disappearance is not
depriving a text-mode reader of any content-based functionality,
the construction passes
both the letter and the spirit of accessibility checks, indeed it
is functionally equivalent to the second example in the WAI techniques section 6.1.1.
As of Sept 2002, this page failed the test at the "Bobby"
accessibility checker, on the basis of having empty
text within a link.
Bobby threw the same error report, in fact, when it was offered the
cited example of good practice from the W3C WAI's techniques document!
After a couple of attempts to call this to the attention
of the Bobby folks, and related
discussion on their web forum, they accepted that it was a problem and
said that they intended to fix it.
As far as HTML is concerned, the construct is only a single link,
not two; those client agents which produce a menu of links on the page
will only list the item once, not twice.
By contrast, the provision of adjacent
but separate links to the same URL would not only count as two links,
but would also (justifiably) provoke
Bobby into complaining about two links separated by nothing more than
white space (currently rated as a priority-3 fault).
The technique falls-back with reasonable grace in the event
of a client agent not honouring the
ALT="" has been used in order to make the
image disappear for regular
text-mode readers, some text-mode browsers offer the reader the option
to insist on having links for images (e.g the "*" keycommand in Lynx).
The author may (and "should", if appropriate to the content) additionally
LONGDESC attributes for
those who can use them.
Support for these in mainstream browser/versions is far from ideal, but
that shouldn't deter us from playing our part in the "WWW concordat":
I'm assured that there are assistive-technology implementations that can
make good use of them.
The technique uses only HTML, but doesn't seem to impact adversely on page styling being done in CSS.
The small picture shows a green Academic cap, a so-called "mortarboard".
Original materials © Copyright 1994 - 2006 by A.J.Flavell