Offering Alternate Text

While images are great on a big screen with a fast connection, they can be less usefuland downright problematicon handhelds, phones, slow connections, or for the blind. You can add descriptive text that will appear if the image, for whatever reason, does not.

Tips

The alt attribute is required for all img tags in both XHTML and HTML.
On IE Win 5+, the alt tag text is automatically used as a tool tip (Figure 5.11), similar to the effect of the title tag in all current browsers (see page 68). If you'd like tool tips on images in all browsers, use the title tag in addition to alt (which will still appear when the image does not). If you don't want tool tips at all, set title="".

Figure 5.11. On Explorer for Windows, when the visitor points at an image with alternate text, the alternate text appears in a tool tip. You can create tool tips for all current browsers by using the title tag (see page 68).
If the image is just for formatting, like a horizontal line or a bullet image, the W3C suggests you use alt="".
Screen readers for the blind, like JAWS, can read the alternate text out loud so that blind visitors can get an idea of what the image is about.
You can format the alternate text with different fonts and sizes by applying styles to the img tag. For details on styles, see Chapter 10, Formatting with Styles.

Offering Alternate Text

Figure 5.9. While the alternate text can theoretically be as long as you like, most browsers don't automatically wrap long lines. Therefore, it's a good idea to keep it under 50 characters or so.

Figure 5.10. In Internet Explorer, the alternate text appears next to a small box with a red x. In other browsers, the text appears alone.

Figure 5.11. On Explorer for Windows, when the visitor points at an image with alternate text, the alternate text appears in a tool tip. You can create tool tips for all current browsers by using the `title` tag (see page 68).

Offering Alternate Text

Figure 5.9. While the alternate text can theoretically be as long as you like, most browsers don't automatically wrap long lines. Therefore, it's a good idea to keep it under 50 characters or so.

Figure 5.10. In Internet Explorer, the alternate text appears next to a small box with a red x. In other browsers, the text appears alone.

Figure 5.11. On Explorer for Windows, when the visitor points at an image with alternate text, the alternate text appears in a tool tip. You can create tool tips for all current browsers by using the title tag (see page 68).

Figure 5.11. On Explorer for Windows, when the visitor points at an image with alternate text, the alternate text appears in a tool tip. You can create tool tips for all current browsers by using the `title` tag (see page 68).