The <area> element

The area element is always a child element of the map element. It is an empty element. Its function is similar to a element in that it is used to create hyperlinks. However, area defines hyperlinks in imagemaps only. It does so by means of the href, coords and shape attributes.

Attributes of <area>

alt

This is a required attribute. Its function here is similar as in the img element. Here it provides a short description of the defined area.

coords

This attribute specifies a series of comma separated values whose meaning depends on the value of the shape attribute. All coordinates are with respect to the top left corner of the image box.

shape="rect"

This indicates that the defined area is a rectangle. In this case, the coords attribute will have four values. The first two values are the x and y coordinates, in pixels, of the top left corner of the rectangle, and the following two values are the coordinates of the bottom right corner.

Example: <area alt="garden" shape="rect" coords="10,50,80,20">

shape="circle"

This indicates that the defined area is a circle. In this case, the coords attribute will have three values. The first two values are the x and y coordinates, in pixels, of the center of the circle. The next value is the radius, also in pixels.

Example: <area alt="pool" shape="circle" coords="20,40,10">

shape="poly"

This indicates that the defined area is a polygon. Triangles, rectangles, pentagons, etc. are polygons. In this case, there is no limit on the number of values. Each pair of values is the coordinate of one of the vertices of the polygon. The last pair of values should be the same as the first.

Example: <area alt="house" shape="poly" coords="35,75,42,82,73,93,20,30">

href

Specifies the URL or the file that is linked to the clickable area

nohref="nohref"

This attribute is used to indicate that the area is not hyperlinked.

target

Specifies the name of the window or frame that the linked document should open in.