This page is part of the WebCom Web Publishing Guide. It provides a working example of a clickable image (an "imagemap") and the HTML code used to produce it.

Each button in the image below will cause a different page to be displayed. Clicking on an area outside of a button will cause the default page to be displayed.

The code to display the image and make it clickable is shown below. See the Syntax For Clickable Images page for details.

<A HREF="http://webcom.com/~webcom/imap/hpbar.map">
<IMG SRC="http://webcom.com/~webcom/graphics/hp.gif" ISMAP></A>

The map file for this graphic image is displayed below. See The Map File for details.

rect http://webcom.com/~webcom/imap/overview.html 8,5 81,34
rect http://webcom.com/~webcom/imap/news.html 86,7 139,34
rect http://webcom.com/~webcom/imap/products.html 145,6 215,35
rect http://webcom.com/~webcom/imap/contacts.html 221,8 291,37
rect http://webcom.com/~webcom/imap/other.html 299,6 437,35
default http://webcom.com/~webcom/imap/empty.html

A more complex example, with different types of areas: circles, rectangles, and polygons (multi-sided areas).