Image-Map

Absatzvorlage zur Darstellung von Bildern mit definierbaren Bereichen zum Anklicken und Referenzieren von Links

  • Absatzvorlagen
    • Erweitert
      • Image-Map

Die Absatzvorlage ermöglicht eine Darstellung von Bildern mit definierbaren Bereichen zum Anklicken und Referenzieren von Links.

Beispielsweise könnten Sie in der nebenstehenden Grafik jedem Gebäude einen Link zuordnen, so dass beim Klicken auf das Gebäude der entsprechende Link geöffnet wird.

Ein Beispiel für eine mögliche Anwendung des Absatzes finden Sie hier (nur mit TU-Login)

Beispielvorschau der Absatzvorlage „Image-Map“

Image-Map

Überschrift
Geben Sie optional eine Überschrift für den Absatz ein. Sie wird größer und in der Hervorhebung Ihrer Webauftrittsfarbe dargestellt.

Image-Map
In diesem Bereich erstellen Sie ihre Image-Map.

Diese besteht aus einem Bild, das den Hintergrund bildet und verschiedenen in diesem Bild markierten Bereichen. Für jeden definierten Bereich kann ein Link angegeben werden. Klickt der Nutzer der Seiten später mit der Maus in einen solchen Bereich, so wird der mit diesem Bereich verbundene Link ausgeführt.

Vorgehensweise

  1. Zunächst wählen Sie über das Icon „Hintergrundbild auswählen“ ein Bild als Hintergrund der Imagemap aus Ihrem Medienbereich aus. Es ist wichtig, dass dieses Bild nicht breiter ist, als der vorhandene Platz auf der Seite.
    • Im Zentralbereich einer Seite mit Marginalienspalte dürfen dies maximal 529 Pixel (255 Pixel bei zweispaltigen Absätzen) sein.
    • Auf einer extrabreiten Seite ohne Marginalienspalte darf das Bild maximal 730 Pixel breit sein.
    • Wird die Image-Map in der Marginalienspalte platziert, so darf das Bild maximal 182 Pixel breit sein.
  2. Als zweiten Schritt definieren Sie die verschiedenen Bereiche zum Anklicken im Hintergrundbild. Diese Bereiche können als Rechteck, als Kreis oder als Vieleck definiert werden. Dazu verwenden Sie die drei Icons „Rechteck erzeugen“, „Kreis erzeugen“ oder „Vieleck erzeugen“.
    Beim Klicken auf „Rechteck erzeugen“ und „Kreis erzeugen“ wird der entsprechende Bereich im Hintergrundbild dargestellt und kann mit der Maus verschoben und/oder vergrößert/verkleinert werden.
    Beim Klicken auf „Vieleck erzeugen“ sind Sie im Eingabemodus für das Vieleck. Den ersten Punkt setzen Sie durch einen Doppelklick, die weiteren Punkte des Vielecks durch einfaches Klicken mit der linken Maustaste. Sind alle Punkte des Vielecks gesetzt, klicken Sie nochmals auf das Vielecke-Icon (das ist nun mit „Beendet den Polygonmodus“ beschriftet). Nach dem Beenden kann auch das Vieleck verschoben und/oder verzerrt werden.
    Nachdem die Eingaben gespeichert wurden, können die definierten Bereiche durch Anklicken und Auswahl des Icon „Objekt löschen“ wieder entfernt werden.
  3. Der dritte Schritt ordnet jedem der definierten Bereiche einen Link (Verweis) zu. Dazu wird der entsprechende Bereich angeklickt und anschließend das Icon „Verweis einfügen/bearbeiten“ gewählt. Wählen Sie die Art des Verweises aus:
    • Seiten- oder Dateireferenz (Referenz auf interne Seiten des Auftrittes in FirstSpirit)
    • URL (Referenz auf eine externe Seite im Internet)
    • Datensatz (Referenz auf einen ausgewählten Datensatz in einer Datenquelle des Webauftrittes)
    Tragen Sie den Verweis ein.
    Ist für einen Bereich bereits ein Verweis definiert, so kann dieser Verweis über das Icon „Verweis löschen“ wieder entfernt werden.

Beschriftung
Die Beschriftung erscheint unterhalb Ihrer Image-Map und kann beschreibend zu Ihrer Image-Map ausgefüllt werden.

Karteireiter „Image-Map“

Zugriff

Informationen hierzu entnehmen Sie bitte dem Artikel Zugriffsschutz für Absätze verwenden.