HTML <map> Tag


An image-map, with clickable areas:

<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">
Try it yourself »

Definition and Usage

<map> Tags are used for client-side image mapping. An image map is an image with a clickable area.

<img> Usemap attribute in reference <map> Id or name attribute in the browser (depending on the browser), so we should both <map> Add id and name attributes.


area element is always nested inside the map element. The area element defines an area in the image map.

Browser Support

<map> Yes Yes Yes Yes Yes Yes

Differences Between HTML 4.01 and HTML5

Note: In HTML5, if the id attribute of the <map> tag is also specified, it must have the same value as the name attribute.

Differences Between HTML and XHTML

In XHTML, the name attribute is deprecated, and will be removed. Use the global id attribute instead.


Attribute Value Description
name mapname Required. Specifies the name of an image-map