InMotion Web Site Hosting
InMotion Hosting Home

Idocs Guide to HTML
Home >> Images
previous page<MAP NAME="..."><AREA HREF="..."> next page

<AREA ...>

Usage Recommendation
use it if you use <MAP ...>

  • HREF: URL you are linking to
  • ALT: alternate text if the image isn't displayed
  • SHAPE: what shape is this area?
  • COORDS: coordinates for the link area shape
  • TITLE: Short description of the area
 

Looking for info on how to make an image map?

See our tutorial How to Make an Image Map
<AREA ...> defines a single area within an image map. <AREA ...> requires the SHAPE and ALT attributes. In most cases also requires the HREF attribute to indicate the page the area points to. 

<DIV ALIGN=CENTER>

<MAP NAME="map1">
<AREA 
   HREF="contacts.html" ALT="Contacts" TITLE="Contacts" 
   SHAPE=RECT COORDS="6,116,97,184">
<AREA 
   HREF="products.html" ALT="Products" TITLE="Products" 
   SHAPE=CIRCLE COORDS="251,143,47">
<AREA 
   HREF="new.html" ALT="New!" TITLE="New!"     
   SHAPE=POLY COORDS="150,217, 190,257, 150,297,110,257">
</MAP>

<IMG SRC="testmap.gif" 
   ALT="map of GH site" BORDER=0 WIDTH=300 HEIGHT=300
   USEMAP="#map1"><BR>

[ <A HREF="contacts.html" ALT="Contacts">Contacts</A> ]
[ <A HREF="products.html" ALT="Products">Products</A> ]
[ <A HREF="new.html"      ALT="New!">New!</A> ]
</DIV>

which gives us this map:

Contacts Products New! map of GH site
[ Contacts ] [ Products ] [ New! ]
previous page<MAP NAME="..."><AREA HREF="..."> next page
Copyright 1997-2002 Idocs Inc. Content in this guide is offered freely to the public under the terms of the Open Content License and the Open Publication License. Contents may be redistributed or republished freely under these terms so long as credit to the original creator and contributors is maintained.
InMotion Web Hosting Customer Support
M-F 8am - 7pm PST
213-239-0050

More information can be found at the InMotion Hosting Main Site