So verknüpfen Sie ein Bild mit einer URL in Illustrator

Adobe Illustrator ist möglicherweise nicht die erste Software, die Ihnen bei der Planung von Webdesign-Aufgaben in den Sinn kommt, obwohl Sie sie möglicherweise zum Erstellen von Elementen für die Online-Verwendung verwendet haben. Illustrator bietet die Möglichkeit, Bildkarten zu erstellen, die Grafiken mit Online-Zielen verknüpfen. Sie können zwar in Illustrator auch geschnittene Grafiken mit URLs verknüpfen, Imagemaps bieten jedoch den Vorteil, dass sie unregelmäßig geformte Grafiken beibehalten und ihre Gesamtheit mit einer URL oder verschiedenen Teilen davon mit mehreren separaten URLs verknüpfen.

1

Wählen Sie "Attribute" aus dem Menü "Fenster", um das Fenster "Attribute" zu öffnen, falls es noch nicht sichtbar ist. Wenn Sie nicht festgelegt haben, dass das Attributbedienfeld die Optionen für die Bildzuordnung anzeigt, öffnen Sie das Flyout-Menü in der rechten oberen Ecke des Bedienfelds und wählen Sie "Alle anzeigen", um sie anzuzeigen.

2

Wählen Sie das Auswahlwerkzeug aus der Adobe Illustrator-Toolbox. Klicken Sie auf das Grafikelement, das Sie in eine Imagemap umwandeln möchten, oder klicken Sie auf ein Bild. Wählen Sie nur einen Teil Ihrer Grafik aus, um den Bereich zu begrenzen, auf den der Webbesucher klicken kann, um diese bestimmte URL zu laden. Wählen Sie die gesamte Grafik aus, um die gesamte Grafik in eine Image-Map mit einer einzelnen URL umzuwandeln.

3.

Überprüfen Sie im Menü Objekt, ob Ihre Grafik gruppierte Elemente enthält. Wenn dies der Fall ist, erscheint die Option "Gruppierung aufheben" aktiv. Wenn dies nicht der Fall ist, wird die Option ausgegraut. Gruppieren Sie keine gruppierten Elemente, oder Illustrator speichert den HTML-Code für Ihre Imagemap nicht ordnungsgemäß.

4

Setzen Sie das Dropdown-Menü "Imagemap" des Attributebereichs auf "Polygon", damit Ihre Imagemap den Konturen Ihres Bildmaterials folgt. Wenn Ihre Grafik rechteckig ist, verwenden Sie stattdessen die Einstellung "Rechteck".

5

Geben Sie eine Webadresse ein oder fügen Sie sie in das Feld "URL" des Attributebereichs ein, entweder eine vollständige oder eine relative Adresse. Überprüfen Sie Ihre Arbeit, indem Sie auf die Schaltfläche "Browser" klicken, um ein Browserfenster zu öffnen und das eingegebene Ziel anzuzeigen. Wenn Sie anstelle der gewünschten Seite eine Fehlermeldung erhalten oder ein unerwartetes Ziel erreichen, überprüfen Sie die URL in Illustrator erneut auf Genauigkeit.

Tipps

  • Speichern Sie Ihre Grafik mithilfe des Dialogfelds "Für Web speichern" anstelle der regulären Optionen zum Speichern von Dateien. Stellen Sie sicher, dass Sie "HTML and Images" als Format für Ihre Ausgabe wählen, damit Adobe Illustrator Ihren Image-Map-Code in eine HTML-Datei schreibt, die Ihrer Grafik beiliegt.
  • Wenn Sie die Image-Map-URL durch das Attributfenster testen, wird Ihr Standard-Webbrowser gestartet, wenn die Software nicht bereits ausgeführt wird.

Warnung

  • Fügen Sie den Bildern, die Sie als Imagemaps verwenden möchten, keine interaktiven Funktionen wie Rollover oder Animationen hinzu, da diese Funktionen zu unerwarteten Ergebnissen in Webbrowsern führen können.

Empfohlen