Visual Elements and Graphics - Web Development and Design Foundations with XHTML - page 133

Table 4.2 Attributes of the <img /> tag

Attribute Value

right , left (default), top , middle , bottom (Deprecated) align

Text phrase that describes the image

alt

Image border size in pixels (Deprecated) 0 will prevent the border from being displayed.

border

Height of image in pixels

height

Amount of space that is blank to the left and right of the image in pixels (Deprecated)

hspace

Text name, alphanumeric, beginning with a letter, no spaces—the value must be unique and not used
for other id values on the same XHTML document

id

longdesc URL of a Web page that contains a text description of the image

name Text name, alphanumeric, beginning with a letter, no spaces—this attribute names the image so that it

can be easily accessed by client-side scripting languages such as JavaScript. This attribute is depre-
cated in XHTML but is used to provide backward compatibility with browsers that support HTML.

The URL or file name of the image

src

title A text phrase containing advisory information about the image—typically more descriptive than the

alt text

vspace Amount of space that is blank above and below the image in pixels (Deprecated)

Width of image in pixels

width

Use height and width attributes to help the browser render your page more efficiently.
If you omit the attributes, the browser must often adjust and shift the other page ele-
ments after your images load. This slows down the loading of your Web page. The
browser reserves the correct amount of space for your image if you use the height and
width attributes with values either equal to or approximately the size of the image.

FAQ

What if I don't know the height and width of an image?

Most graphics applications can display the height and width of an image. If you have a graph-
ics application such as Adobe Photoshop or Adobe Fireworks handy, launch the application
and open the image. These applications include options that will display the properties of the
image, such as height and width.

If you don't have a graphics application available, you can determine the dimensions of an
image using a browser. Display the image on a Web page. Right-click on the image to display
the context-sensitive menu. Select properties and view the dimensions (height and width) of the
image. ( Warning : if the height and width are specified on the Web page, those values will be
displayed even if the image's actual height and width are different.)

Accessibility and Images
Use the alt attribute to provide accessibility. Recall from Chapter 1 that Section 508 of
the Rehabilitation Act requires the use of accessibility features for new information

Focus on Accessibility

WWW