W3C home > Mailing lists > Public > w3c-wai-ig@w3.org > July to September 2001

RE: Alt tags

From: Charles F. Munat <chas@munat.com>
Date: Thu, 6 Sep 2001 02:50:57 -0700
To: "Sharon Dennison" <sharond@mel.hiser.com.au>, <w3c-wai-ig@w3.org>
Message-ID: <LHEGJAOEDCOFFBGFAPKBEEPECJAA.chas@munat.com>
OK, here goes:

1. There is no "alt tag." There is an alt attribute which can be used in a
variety of elements, but is mostly associated with the img element. It is
not a tag, despite being called one by many. To me, sloppy use of
terminology results in sloppy understanding (which then produces sloppy
code).

2. The alt attribute does not "appear on a navigation item." What appears is
a pop-up label, called a "Tool Tip" in Internet Explorer. The Tool Tip may
take the value of the alt attribute as its content, but it may also use the
title attribute. This is a browser-specific behavior and is not in the HTML
Recommendation.

3. The purpose of the alt attribute is to provide information to be used
when the image is not present or can't be seen. The value of the alt
attribute (the "alt text") is meant to substitute for the image. *The alt
attribute is NOT intended to provide a pop-up label.* Sometimes the pop-up
effect can improve usability, but this should be secondary to the intended
use of alt text as a substitute for the meaning of the image.

4. There is nothing (as far as I know) in HTML or CSS to permit control of
the Tool Tip box. There may be some Microsoft specific way to control it --
if so, I've never heard of it. Maybe someone else knows better.

5. The Tool Tip covering the next link down is not a problem: As soon as you
move the mouse, the Tool Tip disappears.

6. On http://www.aahc.com.au/ you have misused the alt attribute. The images
of a cow, sheep, etc. add no meaning or functionality to the page. If you
want to describe them, use the longdesc attribute to link to a description.
Frankly, they are so small that there isn't much to describe. But what you
don't want to do is to stick in "cow," "sheep," etc. in place of those
images. Of what use is this information? None. It only interferes with the
use of the page. All the animal images should have alt="" or alt=" ". Ditto
with the rotating image. And your logo's alt attribute should read "Animal
Health Australia" not "Animal Health Australia logo." It is meant to replace
the logo, not to tell us what it is. And why on Earth do your spacer images
all have alt = "Animal Health Australia"?

7. You have a *lot* of problems with the accessibility of this page, most of
them the result of trying to create a layout with pixel-by-pixel control.
HTML is not well-suited for this type of layout. Instead, you should try to
create pages which permit resizing by the user. As William Loughborough is
fond of saying, "author proposes, user disposes." Here are just a few of the
problems with the page:

    a. Font sizes are fixed. I can't adjust the font size to my preference
(and the sizes chosen are ridiculously small).

    b. Your pop-up descriptions of the main links work only on mouse over.
Users who are restricted to keyboard control will never see them.

    c. Your pop-up descriptions are in images instead of text, so users who
can't see images (or can't read the tiny font) will never see them either.

    d. Your pop-up descriptions are popped up using JavaScript, so users
without JavaScript or with JavaScript disabled will never see them.

    e. There is a problem with your JavaScript. In Netscape 3, the pop-up
text-in-image link descriptions juxtapose themselves (the previous image
does not disappear), making an unintelligible mess.

    f. If I'm using Netscape 3 (and probably others) and overriding all
colors to use my own, the result is white text on a white background. Not
good.

    g. Umm, have you looked at this page on WebTV? You might want to before
someone else does.

Here is what your page looks like in Lynx:

                                              Animal Health Australia -
