Antworten auf deine Fragen:
Neues Thema erstellen

Navigationbar

Mr_BIG1893

Bildchenmacher

Hallo zusammen,

Ich möchte eine Website ins Leben rufen, mit diesem Design



Ich habe noch nicht allzuviel Erfahrung mit Webdesign, aber ich hoffe ich kriege das doch in etwa so hin, wie ich das gerne möchte.

Ich versuche mal zu beschreiben wie ich es vorhabe zu machen und wäre dann froh wenn ihr mir sagt, ob es so umsetztbar ist.

Also, das Grunddesign steht ja, das wurde im Photoshop gemacht.
Jetzt dachte ich mir, ich Slice das ganze und importiere es dann in Dreamweaver.

Soweit so gut. Ich hoffe das geht doch so oder? Ist ja eigentlich ziemlich einfach.

Jetzt hab ich nur noch eine Frage.

Krieg ich das hin, dass die Navileiste einen Rollover Effekt bekommt und Trotzdem die spezielle Schrift behalten kann?

Wenn ja, könnte mir villeicht jemand sagen wie?
Meine Idee war, die einzelnen Slices der Navileiste zu kopieren Ihnen den ensprechenden "Rollovereffekt" zu geben (zum Beispiel einen Innerglow) und dann per Dreamweaver dem "Original Navileistenbild" das "Rollover Navileistenbild" als Rollovereffekt hinzuzufügen.
 

AW: Navigationbar

Hallo zusammen,

Ich möchte eine Website ins Leben rufen, mit diesem Design



Ich habe noch nicht allzuviel Erfahrung mit Webdesign, aber ich hoffe ich kriege das doch in etwa so hin, wie ich das gerne möchte.

Ich versuche mal zu beschreiben wie ich es vorhabe zu machen und wäre dann froh wenn ihr mir sagt, ob es so umsetztbar ist.

Also, das Grunddesign steht ja, das wurde im Photoshop gemacht.
Jetzt dachte ich mir, ich Slice das ganze und importiere es dann in Dreamweaver.

Soweit so gut. Ich hoffe das geht doch so oder? Ist ja eigentlich ziemlich einfach.

Jetzt hab ich nur noch eine Frage.

Krieg ich das hin, dass die Navileiste einen Rollover Effekt bekommt und Trotzdem die spezielle Schrift behalten kann?

Wenn ja, könnte mir villeicht jemand sagen wie?
Meine Idee war, die einzelnen Slices der Navileiste zu kopieren Ihnen den ensprechenden "Rollovereffekt" zu geben (zum Beispiel einen Innerglow) und dann per Dreamweaver dem "Original Navileistenbild" das "Rollover Navileistenbild" als Rollovereffekt hinzuzufügen.



Vielleicht hilft dir das weiter, wenn du nicht nur den text markierst, und die Glanzebene etwas in der deckkraft senkst ;)
 
AW: Navigationbar

Villeicht steh ich grad auf der Leitung....
Aber ich verstehe im Moment nicht, was das mit meinem Problem zu tun hat
 
AW: Navigationbar

Es hieß ja, ob du diesen Effekt bekommsz und die Schriftart erhalten bleibt.

So macht man es. Diese als GIF einzeln speichern und in die css / html - datei einfügen
 
AW: Navigationbar

Achso wir haben warscheindlich von zwei verschiedenen Sachen geredet.

Ich meinte den Rollovereffekt, wie zu Beispiel hier in der Navileiste.

also nicht ein Rollover im Text an und für sich.
 
AW: Navigationbar

Das obere Menü ist ganz einfach.
Es ist per CSS erstellt: (ID "navBar") es ist nur ein Hintergrundgrafik die nach links und rechts verschoben wird.


Die Schrift ist über eine Liste erzeugt.

Code:
<div id="navBar">
    	  <ul>
    	    <li><a href="../">HOME</a></li>
  	        <li><a href="tutorials/">TUTORIALS</a></li>
    	    <li><a href="contact/">CONTACT</a></li>
            <li><a href="resources/about">ABOUT ME</a></li>
    	    <li><a href="resources/">RESOURCES</a></li>
            <li><a href="buying/">BUY VIDEO</a></li>
    	  </ul>
        </div>
 
AW: Navigationbar

ich würde vorschlagen ein zweites Bild zu machen. Dieses mit einer helleren Menüleiste zu erstellen und diese da genauso zuzuschneiden wie das normale Bild. so könntest du per hover effekt des zweite einblenden, wenn man mit der Maus drüberfährt

Gruß Kronod
 
AW: Navigationbar

Das obere Menü ist ganz einfach.
Es ist per CSS erstellt: (ID "navBar") es ist nur ein Hintergrundgrafik die nach links und rechts verschoben wird.


Die Schrift ist über eine Liste erzeugt.

Code:
<div id="navBar">
          <ul>
            <li><a href="../">HOME</a></li>
              <li><a href="tutorials/">TUTORIALS</a></li>
            <li><a href="contact/">CONTACT</a></li>
            <li><a href="resources/about">ABOUT ME</a></li>
            <li><a href="resources/">RESOURCES</a></li>
            <li><a href="buying/">BUY VIDEO</a></li>
          </ul>
        </div>

Das klingt nach einer sauberen Lösung, nur weiss ich nicht wie das mit der Liste geht... aber das ginge warscheindlich zu weit das zu erklären nehm ich an


ich würde vorschlagen ein zweites Bild zu machen. Dieses mit einer helleren Menüleiste zu erstellen und diese da genauso zuzuschneiden wie das normale Bild. so könntest du per hover effekt des zweite einblenden, wenn man mit der Maus drüberfährt

Gruß Kronod

Das wäre glaube ich ziemlich genau dass was ich gemeint habe, nur nicht ganz so kompliziert ausgedückt ;)
 
Zuletzt bearbeitet:
AW: Navigationbar

Hey,
kurzer Ratschlag: Das ist in PS schön kreiert. Aber bitte, bitte nimm nicht einfach die Slice-Funktion und erstelle daraus eine Webseite! Arbeite Dich erstmal ein bisschen in CSS und HTML ein, damit kannst Du den Menueeffekt genauso realisieren, und nebenbei Deine Seite weiter in Richtung SEO, Dateigröße und Features optimieren.
 
AW: Navigationbar

Habe die 2 Bildervariante genommen, gefällt mir sehr gut.

Hier seht ihr was draus geworden ist:

Vielen Dank

Leider ergab sich ein nächstes Problem :(
 
AW: Navigationbar

.. ich find das Menue auf der Seite zu groß. Etwas kleiner wirkt das nochmal mehr professioneller. Und zu Deinem Problem wg. zerreissen.. hatte ich ja angesprochen, nicht einfach exportieren.. hehe ;)
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.875
Beiträge
1.539.652
Mitglieder
67.887
Neuestes Mitglied
PapiMicky
Oben