Erstellen von Bildlinks und Bildkarten
Die Antwort dieser Woche ist eine Antwort auf eine Leserfrage: „Können Sie erklären, wie ein Bild mit einer Seite in HTML verknüpft wird?“. Es gibt verschiedene Techniken, die Sie für verknüpfte Bilder verwenden können. Eine besteht darin, das gesamte Bild mit Ihrem HTML-Code zu verknüpfen, und die andere darin, eine Imagemap zu erstellen, bei der verschiedene Teile desselben Bildes mit unterschiedlichen Positionen verknüpft sind.

Verknüpftes Bild in HTML

Das Verknüpfen eines kleinen Bilds oder Symbols ist sehr einfach. Sie müssen lediglich Ihren Bildlink wie folgt in den Hyperlink einfügen:



Alles, was ich hier getan habe, war, das Bild in den HTML-Code für den Link einzuschließen. Dies ist die einfachste und effektivste Methode zum Verknüpfen eines kleinen Bilds und wird häufig mit benutzerdefinierten Aufzählungszeichen, Symbolen usw. durchgeführt. Was ist jedoch, wenn ein großes Bild mit mehreren verschiedenen Stellen verknüpft werden soll? Hier bietet sich das Schneiden von Bildern an.

Bildschneiden in Photoshop

Dies ist in Photoshop sehr einfach zu erreichen. Sie sollten ein Bild verwenden, das nicht allzu kompliziert ist, da Ihre Benutzer sehen sollen, wo sie klar auf das Bild klicken müssen. Sie möchten auch sicherstellen, dass Ihre Benutzer verstehen, dass sie in das Bild klicken müssen, um zu ihrem Ziel zu gelangen. Entwickeln Sie Image Maps sorgfältig für Ihren Benutzer. Beachten Sie, dass Image Maps normalerweise nicht so suchmaschinenfreundlich sind wie Text auf einer Seite. Die ordnungsgemäße Verwendung von Alt-Tags in Ihren Image-Slices kann jedoch dabei helfen.

Sobald Ihr Bild erstellt ist, besteht der nächste Schritt darin, Ihr Bild in Scheiben zu schneiden. Das Slice-Tool-Symbol sieht aus wie ein kleines Exacto-Messer. Es befindet sich oben in der Symbolleiste und unter dem Zuschneidewerkzeug. Wenn Sie auf das Symbol „Zuschneiden“ klicken, werden die Werkzeuge „Slice“ und „Slice Selector“ angezeigt.

Wählen Sie das Slice-Werkzeug aus, halten Sie die linke Maustaste gedrückt und ziehen Sie das Slice vorsichtig an die gewünschte Stelle. Lassen Sie es dann los. Fahren Sie fort und schneiden Sie das gesamte Bild weiter. Um jeden Bereich des Bildes, den Sie mit einer anderen Seite verknüpfen möchten, sollte ein Slice vorhanden sein. Jeder große weiße Bereich kann eine Scheibe sein.

Nachdem Ihr Bild vollständig in Scheiben geschnitten wurde, müssen Sie im nächsten Schritt das Werkzeug „Slice-Auswahl“ verwenden, auf jedes Slice klicken und von dort aus den Slice-Typ „Bild“ auswählen. Geben Sie darunter die URL ein, an die dieses Slice gerichtet werden soll, gefolgt vom Alt-Tag-Feld unten. Die anderen Felder sind für eine einfache Bildzuordnung nicht erforderlich. Bewegen Sie sich auf die gleiche Weise durch jedes Segment, bis das gesamte Bild zugeordnet ist.

Sobald Ihr gesamtes Bild fertig ist, verwenden Sie die Option "Für Web und Geräte speichern". Wenn Sie oben auf "Datei" klicken und unter den typischen Speicheroptionen nach unten schauen, wird die Option zum Speichern für Web und Geräte angezeigt. Wenn Sie diese Option auswählen, wird ein Dialogfeld geöffnet, in dem Sie eine Vorschau Ihres Bildes anzeigen können. Wenn Sie damit zufrieden sind, klicken Sie auf die Schaltfläche Speichern. Ein weiteres Dialogfeld wird geöffnet. Stellen Sie sicher, dass die zweite Option "Bilder und HTML speichern" lautet, und speichern Sie dann Ihre Arbeit.

Gehen Sie zu Ihrem Ordner, in dem Sie das HTML-Dokument gespeichert haben, und öffnen Sie es. Sie können diesen Code kopieren und in Ihre eigene HTML-Datei einfügen. Normalerweise ist dieser HTML-Code etwas schlampig. Wenn Sie sich mit HTML auskennen, können Sie es nach Ihren Wünschen bereinigen, aber es sollte einwandfrei funktionieren. Stellen Sie wie immer sicher, dass sich Ihre Bilddateien usw. an den richtigen Speicherorten befinden, da Ihr Bild sonst nicht angezeigt wird.

Video-Anleitungen: Wie macht man eigene Bilder in Minecraft | Minecraft eigene Bilder erstellen (April 2024).