Welcome

                        Animal Health Australia logo

                       About Animal Health Australia
                     Australia's Animal Health Status
                        Animal Disease Preparedness
                          Animal Health Programs
                           Communications Centre
                               Useful Links

      Animal Health Australia cow Animal Health Australia sheep Animal
                      Health Australia rotating images
                          Animal Health Australia
                [  Feedback  |  Site Map  |  Help  |  Legal  ]

                    Developed by eDIME Internet Agency

                             Search this Site:
                    _______________ Click to search site
                                    Help

     Animal Health Australia pig Animal Health Australia chicken Animal
                            Health Australia bee
                          Animal Health Australia
                                Hot Issues:

                         Mid Term Review of the NOJDP
                   Senate Committee report on OJD released
      Foot-and-mouth disease (FMD) outbreak in UK- information and links
          Bovine Spongiform Encephalopathy (BSE) - 'mad cow disease'
                           Information and Links
                               [getacrob.jpg]
               Semi - Finalist Australian Internet Awards 2000

Try reading this aloud to someone who isn't familiar with the page (you can
say "link to" before each link) and see what they think.

My recommendations:

1. Read the WCAG 1.0 from start to finish (including the techniques).

2. Convert to XHTML, strict if possible, and validate your page using the
W3C validator: http://validator.w3.org/

3. Use CSS for all your presentation (separate structure/content from
presentation). Use CSS to create your columns. Ditch the tables for layout.

4. Make sure your page degrades gracefully on older browsers (if you follow
the above recommendations, it probably will).

5. Design for flexibility. (Let the user choose font sizes, etc.)

6. Avoid JavaScript tricks (rotating images that can't be stopped, mouseover
tricks that require rasterized text (in images), pop-up descriptions, etc.).
Instead, reorganize your page to put the key information right where it is
needed without the user having to mouse over anything.

There are lots more things you can do, but the above will be a good start.

Hope this helps.

Oh, and regarding the lack of alt text in some images when displayed: The
problem is that you've restricted your widths and heights in the table cells
too much. When you compress your images in this way, IE does not display the
alt text. (BTW, the input element does not have a height or width
attribute.)

Bad code creates problems. Here you are trying to do something that HTML was
never intended to do (and you are trying to do it on browsers that don't
support this sort of layout). This requires you to break the code. When you
break the code, you generally break the page in numerous browsers. So the
price you pay for making it work in one or two browsers is having it not
work in many others. Usually you create serious accessibility problems as
well.

Ditch the proprietary tags, use valid XHTML, switch to CSS for presentation,
use the HTML properly, and you will get a page that works in every browser,
is accessible to everyone, and might just look attractive, too. You just
have to learn which types of presentation will work and which won't.

Good luck.

Charles F. Munat
Seattle, Washington


> -----Original Message-----
> From: w3c-wai-ig-request@w3.org [mailto:w3c-wai-ig-request@w3.org]On
> Behalf Of Sharon Dennison
> Sent: Wednesday, September 05, 2001 9:45 PM
> To: 'w3c-wai-ig@w3.org'
> Subject: Alt tags
>
>
> Hello
>
> I have some questions relating to the use of 'alt'  tags which I hope
> someone may be able to help with.  See http://www.immi.gov.au/
>
> The problem we have is that when an alt tag appears on a
> navigation item, it
> obscures part of the secondary navigation.  Tags also 'appear' to take a
> while to disappear.
> (EG: hover over : Visiting Australia nav item)
>
> With accessibility in mind:
>
> 1. Is there any way to choose where to place an alt tag in relation to the
> image it is describing or does it always appear just below 'the hand'?
>
> 2. Can you control the length of time an 'alt' tag appears onscreen?
>
> 3. Does anyone have any alternative suggestions to the 'alt' tag
> for the nav
> items (which at this point must remain as images).
>
> 4. There have been instances when surfing that 'alt' tags have
> appeared, yet
> when images are turned off some do not get labelled with their alternative
> text.  Does anyone know why this occurs?  See http://www.aahc.com.au/
>
> Thanks in advance
>
> Sharon Dennison
>
>
>
>
>
Received on Thursday, 6 September 2001 05:48:30 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Tuesday, 19 July 2011 18:13:56 GMT