Anne van Kesteren

ALT attribute (ALT tag, ALT tooltip)

And while the rest of the world posts about the (brilliant) Firefox ad campaign I'm going to discuss the ALT attribute. The ALT attribute is also (incorrectly) known as "ALT tag", "ALT tooltip" and perhaps, even as "ALT element" which isn't much worse. In the Mozilla bug database there is a bug about this issue with about 500 comments of people claiming that this bug stops serious adoption of Firefox. Of course, as Ian suggests, they could build their own derivative product, implement it and try to get 500 million downloads in a month, which obviously isn't going to work and they damn well know it.

I find it very weird that people can be so braindead and claim that because of the lack of this, their whole company switched back to Internet Explorer. (There is an extension for Firefox that emulates the behavior of your favorite browsers, by the way.) The bug has given a lot of very good arguments why Mozilla, just like Safari, Opera and the IE for the Mac didn't implement it. The ALT attribute is for alternate content, not for additional information about some graphic.

In the Mozilla web author FAQ you can read why Mozilla doesn't display the ALT attribute as tooltip. In guidelines on alt texts in img elements Jukka Korpela explains how you should use it. Mark Pilgrim has written about it with regard to accessibility.

Tell me, what is so frigging hard about it?

Of course, the IMG element (and its ALT attribute) are bad design, from a markup point of view. That doesn't mean, however, that ALT should be displayed as a tooltip. Now go read the above mentioned links and spread the word.

