cre8ive hut: January 2006

According to W3C Standards ALT is the text that is to replace the image if for whatever reason the image doesn’t load.

Before reading my solution, you may want to review the flamewar discussion that's going on for some time.

Do not mix tooltip with alt. Tooltips are placed on the title attribute; not alt attribute. ALT as its name implies is just for giving alternative textual content when the object (image for this case) cannot be displayed.

An example correct usage:

[img src="tv.gif" alt="Wide-screen television." title="On Sale Now!">

An example incorrect usage:

[img src="tv.gif" alt="On Sale Now!">

If you haven't done already, you may want to look at how W3C clearly and strictly identifies how to use the ALT attribute, and how the ALT attribute should be rendered by the user agents.

. . .

However IE, like most of the time it does, disregards standard recommendations and plays the game as it likes. It displays the alt attribute as a tooltip.

The tooltip text is supposed to be the value of the TITLE attribute.
So Internet Explorer's interpretation of using ALT text as a tooltip violates standards and is not a good practice in terms of accessibility. That's why firefox does not support displaying ALT as a tooltip as well.

. . .

So here follows my solution for getting rid of that incorrectly rendered tooltips once and for good. The solution will sniff only Internet Explorer, nothing will happen to other browsers (Opera, Netscape, Firefox, Safari) which implement the issue correctly:

function clearAltText(){
/*I don't want microsux internet exploder to display alt text as a tooltip*/
if(document.all){
var arImg=document.getElementsByTagName("img");
var len=arImg.length;
for(var i=0; i<len; i++)
arImg[i].alt="";
}
}

That's it. After including this simple function in your lovely library file the only thing you need to do is to call it on window load.

window.onload=function(){
... your logic here ...
clearAltText();
};

and kiss goodbye to the misinterpreted tooltip.

There are some caveats though as Christian says on theList:

Well, it deletes all alternative text, and that is a bad thing... If a
crappy browser displays a non-visual attribute we shouldn't turn off
because of that reason. Visitors without Images but JavaScript turned
on will not get any alternatives

Or as Liorean has mentioned

Several screen readers and other alternate rendering engines are based
on iew, so it would be bad for accessibility in those.

It would also be bad for accessibility in normal iew if people have uncommon
configurations such as disabled images but not disabled active
content, or if they are on a slow connection that often times out for
larger files or that drops a lot of packages.

There something related that I might utilize demonstrated on Quirksmode.

The Final Solution

As many others have suggested, creating a scripting-based solution to the issue brings even more troubles in terms of accessibility.

So you want to remove the tooltip? Use occam's razor and find the simplest solution to it. Which is just infront of your eye but you haven't seen already.

[img src="tv.gif" alt="Wide-screen television." title="">

Yes, just adding an empty title would suffice. Since title always takes precedence in IE, it will not display a tooltip at all. And if you do want a tooltip, simply add a title, it will always override alt

That's all for now.

Cheers;