--- title: "HTML 5 area tag" description: "The HTML area tag is used for defining an area in an image map. Image maps are images with clickable areas (sometimes referred to as \"hotspots\") that" author: "Anonymous User" published: 2011-07-22 updated: 2018-03-22 canonical: https://www.mindstick.com/articles/578/html-5-area-tag category: "html5" tags: ["html5"] reading_time: 2 minutes --- # HTML 5 area tag The HTML tag is used for defining an area in an image map. Image maps are images with clickable areas (sometimes [referred to as](https://answers.mindstick.com/qa/97098/which-layers-are-referred-to-as-network-support-layers) "hotspots") that usually link to another page.\ The element always nested in map tag. ##### Attributes Description ##### shape Defines a shape for the clickable area. [Possible values](https://www.mindstick.com/forum/23337/hibernate-hbm2ddl-auto-possible-values-and-what-they-do): 1. Default: Specifies the entire region. 2. Poly or Polygon: Defines a polygonal region. 3. Rect or Rectangle: Defines a rectangular region. 4. Circle or circ: Defines a circular region. ##### href Specifies the target url of the area. It should be another image or link of another website. ##### target This attribute will specify that where to open target link. It should be _blank, _parent, _self, _top or frame name. ##### media This attribute will specify that which media device the target url is optimized for. The [default value](https://www.mindstick.com/forum/23023/default-value-when-using-singleordefault) is all. ##### hreflang This attribute specifies language code of the [destination URL](https://answers.mindstick.com/qa/33722/what-is-the-maximum-length-of-destination-url). Only to be used when the href attribute is present. ##### type This attribute specifies the [MIME type](https://www.mindstick.com/interview/1730/what-is-mime-type-of-json) of the linked resource. Only to be used when the href attribute is present. ##### alt This specifies text to be used in case the browser/[user agent](https://www.mindstick.com/forum/34338/what-is-the-difference-between-a-user-agent-ua-and-a-mail-transfer-agent-mta) can't render the image. ##### coords Specifies the coordinates of the clickable area. Coordinates are specified as follows: - rect: left, top, right, bottom. - circle: center-x, center-y, radius. - poly: x1, y1, x2, y2, ... ##### ping Gives the URLs to be [notified if](https://answers.mindstick.com/qa/96080/how-does-reddit-spam-filtering-work-do-you-get-notified-if-your-post-gets-tagged) the user follows the hyperlink. Only to be used when the href attribute is present. ##### rel Specifies the relation between current document and the target URL.[Attribute values](https://www.mindstick.com/interview/2579/what-attribute-values-should-be-localized) are shown below: - alternate - archives - author - bookmark - external - feed - first - help - index - last - license - next - nofollow - noreferrer - prev - search - sidebar - tag - up ##### Code: ```     Desert            Desert         Flower                               ``` If user clicked on desert area then user will reach on [MINDSTICK website](https://answers.mindstick.com/qa/108575/how-to-resolve-the-issue-of-sign-up-in-the-mindstick-website), if user clicked on sky area on image then user will reach on GOOGLE. --- Original Source: https://www.mindstick.com/articles/578/html-5-area-tag Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.