Use of the shape and coords attribute in an a element, to create an image-map:

Edit code and click me	Your Result (Some examples do not work in Google Chrome):
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> </head> <body style="font-family:Arial, Helvetica, sans-serif;color:#3c3c3c;direction:rtl;text-align:right;"> <p> Click on one of the planets to watch it closer: </p> <object data="/images/353915main_image_1377_428-321.gif" alt="Planets" type="image/gif" usemap="#Map1"> <map name="Map1"> <a href="http://xhtml.co.il/tryit_view.php?page_id=551&lang=en" shape="rect" coords="203,104,343,241">The Sun</a> <a href="http://xhtml.co.il/tryit_view.php?page_id=552&lang=en" shape="circle" coords="92,98,56">Mercury</a> </map> </object> <p> <b>Note</b>: The coords attribute is only supported in Firefox and Opera. </p> </body> </html>
Edit the code above and click to see the result	www.xhtml.co.il - Try it yourself