There are three basic shapes of maps: rectangle, circle and polygon. For each of them you need different coordinates to outline area within which link will be embedded.
Below image points coordinate you need to find out:

rectangle circle polygon

img.png

How to do it with GIMP?
screenshot of GIMP windowWhen you hover over image in GIMP in the bottom left corner show up coordinates for present place of cursor (please, click on thumbnail to zoom it out). That’s all you need to know. But how to find out circle radius? No problem; while drawing circle using GIMP at the bottom of window you get information on height and width of area you are selecting; radius is half of that number :wink_tb: . I’ve selected area 60 x 60 px so radius of my circle is 30 px.

Now you need to create code to have your image working as a map. I’ve presented all possibilities (rectangle, circle, polygon) but of course you can delete those you don’t intend to use.
Note! Map ID need to be unique. It can be used on page only one time.

<map name="myMap" id="myMap">
<area href="http://en.wikipedia.org/wiki/Rectangle" shape="rect" coords=â"x1, y1, x2, y2" alt="rectangle" />
<area href="http://en.wikipedia.org/wiki/Circle" shape="circle" coords="x3, y3, r" alt="circle" />
<area href="http://en.wikipedia.org/wiki/Polygon" shape="poly" coords="x4, y4, x5, y5, x6, y6" alt="polygon" />
</map>
<img alt="map" src="http://www.nietoperzka.com/wptraining/wp-content/uploads/2007/09/img.png" width="420" height="185" usemap="#myMap" />

And that’s all; you can check image with coordinates above to check how it works :smile_tb: .