<area>

Каждый элемент <area> определяет активные области изображения, которые являются ссылками. Рисунок с привязанными к нему активными областями называется в совокупности картой-изображением. Такая карта по внешнему виду ничем не отличается от обычного изображения, но при этом оно может быть разбито на невидимые зоны разной формы, где каждая из областей служит ссылкой. Элемент <area> задаёт форму области, её размеры, устанавливает адрес документа, на который следует сделать ссылку. <area> всегда располагается в контейнере <map>, который связывает координаты областей с изображением.

Несколько областей могут перекрывать друг друга, сверху будет та, которая в коде HTML располагается выше.

Синтаксис:

<map>
  <area href="URL">
</map>

Закрывающийся тег: 
Не требуется
Поддержка: 
HTML4 и выше
Атрибуты: 

alt - Альтернативный текст для области изображения.

<area shape="rect" coords="185,10,390,90" href="http://weblecture.ru/node/13" alt="HTML">

coords - Устанавливает координаты активной области.
<area shape="rect" coords="10,20,180,100" href="http://weblecture.ru/node/3">

href - Задаёт адрес документа, на который следует перейти.
<area shape="circle" coords="321, 245, 100" href="http://weblecture.ru/node/13">

hreflang - Указывает язык документа, на который ведёт ссылка.
<area shape="rect" coords="10,20,180,100"  href="http://weblecture.ru/node/16" hreflang="ru">

nohref - Область без ссылки на другой документ.
shape - Форма области.
<area shape="poly" coords="10,80,40,20,180,100" href="http://weblecture.ru/node/17">

target - Имя окна или фрейма, куда браузер будет загружать документ.
<area shape="rect" coords="10,20,180,100" href="http://weblecture.ru/node/18" target="_blank" alt="Откроется в новом окне">

type - Устанавливает MIME-тип документа, на который ведёт ссылка.
<area shape="poly" coords="10,80,40,20,180,100" href="http://grafika.me/demoscene" type="image/jpeg">

Пример: 

<!DOCTYPE HTML>
<html>
 <head>
   <meta charset="utf-8">
   <title>area</title>
   <style type="text/css">
   </style>
 </head>
 <body> 
   <div id="title">
   <img src="area_1.jpg" width="400" height="300" 
                alt="CSS and HTML" usemap="#Navigation"><br>
   <p><map name="Navigation">
      <area shape="rect" coords="10,20,180,100" href="http://weblecture.ru/node/14">
      <area shape="rect" coords="185,10,390,90" href="http://weblecture.ru/node/13">
   </map></p>
 </body>
</html>