Currently, my webpage images use the alt attribute only.
Users complain that their IE8 cannot show the "tooltip" bubble when they mouse over the image. On Microsoft's What's New in Internet Explorer 8 page, it says

The alt attribute is no longer displayed as the image tooltip when the browser is running in IE8 Standards mode. Instead, the target of the longDesc attribute is used as the tooltip if present; otherwise, the title is displayed. The alt attribute is still used as the Microsoft Active Accessibility name, and the title attribute is used as the fallback name only if alt is not present.

I also found that many say title should be used.
Which should I use to meet the industrial standard: alt, longdesc or title?

  • 1
    The alt attribute doesn't produce a tooltip in any browser except IE7 and earlier.
    – MrWhite
    Commented Dec 18, 2012 at 9:20

2 Answers 2


Title attributes in <img> tags are what show up on mouse over by default. I would use the title attribute or use a jQuery plugin to create nicer tool tips on mouse hover.

  • 1
    The jQuery plugin should still be based on the title attribute in order to be accessible.
    – MrWhite
    Commented Dec 18, 2012 at 9:21
  • @w3d what are you talking about? "The jQuery plugin" using title attributes should still be based on the title? This one certainly doesn't craigsworks.com/projects/qtip/demos and i'm sure others are similar.
    – Anagio
    Commented Dec 18, 2012 at 9:51
  • The title attribute is the accessible way to provide a tooltip cross browser. Any enhanced JavaScript tooltip can go way beyond what the meagre title attribute can provide but all I'm saying is that this should still be used in conjunction with the title attribute in order to be accessible. The jQuery plugin you link to can be used with the title attribute and it is only truly degradable (listed as one of its features) if the title attribute is used.
    – MrWhite
    Commented Dec 18, 2012 at 10:38

Many CMSes place that content in both the title and the alt attributes, but those attributes do have different semantic meanings. Whereas title is explicitly meant to be used for tooltips, alt is (a) what's read to visually impaired users, and (b) what gets rendered if the image doesn't load for some reason. If you're only going to write one piece of text and duplicate it using jQuery, I would write it for the alt attribute and copy it to the title using the following jQuery code:

        $(this).attr('title', $(this).attr('alt'));

Be sure to modify the img[alt] piece if you don't want to apply this change to every image on the page; for instance, use #content img[alt] to only apply it to descendants of <div id="content">.

The decision to use alt over title in your HTML is based on three factors: first, accessibility is important, and you can't rely on Javascript being enabled; second, it sounds like you already have alt attributes in place; third, the tooltip in this case is a nonstandard user request you may want to disable in the future, but the images should still have that text associated with them even if you do.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.