Guidelines for Image Maps

1. Create an image in GIF format

2. Choose hotspots on the image - points, circles, rectangles, or convex polygons¹ - to set off each URL

3. Define a map file associating hotspots with URLs:

   Method URL P₁ ... P_n

   P_i are coordinates in (x,y) format - the number depends on Method

   Method is one of the following:

   • default - default URL (coordinates: none)
   • point - closest point wins (coordinate: the_point)
   • rect - rectangle (coordinates: upper_left lower_right)
   • circle - circle (coordinates: center boundary point)
   • poly - polygon of at most 100 vertices (coordinates: one per vertex)

   Example logo.map

4. Get a copy of WinGIF, a GIF converter², to make the previous two steps easier. Then follow this procedure:
   1. Convert the GIF file to a PCX or BMP file
   2. Use the cutting and pasting technique to copy the PCX or BMP file from the previous step and paste it at the upper left corner of the Paint Brush screen
   3. Select View/Cursor Position
   4. Select View/Zoom In
   5. Use the arrow keys to move to the (x,y) coordinate
   6. Repeat the previous step for each coordinate

5. Make an in-line image be a link to the map file:

   <A HREF="/script_path/imagemap_script/mapfile_path/mapfile.map">
   <IMG SRC="image_URL" ALT="text" ISMAP></A>

6. Test the image map

Other Web Documents

• Imagemap Help Page - IHiP
• Imagemap Authoring Guide and Tutorial Sites

¹A polygon is convex if the straight line-segment joining any two interior or boundary points lies either within or along the boundary of the polygon.
²This is not required for Windows 95/98/2000.

Home Previous Page