Пример создания карты-изображения

Для создания карты-изображения в HTML можно использовать тег <map> и <area>. Вот пример кода:

<!DOCTYPE html>
<html>
<head>
	<title>Карта-изображение</title>
</head>
<body>
	<h1>Карта-изображение</h1>
	<img src="image.jpg" alt="Карта" usemap="#map">
	<map name="map">
		<area shape="rect" coords="0,0,50,50" href="page1.html" alt="Область 1">
		<area shape="circle" coords="100,100,50" href="page2.html" alt="Область 2">
		<area shape="poly" coords="150,150,200,200,150,250,100,200" href="page3.html" alt="Область 3">
	</map>
</body>
</html>

В данном примере создается карта-изображение с тремя областями, каждая из которых является ссылкой на другую страницу. Первая область имеет форму прямоугольника, вторая — круга, а третья — многоугольника. Для каждой области определены координаты и альтернативный текст, который будет отображаться в случае недоступности изображения. Области обрамлены тегом <map>, а сами координаты задаются с помощью атрибута coords в теге <area>.