ideas for alternative text

As a commercial designer, I want to be able to provide high-end graphics for
viewers with graphically enhanced browsers.  At the same time, I like the
idea of providing content in the code that allows visually impaired visitors
to use the site and get a full understanding of the content through extra
textual explanation.

The following are two suggestions I have for improving the integration of
such practices into modern graphically enhanced layouts.

The problem with the current ALT attribute for graphics is that it shows up
as an onmouseover effect in many graphic browsers, and can cover or distract
from the usability of graphic navigation on the page.

If I want to give a fully-functional explanation of the graphic that will be
legitimately useful to a visitor who does not see the graphic(s), the
explanation itself ends up being condescending or redundant to graphic users
because this distracting provision of alt tag information cannot be
separated from the graphic browser versions due to the onmouseover display
of alt information on top of the graphic.

It would be great to have an image attribute that is specifically designed
to provide an explanation of the graphic to disabled visitors without having
the attribute adhere to traditional duties of the alt tag as a placeholder
while images load.

How about ... img src="pic.png" DISCRIPTION="image of a woman sitting at a
computer with mainframe servers in the background" ...

It seems like a logical way to separate the two current functions of the alt
tag, while still providing the traditional ALT tag use for images that need
it, such as images targeting audiences of slow speed connections or images
that purposely use the alt pop-up in graphic browsers to provide information
in the onmouseover effect.

It's important to note that the viewer of the graphic browser who has images
turned off or who is waiting for the images to load is a different audience
from the user who is read the contents of the page through a screen reader.
Much of the bad reception by designers to additional usability cues for
images hinges on this alt tag onmouseover display.  Many of us agree that
the implementation of a "screenreader only" tag would likely result in more
widespread use by commercial designers and would help us design more
sensible screenread pages.

The second suggestion stems from the need for additional content within text
and text links.  Once again, a sighted user with a graphic browser can have
and will expect to have a visual page that is optimized for all the other
additional cues in a graphic layout.  Even the phrasing of text links in a
menu may differ depending on if the structural layout of the page can be
viewed and is familiar.  Pages read in a linear fashion lose this insight
and so must be made up for in more textually descriptive link names and text
information.  Ignoring these differing properties of content display ignores
one audience or the other, and in a commercial project, designers are not
allowed to ignore the most widespread display mechanisms in use -graphic
browsers.

I'm not sure -and I'd like to know- what the convention is for commenting.
I'm guessing commented information in an html page does not show up in
screen readers, and I'm not suggesting it should.  However, it would be
incredibly useful to have a comment-like tag that is only picked up and read
by the screenreader, but remains hidden in the source code away from the
graphic browser.

The easiest way I can think of to implement this is to create a tag that a
screenreader will recognize within commented out html portions and then
display that tag content as non-commented material.

How about

<!-- <SCREENREAD> The product is a cylinder with bored holes on the sides
for an industrial feel.  It has curves that give a better grip than our
competitor's flat circular disk shape. </SCREENREAD> -->

While this information could be put in the normal page text, in an effective
commercial site there would likely already have been an image giving this
description visually and so the information would have been redundant to a
sighted user.  The image may also have been placed somewhere in the layout
that made visual sense to a sighted visitor, but the description is more
coherent in the text somewhere else on the page for the screen-read visitor.

In text links, something like this would be useful:

<a href="link.php" SCREENNAME="Apply to receive brochure">Apply Now!</A>

Once again, the graphic positioning on the page would have provided enough
additional navigation cues to the sighted visitor to allow for the "apply
now" to be self evident as tied to the brochure offered.  When screenread it
may not be, and such a tag would help make the connection much more assured
for a screen-read visitor.

I hope these suggestions provide useful topics in the attempt to create
usable layouts for screen-read as well as sighted visitors.

-Melody Chamlee

Received on Tuesday, 20 August 2002 07:31:30 UTC