Verschiedene Hyperlinks IM Bild

Computer: Software & Programmierung HTML & CSS
#1

Hallo liebe Leute,

ich habe ein Problem.

Für meine Homepage würde ich gern ein Menü erstellen. Das ganze soll folgendermaßen aufgebaut sein:

Ein Bild > http://img266.imageshack.us/img266/6258/unbenannt1ei…

In diesem Bild sollen die verschiedenen Menü-Punkte zu finden sein.

> http://img159.imageshack.us/img159/2769/hlift7.jpg

Man soll dann also auf Home - Links - Infos usw. klicken können und zu den verschiedenen Unterseiten weitergeleitet werden.

Das ganze Bild-Bearbeitungszeug mach ich mit
Ulead Photo Impact und
Photoshop CS2

Nun weiß ich nicht, in welchem Format ich das Bild speichern muss, damit man auf die Hyperlinks klicken kann.

Wenn ich das Bild normal abspeicher, kann man die Hyperlinks nicht anklicken.

Ich habe auch schon probiert, in Frontpage in das Bild zu schreiben. Sprich: Die Hyperlinks mit Frontpage zu machen.

Aber das geht auch nicht.

Bin wirklich ratlos.
Ich hoffe, ihr könnt mir helfen.

Vielen Dank !

#2

Image Mapping
Hallo Anna!

Damit man beim Klicken auf verschiedene Bereiche des Bildes zu verschiedenen Seiten gelangt, musst du das Bild mappen. Dazu musst du nach dem Image-Tag, mit dem Du das Bild einfügst, ein Map-Tag setzen und darunter die einzelnen Bereiche des Bildes als geometrsiche Formen beschreiben und Angeben, auf welche Seite sie verlinken.
Wie dies genau funktioniert ist unter anderem hier beschrieben: http://www.echoecho.com/htmllinks07.htm

Viele Grüße
Falk

#3

Wie mein Kollege unten schon schrieb, eine möglichkeit ist ein image map.

eine andere möglichkeit ist es in Photoshop ein slice tool zu nehmen und alle Felder die klickbar sein sollen zu slicen , das geht dann aber nur 4eckig.
Dann „Für Webseite Speichern“ und da als gif oder jpg jenachdem wie gross die fläsche ist.

Photoshop generiert dir nun eine Tabelle wo du dann manuel
bei jedem image slice ein Link setzten muss
ala

das schöne daran ist das ein nettes menu mit wechsel Graphik Button realisiert werden kann ohne auf goile graphische Texteffekte zu verzsichten. (Animierte ifs Gehen auch :smile:

#4

Hallo,

zusätzlich zu meinen „Vorschreibern“ will ich noch auf eine Möglichkeit hinweisen: Mit SVG (Scalable Vector Graphics) geht das auch direkt im Bild. Allerdings ist die SVG-Unterstützung vom Firefox noch lückenhaft, IE 6 kann es meines Wissens nach gar nicht.
Also nicht unbendingt die beste Möglichkeit für den Praxiseinsatz, aber technisch sauberer als alles andere :wink:

Grüße,
Moritz