Hallo wolfgangP
zuerst mal folgendes... die klassischen imagemaps sind in Zeiten von kleinen hochauflösenden Displays der Smartphones mit Vorsicht zu genießen. Es gibt zahlreiche Lösungen, die zum Ziel führen aber das Ganze auch responsiv zu gestalten ist... nun ja - eine Herausforderung.
Es gibt mit rect (Definition rechteckiger Bereiche), circle (Definition eines Kreises) und poly (Definition eines Vielecks) verschiedene Möglichkeiten, die map einzuteilen. Ich empfehle dir ein solides Grundverständnis zu bekommen und dir so nach und nach die Gestaltung zu erarbeiten. Hier dazu einige passende Erläuterungen:
➥ HTML Area Map von mediaevent.de
➥ Image Map von seobility.net
Wie komplex das Thema dabei ist, verdeutlicht ➥ dieses Beispiel von mediawiki.org.
Wenn du selbst nach Erklärungen suchst, solltest du darauf achten, den Suchfilter zeitlich auf das letzte Jahr zu setzen, da die Technik sehr alt ist und alte Anleitungen nicht mehr mit modernen Geräten korrespondieren, ➥hier das Beispiel einer Googlesuche "Deutsch" / "max. 1 Jahr".
Arbeitest du mit einem CMS wie beispielsweise WordPress (...was ich dir heutzutage empfehle), dann gibt es zahlreiche Plugins, welche dir die Funktionalität entsprechend einbauen, wie beispielsweise ➥ hier auf einer meiner kommerziellen Websites. Du baust dabei die reine Funktionalität ein und verfeinerst nur noch Definitionen und Gestaltung mit html5 und css3. Dieses Vorgehen entlastet vom nerv- und zeitraubenden coden ganzer Seiten und ist im Ergebnis sowohl in Hinsicht auf die Suchmaschinenoptimierung (sogenanntes SEO) als auch und besonders für responsives Webdesign ganz erheblich besser.
Lieben Gruß
Tunarus