Comments

  1. I find this bizarre. I was reading the very same thread last week. Poor Ian is all I can say. I think they should leave a small thermo-nuclear device under the sheets for this one. Nuke them before they get a chance to reactivate the bug.

    I was going to blog it myself. You might have prompted me to do just that.

    Posted by Paul Connolley at

  2. Yeah I don't get it either. I've been complaining about the "alt tooltip" crap for about 5 years. Why is it so hard for people to use title instead of alt when what they want to do is add some extra info?

    Anyway, I did what I can to spread the word ;)

    Posted by Roger Johansson at

  3. I'm surprised at the rancor of that Bugzilla discussion.

    I'm also surprised your entry omits mention of the title tag. Instead of an "ALT Tooltips Considered Harmful" attitude, perhaps it's better to evangelize for title. You can use it almost anywhere; it's not just for images!

    The title tag: it's not just a good idea. It's the spec.

    Posted by Mike Mariano at

  4. I implicitly mentioned the TITLE attribute when I mentioned providing additional information about the graphic. Besides, the referred links will give you enough information.

    I could have noticed TITLE is an attribute as well (in this context), not a tag, but it is not really relevant for the post.

    Posted by Anne at

  5. Here's me thinking that everybody knew this already! Old school methods are harder to eradicate than rats!

    This is why I go with Mike's point. Personally I find it easier to be a proponent of webstandards than to be an opponent of 'bad habits'.

    Posted by Egor Kloos at

  6. Damn right, I say.

    Posted by Turnip at

  7. "Why is it so hard for people to use title instead of alt when what they want to do is add some extra info?"

    I think part of the problem is that Netscape 4 doesn't recognize the TITLE attribute and so those designers out there still supporting it use the ALT attribute as a substitute. I'm not defending the practice, by the way.

    In terms of whether or not to display the contents of the ALT attribute, I don't think the specs actually say how a UserAgent is supposed to behave...or at least doesn't forbid display in some way. Why can't alternate content be presented to the user in some way, as long as the TITLE attribute trumps it when present?

    Posted by MikeyC at

  8. I very much doubt there are more than 10 web site creators out there still supporting Netscape 4 at this day and age. No, and I don’t mean that literally. Also, why would web authors choose to support such a miniscule minority browser, while not supporting the newer browsers which form much larger minorities.

    Note that in 99% of the cases, the alt attribute doesn’t provide any content of added value anyways. Who gives a F if the tooltip doesn’t appear, as if you would have noticed if it did. A tooltip is obscure enough by itself. Every time I look at that bug I am amazed by how many people seem to still find it an issue. They must be clueless, or something. I’m not impressed.

    ~Grauw

    Posted by Laurens Holst at

  9. "I very much doubt there are more than 10 web site creators out there still supporting Netscape 4 at this day and age."

    I'm sorry but you've got your head buried in the sand.

    "Also, why would web authors choose to support such a miniscule minority browser, while not supporting the newer browsers which form much larger minorities."

    Because often times it is not up to the web author to decide what to support. Those decisions are handed down from above.

    Posted by MikeyC at

  10. This is maybe even more braindead than the .mobi TLD. The ALT attribute is to be used for alternate content, not tooltip texts. What you could use for tooltip text, however, is the TITLE attribute, as other people have mentioned.

    Wanting to have it any other way is so utterly braindead that it's difficult to understand how the people wanting this can get out of bed in the morning. God help us all.

    Posted by Asbjørn Ulsberg at

  11. "The ALT attribute is to be used for alternate content, not tooltip texts."

    Incorrect usage of the ALT attribute by web designers is a separate issue from how a UserAgent chooses to expose hypertext data to the user.

    There is nothing wrong with a UserAgent exposing the content of the ALT attribute to the user in some way whether it be via tooltip or other means. The W3 specs do not disallow it. Similarly, if my UserAgent displays the width and height of an image on mouseover or even the filesize as a tooltip, that's fine.

    The reason why everyone is in such a huff about this whole issue is that some web designers tend to abuse the ALT attribute because it is exposed by some UserAgents as a tooltip. Well guess what, that's not the UserAgent's fault.

    Posted by MikeyC at

  12. I think the main problem here is very abviously: ignorance.

    It's just ignorance to complain about an attribute that works like it should (ALT) and not even knowing that the answer is just another attribute (TITLE) which is actually more logical to use.

    Posted by Mark van Eijk at

  13. The amazing part of this whole issue is that there seems to exist people who design their web sites in such a way that they rely on something that needs to pop up in a tooltip. Millions of them, if you're to believe the propaganda.

    What about browsers that can't display tooltips at all, whether they're ALT attributes or TITLE attributes?

    This silly use of ALT attributes is very detrimental to web accessibility. Stuff that you'd like to show in a tooltip is very, very rarely something that would be useful as a text alternative.

    Posted by Tommy at

  14. Sorry if this message ends up quite off topic but sending automatic emails is often a webdevelopers job so I hope you won't delete this comment.

    The problem of separating alternate content from additional content is not new by any means. ALT tooltips don't work in modern browsers for quite a long time, less and less people complain, one day the problem will disappear completely.

    What is more irritating is not the behaviour of IEvil that displays tooltips for ALT, it's the little known bug of Outlook Express that causes it to display multipart/alternative contents as attachments. The standard says that the mail client is supposed to choose one of the alternatives, probably based on the user preferences, and display it to the reader. As a long time usenet user I prefer text messages over HTML so it's natural that I chose text as my preference. You can guess how many email up to date I was unable to read because all that I was presented with was the text/plain alternative that said something like:

    This message is formatted in HTML, click the attachment to view it.

    Posted by Patrys at

  15. Of course, the IMG element (and its ALT attribute) are bad design, from a markup point of view.

    The img element isn't bad when it's used semantically. For example, when I say "Here is a screenshot:" then I should have an image below it in the markup.

    However, as for the alt attribute, it just clearly illustrates how IE has affected the state of semantic markup on the web. That's why we should drop support for it and switch to something better urgently.

    But ok, I'm just repeating myself now...

    Posted by Charl van Niekerk at

  16. Charl, ever heard about the OBJECT element. The theoretically superior element, which sucks in the real world?

    Posted by Anne at

  17. The img element isn't bad when it's used semantically. For example, when I say Here is a screenshot: then I should have an image below it in the markup.

    It is bad. There should be no separate image container, most inline elements should support media (not only image) replacement (for example via their src attribute). Then everything would fall back to text alternatives nicely, no matter if your browser supports that particular media type or not.

    Posted by Patrys at

  18. I'd like to see the alternate content at the same time as the image!

    Okay, nuke me ;-). It's a silly discussion, and I suppose it's why these people won't have their broken windscreen replaced because the new one doesn't have the right sticker!

    Posted by Mark Wubben at

  19. The reason why everyone is in such a huff about this whole issue is that some web designers tend to abuse the ALT attribute because it is exposed by some UserAgents as a tooltip. Well guess what, that's not the UserAgent's fault.

    Of course it's the User Agent's fault. Yes it can show the ALT attribute any way it want, but if it shows it off in a stupid way, how can you argue the browser isn't stupid? I can agree that not everything can be blamed on the browser, because braindead developers too have to take a large part of the blame too.

    It's not correct to blame everything on IE, but it's not correct to blame everything on the developers either. They're both just as stupid and should be given a really good spanking.

    Posted by Asbjørn Ulsberg at

  20. In addition I have even seen many Web Development Articles saying how the alt attribute is good for accessibility on images because you get a nice little 'tool tip' appearing in addition to the "rendered image" - I despair.

    Posted by Robert Wellock at

  21. Ok, ok, ok, sorry I read that the wrong way. Yes, img is very bad in comparison to the object element! (And yes, I have heard of it, and use it, and I should probably use it more.)

    Posted by Charl van Niekerk at

  22. I for one do like some of the in IE unsupported CSS2 selectors to display the alt-text behind images. I think IE's ability to display it isn't bad either, but there are enough situations where only the alt-attribute would be sufficient, but one has to add a title element with the same content for it to display on Opera and Firefox.

    If one takes an ICQ/MSN icon and adds alternative text to it, you save space visually, it's clear what it is about immediatly (I won't recognise something like 123456789 as an ICQ number) and it's fine on non-image viewing devices. Still, either the whole purpose of the image on itself could be undone using CSS in Opera and Firefox (however it could as well have been left out then), or a redundant title has to be added to acquire the same effect.

    Besides I'm not sure if the object tag is the ideal solution for images (to me text/image is a completely different combination than any other kind of thing which can be embedded) and I think it's stupid that alt should always be defined and isn't just nothing when undefined...

    Yeah, go kill me.

    P.S. Maybe object would be the better solution but I think it most definitely isn't the way it's all implemented and stuff.

    Posted by Frenzie at

  23. Yet another great article from you Anne, well done. I've been meaning to write something about this myself one day, but haven't yet got around to it. However, one thing I did get around to doing recently, was addressing the "everything is a tag" problem.

    Posted by Lachlan Hunt at

  24. Charl, ever heard about the OBJECT element. The theoretically superior element, which sucks in the real world?

    I say we all start using XLink and drop the lame object tag ;p.

    ~Grauw

    Posted by Laurens Holst at

  25. It's important to point out that in Internet Explorer 6.0 SP2 the title attribute always overrides alt as the tooltip, even when the value of title is explicitly defined as an empty string. That means that if you have the following markup...

    <img src="image.gif" alt="You won't see this." title="">

    ...you will not see a tooltip for image.gif in IE. Therefore, the only reason I can think of to use the alt attribute as a tooltip is for older browsers that don't correctly support title. If the target audience for your web page has an up-to-date version of IE, Opera or Mozilla, there's no reason not to use title for tooltips exclusively.

    As for wanting the alt value to be the tooltip in some cases, that sets a dangerous precedent. Alternative text is supposed to replace the image, not describe it, and therefore properly written title and alt values should almost never be equivalent.

    Posted by Matthew Raymond at

  26. In my example, I see no reason why they shouldn't be equivalent. There is one possible difference, maybe the alt should be like MSN: bla@bla.com and the title could just be bla@bla.com. However, the additional MSN: wouldn't be too bad as a tooltip too. I don't think I can think of many cases where I'd like them to be the same, but well, they do exist.

    Posted by Frenzie at

  27. Matthew Raymond, you looked at image maps? Internet Explorer is buggier than you think it is.

    Posted by Anne at

  28. My mother: No! I won't use your !#% ALT-Texts! With all those yellow boxes around for every spacer Image I use - that makes me sick!
    (well, I try to teach her good webdesign all the time, but why learn CSS when Dreamweaver can produce it for me?)

    Posted by Pascal at

  29. I abused the alt tags too for tooltips. There was no alternative, I thought. I use geo mapping software that displays info about a certain waypoint, and you can`t display them all... Now I changed my php functions in order to show `title` instead of `alt` tags. Thanks for the info, it works fine! BTW, why do I have to format this input myself? And how? What XML rules? Quite not-so-obvious for me...

    Posted by Kees Wesselius at