HTML Dog
Skip to navigation

HTML Tag: area

A region of an image map. Used in conjunction with map to map links to certain areas of an image.

area has no content and therefore does not warrant a closing tag.

Optional Attributes

Attribute Description Possible values
alt Alternative text for when images aren’t available. Required if the href attribute is present. Text.
shape The area’s shape.
  • rect: Rectangle. This is the default value, if the shape attribute is omitted.
  • circle.
  • poly: Polygon.
  • default: The area becomes the whole image area.
coords The pixel coordinates of the area and its shape.
  • For rectangular shapes, this is a comma-separated list of four values for left, top, right and bottom (eg. coords="0,0,50,50").
  • For circular shapes this is a comma-separated list of three values for left, top and radius (eg. coords="50,50,25").
  • For polygonal shapes, this is a comma-separated list containing an even number of values, specifying the left and top of each point of the shape (eg. coords="0,0,25,25,50,25,50,100").
href Target destination the area links to. URL.
rel Used with href. The relationship between the link’s page and the link’s target destination.
  • alternate: An alternative version of the current web page.
  • author: A page containing details of the author of the page / article.
  • bookmark: A link to the current section of the page.
  • help: Help specific to the context.
  • license: A copyright license for the current document.
  • next: Indicates that the page is in a sequence and the linked page is the next page in the sequence.
  • nofollow: Indicates that the linked resource is not endorsed by the current document’s author.
  • noreferrer: Tells the browser not to send an HTTP referrer header when following the link.
  • prefetch: The linked resource should be cached.
  • prev: Indicates that the page is in a sequence and the linked page is the previous page in the sequence.
  • search: A search facility that can be used to search the current, and related, documents.
  • tag: A tagging term (not to be confused with HTML tags) that applies to the link.
hreflang Used with href. The language of the target of the link. Language code, such as en (English) or es (Spanish).
type Used with href. The MIME type of the linked resource. Text.
download Used with href. Indicates that the link target should be downloaded instead of navigated to. None.
target Used with href. The browsing context in which the target destination should open.
  • _self: Opens link in current window / tab.
  • _blank: Opens link in a new window / tab.
Global attributes

Example


<map name="atlas">
    <area shape="rect" coords="0,0,115,90" href ="northamerica.html" alt="North America">
    <area shape="poly" coords="113,39,187,21,180,72,141,77,117,86" href="europe.html" alt="Europe">
    <area shape="poly" coords="119,80,162,82,175,102,183,102,175,148,122,146" href="africa.html" alt="Africa">
</map>