Image Maps erstellen

Image Map Maker — klickbare Hotspots im Bild

Du gibst ein Bild hinein und bekommst eine Image Map zurück – mit nummerierten Hotspots direkt auf den richtigen Gebäuden, einer passenden Legende und einer fertigen Seite zum Teilen oder Einbetten.

East Blue, geöffneter Pin — Ein Pin auf dem Leuchtturmfelsen: Name und Beschreibung öffnen sich, ohne dass du die Karte verlässt. — East Blue, geöffneter Pin

Campus, Nahaufnahme — Nummerierte Pins auf Halle, Hof und Tor – die Legende greift jede Nummer wieder auf. — Campus, Nahaufnahme

Ribcage, Nahaufnahme — Die Hotspot-Ebene liegt direkt auf der Illustration, statt nur daneben zu stehen. — Ribcage, Nahaufnahme

Inazuma, Nahaufnahme — Jede Insel behält ihren eigenen Pin, und die Ebene skaliert einfach mit dem Bild mit. — Inazuma, Nahaufnahme

One Piece · East Blue — Sechs Inseln und ein Sturmgürtel – jeder Pin markiert einen Ort, an dem die Geschichte beginnt. — **One Piece · East Blue** — Sechs Inseln und ein Sturmgürtel – jeder Pin markiert einen Ort, an dem die Geschichte beginnt.

One Piece · Water 7 — Ein Kanalring, sechs Stationen: Brunnen, Uhrenturm, Docks, Seezug, Markt und Tor. — **One Piece · Water 7** — Ein Kanalring, sechs Stationen: Brunnen, Uhrenturm, Docks, Seezug, Markt und Tor.

One Piece · Wano — Fünf Provinzen auf einer ummauerten Insel, mit der Hauptstadt genau in der Mitte. — **One Piece · Wano** — Fünf Provinzen auf einer ummauerten Insel, mit der Hauptstadt genau in der Mitte.

Genshin Impact · Liyue — Hafen, Terrasse, Gasthaus, Felder, Steinwald und Tor entlang einer Küste. — **Genshin Impact · Liyue** — Hafen, Terrasse, Gasthaus, Felder, Steinwald und Tor entlang einer Küste.

Genshin Impact · Inazuma — Sechs Inseln hinter einem Sturmring, und jede hat ihre eigene Aufgabe. — **Genshin Impact · Inazuma** — Sechs Inseln hinter einem Sturmring, und jede hat ihre eigene Aufgabe.

Jujutsu Kaisen · Tokyo Jujutsu High — Ein Campusplan mit sieben Pins: Halle, Wohnheim, Hof, Tor, Schrein, Lagerhaus und Straße. — **Jujutsu Kaisen · Tokyo Jujutsu High** — Ein Campusplan mit sieben Pins: Halle, Wohnheim, Hof, Tor, Schrein, Lagerhaus und Straße.

Jujutsu Kaisen · Shibuya — Bahnhof, Kreuzung, Turm, Brücke und Gassen – und am Rand der Vorhang. — **Jujutsu Kaisen · Shibuya** — Bahnhof, Kreuzung, Turm, Brücke und Gassen – und am Rand der Vorhang.

Ribcage · Die Bezirke — Eine Stadt im Inneren eines Brustkorbs – die Pins benennen die Organe, in denen sie lebt. — **Ribcage · Die Bezirke** — Eine Stadt im Inneren eines Brustkorbs – die Pins benennen die Organe, in denen sie lebt.

Ash Harbor · Die Nebelgrenze — Sieben Pins entlang einer zerklüfteten Küste, von der Gezeitenstraße bis zum Leuchtturm. — **Ash Harbor · Die Nebelgrenze** — Sieben Pins entlang einer zerklüfteten Küste, von der Gezeitenstraße bis zum Leuchtturm.

Ein Bild ist der Anfang. Die Orte dahinter sind die Welt.

Neta Studio ist ein KI-Weltenbaukasten – dieselbe Welt bewahrt die Karte, die Menschen, die dort leben, und die Szenen, die sich zwischen den Pins abspielen. Veröffentliche die Seite, entwickle sie als Kopie weiter oder füge derselben Karte immer neue Orte hinzu.

Pins, die fest auf dem Bild bleiben — Hotspots werden als Prozentwerte des Bildes gespeichert. So sitzt auf der Karte bei 900px am Schreibtisch alles genauso am richtigen Platz wie bei 390px in der Hand.
Eine Legende statt einer Koordinatentabelle — Jede Nummer hat einen Namen und eine kurze Zeile Text. Du musst nichts ausmessen und nichts von Hand in ein Area-Tag abtippen.
Eine fertige Seite zum Teilen — Die Karte wird als fertige Seite veröffentlicht, die du verschicken, einbetten oder in derselben Welt einfach weiterbauen kannst.

Fragen, bevor du loslegst

Was ist eine Image Map?

Ein Bild mit klickbaren Bereichen. In HTML besteht das aus einem Bild und einer Liste von Koordinaten-Flächen; hier entstehen das Bild und seine Hotspot-Ebene direkt zusammen, sodass ein Pin einen Namen und eine Beschreibung öffnet statt trockener Koordinaten.

Muss ich die Koordinaten selbst ausmessen?

Nein. Nenn einfach die Orte, und die Pins werden direkt dort platziert und als Prozentwerte des Bildes gespeichert. Falls mal einer eine Straße zu weit landet, sag einfach, welcher Pin wohin gehört, und er rückt an die richtige Stelle.

Kann ich mein eigenes Bild verwenden?

Ja. Häng einfach ein Foto, einen Grundriss, einen Screenshot oder ein Poster an und benenne die Orte darauf. Generierte Bilder sind nur deshalb der Standard, weil die meisten Karten auf einem leeren Blatt beginnen.

Schreibt das Tool auch den HTML-Code für die Map?

Es veröffentlicht eine Seite mit einer echten Hotspot-Ebene – inklusive Nummern, Beschriftungen und Links –, die mit dem Bild mitwächst. Wenn du die Karte in deine eigene Website einbauen willst, lass dir neben der Seite einfach das Hotspot-JSON und das Area-Markup ausgeben.

Kann ein Hotspot auf eine andere Seite verlinken?

Ja. Ein Pin kann ein kleines Infofeld öffnen, zu einem anderen Ort auf derselben Karte springen oder auf eine URL verweisen, die du ihm gibst.

Funktioniert das auch auf dem Handy?

Ja. Da die Koordinaten Prozentwerte sind, bleiben die Pins fest auf ihren Gebäuden, wenn die Karte kleiner wird. Die Infofelder öffnen sich dann als kleine Karte direkt beim Pin statt in einer Seitenleiste.

Was kann ich alles als Karte umsetzen?

Weltkarten, Spiel-Level, Campus- und Grundrisse, Sitzpläne, Produktdiagramme oder das Foto einer Straße. Alles, was ein Bild mit Orten darauf ist, kann auch Pins tragen.

Wie viele Hotspots sollte eine Karte haben?

Fünf bis acht sind ideal – genug, um nützlich zu sein, und wenig genug, damit man das Bild noch gut erkennt. Ein dichter Stadtplan verträgt auch zwölf, wenn die Pins nach Vierteln gruppiert sind.

Gib deiner nächsten Karte eine Ebene zum Anklicken.

Benenne die Orte ein einziges Mal. Das Bild, die Pins, die Legende und die fertige Seite kommen gemeinsam zurück.

Image Map erstellen