Image Maps

Image Maps

Kiss, 1975

Image maps are pictures that allow users to access different documents by clicking on different areas of the picture.
To the left is an example of an HTML 3.0 Client Side Image Map. Try moving the mouse over the four members of Kiss and watch the statusline in your browser. Do not click the mouse since none of the links exists.

Map This! is an easy freeware program for making clickable image maps. Here is how to make an image map with Map This.

Select File, New and select an existing image.
Rightclick the image anywhere and select map info.
Supply a title, e.g. MyMap.
Do not fill in the default URL. It is only used in Netscape Navigator.
Microsoft Internet Explorer ignores it completely.
Under Map File Format choose CSIM.
Use the Rectangle, Circle/Oval and Polygon tools to create some areas.
Use the Arrow tool to double-click each area and fill in the URL to load when the user clicks an area.
Select File, Save As. Under File Format select HTML. Supply a filename, e.g. mymap.htm and save.
To implement the image map in your html-document, use the following:
<img src="image.jpg" usemap="#MyMap" border=0 width=n height=n>
<map name="MyMap"> ...... </map> (paste from mymap.htm).

Not all browsers support Client Side Image Maps. You can support these browsers by specifying an alternative Server Side Image Map this way:

<a href="ssi.map">
  <img src="image.jpg" usemap="#MyMap" ismap border=0 width=n height=n>
</a>
<map name="MyMap"> ...... </map>   (paste from mymap.htm).

The file ssi.map can also be made by MapThis! Select File, Save As and select NCSA or CERN under File Format. Ask your ISP which format you should use.

Affiliate Sites: Funny Videos | Fight Videos | Free Arcade Games