Image maps are pictures that have places on them where you can click your mouse and you will go to a specific web page. They are sometimes used for navigation bars on websites.
The clickable areas of an image map are either circles, rectangles or polygons. The coordinates of the shapes are described in the HTML code.
The code you need looks like this:
<img src=”planets.gif” width=”145″ height=”126″ alt=”Planets” usemap=”#planetmap”>
<map name=”planetmap”>
<area shape=”rect” coords=”0,0,82,126″ href=”sun.htm” alt=”Sun”>
<area shape=”circle” coords=”90,58,3″ href=”mercur.htm” alt=”Mercury”>
<area shape=”circle” coords=”124,58,8″ href=”venus.htm” alt=”Venus”>
</map>
Image maps are another trick that is far easier to do in web development software or some image editing software packages. It is possible to do in HTML though and Mobile Fish have a nice online image map generator tool that is easy to use.
The map is available as a Peppa Pig Map
