HTML img tag: title attribute vs. alt attribute?

html accessibility alt
nonopolarity picture nonopolarity · May 16, 2009 · Viewed 103.5k times · Source

I was browsing Amazon and I noticed that when searching "1TB" if you hover the mouse cursor over the stars rating image, you only see the score if using IE. If you are using another browser then the score won't show.

A rating of 3.8 and a rating of 4.2 both show up as 4 stars. Of course a 3.8 stars vs 4.2 stars (76% vs 84% score) could make a difference!

This is because the standard way of displaying alt text is only when the user turns off graphics or when the browser is "read out" (e.g browser for users who are visually impaired). IE however, shows it on hover.

So I think if Amazon is to show it regardless of the user's browser, then title should be used in addition to alt. Would you agree?

Answer

jalf picture jalf · May 16, 2009

They are used for different things. The alt attribute is used instead of the image. If the image can't be shown, and in screen readers.

The title attribute is shown along with the image, typically as a hover tooltip.

One should not be used "instead" of the other. Each should be used properly, to do the things they were designed to do.

Related questions

input type="submit" Vs button tag are they interchangeable?

input type="submit" and button tag are they interchangeable? or if there is any difference then When to use input type="submit" and when button ? And if there is no difference then why we have 2 tags for same purpose?

Read More
Default html form focus without JavaScript

Is it possible to set the default input focus on an HTML form without using JavaScript, for example: <html> <form> Input 1: <input type="text" name="textbox1"/> <br/> Input 2: <input type="text" …

Read More
Styling disabled <select> (dropdown boxes) in HTML

One of our customers has a hard time reading the grey text in disabled controls in our web-based application: We would like to change the style to a light grey background and a black text. Unfortunately, most browsers (including IE, …

Read More