Cleane Silberne Navigation

1 | 7653 Aufrufe
Sie können diese Wikiseite nach der Anmeldung auf Webmasterpro bearbeiten. Helfen Sie mit und verbessern Sie "Cleane Silberne Navigation" mit Ihrem Wissen!

Anzeige Hier werben

Endergebnis

Bild zu Cleane Silberne Navigation
Finales Bild

Schritt 1: Los geht es!

Erstelle ein Neues Dokument mit den Maßen 500px x 200px. Fülle die Ebene mit einem radialen Farbverlauf (helles Grau [#45443f] / Dunkles Grau [#31302c]) Den erstellt man, indem man das "Verlaufswerkzeug" (Hotkey "G") auf Radialverlauf stellt. Vordergrundfarbe [#45443f] / Hintergrundfarbe [#31302c]. Diesen Verlauf nun von der Mitte nach rechts mittig ziehen, gegebenenfalls helfen zwei ausgerichtete Hilfslinien

Bild zu Cleane Silberne Navigation
Schritt 1

Schritt 2

Erstelle eine Neue Ebene.(Ebene -> Neu -> Ebene) und markiere das "Auswahlrechteck_Werkzeug" (Hotkey "M"). Stelle die Art auf "Feste Größe", dort gib 440px x 50px an. Diese Auswahl setzen wir nun mittig in die neue Ebene

Bild zu Cleane Silberne Navigation
Schritt 2

Schritt 3

Fülle diese Auswahl mit einem "Linearen Verlauf" #f4f4f4 und #d9d9d9 von oben nach unten

Bild zu Cleane Silberne Navigation
Schritt 3

Schritt 4:

Nun fügen wir der Ebene zwei Ebenenstile hinzu.

Ebene > Ebenenstile > Schlagschatten

Bild zu Cleane Silberne Navigation
Schritt 4.1

Ebene > Ebenenstile > Schein nach außen

Bild zu Cleane Silberne Navigation
Schritt 4.2
Ergebnis:
Bild zu Cleane Silberne Navigation
Schritt 4

Schritt 5

Nun benutzen wir das "Text Werkzeug" (Hotkey "T") und schreiben die Kategorien rein. Der Font "Verdana, Regular, Größe 13pt, Scharf, #686868 (und #ac0000 für ein Hover-Effekt).

Bild zu Cleane Silberne Navigation
Schritt 5

Schritt 6

Letztlich fügen wir noch zwei vertikale 1px-Streifen als Abgrenzung hinzu. Neue Ebene erstellen. Rechteckauswahl-Werkzeug mit der festen Größe von 1px x 50px. Damit machen wir eine Auswahl zwischen den Links. Nun füllen wir die Auswahl mit der Farbe [#b4b4b4]

Bild zu Cleane Silberne Navigation
Schritt 6

Schritt 7

Die Auswahl bleibt bestehen und wir verschieben sie nun 1px nach rechts. Ein mal dazu auf den Rechtspfeil Deiner Tastatur drücken. Diese Auswahl wird mit [#d9d9d9] gefüllt.

Bild zu Cleane Silberne Navigation
Schritt 7

Schritt 8

Zum Schluss kopieren wir die Ebene mit den Zwischenstreifen und schieben sie zwischen die anderen Elemente. Man kann die Streifen auch in der Transparenz auf 50% stellen. Dan stechen sie nicht so sehr ins Auge.

Das Ergebnis sieht wie folgt aus:

100%
Bild zu Cleane Silberne Navigation
Schritt 7.1
50%
Bild zu Cleane Silberne Navigation
Schritt 7.2

Hier könnt ihr die PSD-Datei runterladen 530.psd .


Wikiseite bearbeiten

Diese Seite kann von jedem registrierten Benutzer bearbeitet werden. Bisher haben 6 Personen an der Seite "Cleane Silberne Navigation" mitgewirkt.

Sie haben einen Fehler entdeckt oder möchten etwas ergänzen? Dann können Sie nach der Anmeldung "Cleane Silberne Navigation" hier bearbeiten.