alt tags and title tags

use one or both?

[kanama]

in images and links what are the purposes of alt and title tags?

I know roughly what they are used for but do you use one of them or both? and if both whats the difference between the two?

[Stefan]

The purpose with images was originally for users of text browsers, to indicate what was missing. Now, they tend to be more of a general tip or added info for a link or pic.

As far as I know:

With Mozilla, title attributes are used for both links and images.

With IE, title is for links and alt for images.

If you want them to appear for images in both Moz and IE, use both the alt and title attributes in the image tag.

There's more on the history of the things on various sites on the net.

[Josefu]

...And if I may: you can also 'use' the "title" phrase to prevent the "alt" test from appearing in a flag over every image in IE 6.0: just add title="" to the end of every <img> tag : )

[Purple Martin]

They have different purposes, and therefore should be used to do different things.

Use the alt attribute for text that should be displayed if for some reason an image isn't displayed (e.g. the user has images turned off). This text should describe the content of the image in a way that will help users who don't see the image understand what it is for. If the image is just an interface graphic that doesn't need text to describe its content (e.g. spacer.gif), leave the alt attribute empty like this: alt=""

Use the title attribute to give extra information about the image, such as its title. You can in fact use the title attribute in this way for any HTML element, not just images. Think of it as a kind of elemental metadata.

IE will display alt attributes as a tooltip even though it shouldn't, which has resulted in many people using alt when they should be using title.

[pete_m]

Spot on Purple Martin. Title and alt attributes are some of the most commonly-confused parts of HTML - most web designers seem to think that they are interchangeable.

[limbo]

More:

[w3.org...]
[w3.org...]

Ta

Limbo

[g1smd]

Use the alt attribute on images. The text appears if the image does not load or if image loading is turned off. It is also used by screen readers for disabled folks.
On IE the alt text pops up, but this is a bug/design flaw in IE (and has already been discussed multiple times on WebmasterWorld).

Use the title attribute on links. This gives some pop up tooltip text to help the user who was about to click that link.

[Stefan]

Title attributes for images can be handy for giving photo credits, names of people in the pic, etc. I always include both title and alt for <img> for that purpose, to cover Moz and IE, and I usually mouse over pics on other sites to see if anything shows up.

[Josefu]

Yes, please don't get me wrong in my earlier post - the 'title' attibute can be useful. I myself use it as a photo description or caption - I also use it as a sort of mouseover extra to show, if clicked, where an image will take the visitor.

Until MS gets around to eliminating this IE 6.0 'bug' (and may have already in the very recent update - news there?), any 'alt' attribute you give a photo will show up if you move the mouse over it. If you also have a title tag, the title tag takes priority over the 'alt'. Thus adding an 'empty' title tag will show... nothing.

[Old_Timer]

I see no evidense at this time that SE are reading the title tag. I'm wandering if there could be a peanilty involved for having the exact same text in the title tag as the alt tag?