Webreference.com: HTML 3.0 and Netscape 3.0: The IMG (image) Element | WebReference

Webreference.com: HTML 3.0 and Netscape 3.0: The IMG (image) Element


The IMG (image) Element

HTML 3.0 and Netscape 3.0

The <IMG> tag [Ra 95e] is used to incorporate in-line graphics (typically icons or small graphics) into an HTML document. Browsers that cannot display in-line images ignore the IMG element unless it contains the ALT attribute. The HTML 3.0 attributes now include LANG, CLASS, SRC, MD, WIDTH and HEIGHT, UNITS, ALIGN, ALT, and ISMAP. NHTML includes the SRC, WIDTH and HEIGHT, ALIGN, ALT, and ISMAP attributes.

The WIDTH and HEIGHT attributes are now common to both HTMLs and should be used wherever possible as they speed up the display of your pages. Normally, the browser must calculate the size of your graphics to display the entire page. With the size pre-specified using WIDTH and HEIGHT, your text appears nearly instantaneously.

The ALIGN attribute is now included in the latest HTML 3.0 draft, and allows text to flow around graphics. I suspect the ALIGN attribute was added due to Netscape's influence, and it should be used sparingly. The new <FIG> (FIGure) tag [Ra 95f] is more powerful, and should be used instead once browsers support it. It provides captions, overlays, and client-side ISMAPs.

In HTML 3.0 ALIGN can have the values of TOP, MIDDLE, and BOTTOM, and LEFT and RIGHT for text flow. NHTML includes additional options that are not in the HTML 3.0 draft: ALIGN=TEXTTOP, ABSMIDDLE, BASELINE, ABSBOTTOM, and the BORDER, VSPACE, and HSPACE attributes. These should not be used.

The ALT attribute provides a text alternative for text-only environments (like when you turn auto-load images off for speed). The ALT tag should be included with each IMG as a matter of course. It can contain text but cannot contain markup. View the source of this page for an example. The FIG element automatically makes the descriptive text markup when in text mode.

The ISMAP attribute is used to create a clickable imagemap. JPEGs can be used as clickable imagemaps in addition to GIFs in browsers that support them (i.e., Netscape).

Putting these all together we have the following IMG guidelines.


<A HREF="/cgi-bin/imagemap/index.map"><IMG SRC="officemap.gif" ALIGN=ABSMIDDLE BORDER=3 VSPACE=5 HSPACE=10 ISMAP></A> - WRONG

<A HREF="/cgi-bin/imagemap/index.map"><IMG SRC="officemap.gif" WIDTH=250 HEIGHT=400 ALIGN=LEFT ISMAP ALT="Sensitive Office Map"> - RIGHT

For a plain in-line image you wouldn't have all these options of course:

<IMG SRC="rocko.gif" WIDTH=250 HEIGHT=400 ALT="Rocko Picture">


Comments/suggestions are welcome at aking@webreference.com


Revised: Apr. 14, 1996

URL: http://webreference.com/html3andns/img.html