References

Collection of references for web development.

HTML area tag

Description

The HTML <area> element is a child of the <map> element, it defines an hot-spot region on the image and optionally used as creating links.

Attributes

Attribute Value Description
alt string Alternative text string to display on browsers that do not display images. The alt is required if the href attribute is used.
coords x, y, radius (rect)
x1, y1, x2, y2 (circle)
x1, y1, x2, y2, x3, y3... (poly)
Values specifying the coordinates on the hot-spot region.
download filename Download a URL instead of navigating to it.
href URL Determines the URL to where the link will point to or the name of the anchor.
hreflang language_code The language code for the destination URL.
media Operators: and|not|,
Devices: all, print, screen, speech
Values: aspect-ratio, color, color-index, grid, height, monochrome, orientation, resolution, scan, width
Specifies the media type for which the element or the document is designed for.
rel alternate
author
bookmark
canonical
external
help
icon
license
manifest
next
nofollow
noopener
noreferrer
pingback
prefetch
preload
prev
search
shortlink
stylesheet
tag
Specifies the relationship between the current and target documents.
shape rect
circle
poly
default
The shape of the hot-spot region.
target _self
_blank
_parent
_top
framename
Specifies where to display the URL.

Example

<map name="mycustommap">
	<area shape="rect" coords="0,0,100,100" href="#" alt="Rect Link">
	<area shape="circle" coords="150,50,50" href="#" alt="Circle Link">
</map>
<img usemap="#mycustommap" src="https://codeshack.io/web/img/hotspot.png" width="200" height="100" alt="An image using the map tag.">