HTML and CSS Reference
In-Depth Information
Not every graphic image requires a text alternative. For example, a decorative image
such as a bullet does not need a text equivalent. In those cases, you should include
the
alt
attribute, but set its value to an empty text string. You should never neglect to
include the
alt
attribute. If you are writing XHTML-compliant code, the
alt
attribute
is required. In other cases, screen readers and other nonvisual browsers will recite the
fi lename of a graphic image fi le if no value is specifi ed for the
alt
attribute. Since the
fi lename is usually of no interest to the end-user, this results in needless irritation.
The
alt
attribute is best used for short descriptions that involve fi ve words or less. It
is less effective for images that require long descriptive text. You can instead link these
images to a document containing a more detailed description. One way to do this is with
the
longdesc
attribute, which uses the syntax
<img src=”
url
” longdesc=”
url
” /
>
where
url
for the
longdesc
attribute points to a document containing a detailed descrip-
tion of the image. Figure B-2 shows an example that uses the
longdesc
attribute to point
to a Web page containing a detailed description of a sales chart.
Figure B-2
Using the alt attribute
sales.html
<img src="chart.jpg" alt="Sales Chart"
longdesc="sales.html" />
In browsers that support the
longdesc
attribute, the attribute's value is presented as
a link to the specifi ed document. However, since many browsers do not yet support this
attribute, many Web designers currently use a D-link. A
D-link
is an unobtrusive “D”
placed next to the image on the page, which is linked to an external document contain-
ing a fuller description of the image. Figure B-3 shows how the sales chart data can be
presented using a D-link.
