HTML <area> tag

Updated: 10/11/2017 by Computer Hope

HTML area tagWhen writing in HTML, the <area> tag is used to mark out certain sections within an image map. It is useful when you want an image on your page to have multiple hyperlinks. The following sections contain information about this tag, including an example of it in use, as well as related attributes and browser compatibility.

Note: The <area> element must be nested inside a <map> tag.

Example code

<img src="https://www.computerhope.com/cdn/computer-hope.jpg" alt="Computer 
Hope logo" width="412" height="82" usemap="#CHmap" class="logo"/>
<map name="CHmap">
<area shape="rect" coords="89,9,294,50" href="../c/computer.htm" alt="Computer">
<area shape="rect" coords="297,7,407,54" href="hope.htm" alt="Hope">
</map>

Example result

Computer Hope logo Computer Hope

In the image above containing our logo, clicking the word "Computer" opens our computer definition page. Clicking the word "Hope" opens our hope definition page.

Attributes

Within an HTML tag, an attribute dictates certain aspects of an HTML element. Attributes are made up of a name and value pair; all tags support standard attributes. The following table shows all of the current unique HTML attributes for the <area> tag, as well as a description of each.

Attribute Description
alt Designates the alternate text for each area of the image map
coords Designates the coordinates of the area
download Designates that the target will be downloaded upon being clicked
href Designates the URL of the web page to which the link points
hreflang Designates the language of the file to which the link points
media Designates the device the linked file is optimized for
rel Designates the relationship between the linked and current files
shape Designates the shape of the area
target Designates where the target URL opens
type Designates the linked file's media type

Deprecated attributes

A deprecated attribute is one that may function currently, but is not supported going forward. Not being supported means that, while the attribute may work with the current version of HTML, it will eventually be phased out and become obsolete. It is better to avoid using these attributes to help future-proof your website.

Attribute Description
nohref Denotes that the area does not have a hyperlink associated with it

Compatibility

Internet Explorer Firefox Safari Opera Chrome
All versions All versions All version All versions All versions

<a>, Browser, Compatibility, Logo, Target, URL, Web design terms