The <map> tag is used within an image
mapping scenario where there will be clickable items created on the
banner or image. Each area defines a hotspot that will enable mouse
interactivity. This is how YouTube allows me to place my custom links on
the top of my channel through image mapping. The buttons you see on top
of my YouTube channel are actually part of the entire background file.
In the image code demo below you will notice a rectangle and a circular
hotspot are drawn and made clickable on top of the picture.
The "coords" attribute and values are the size and location of your
hotspot items.
<img src="myImage.jpg" alt="" width="283" height="283" usemap="#hotSpotMap" />
<map name="hotSpotMap">
<area shape="rect" coords="10,10,124,51" href="page1.html" target="_blank" />
<area shape="circle" coords="102,219,46" href="page2.html" target="_blank" />
</map>
