Webdesign in Photoshop

B

berit

Grünschnabel
Hallo zusammen,
ich lerne an der Uni gerade Dreamweaver und da es mir manchmal etwas schnell geht, habe ich ein paar zusätzliche Fragen. Mir sind wichtige, grundlegende Schritte noch nicht ganz klar. Ich nummerier die Fragen mal, denn dann ist es etwas übersichtlicher...

1. Wenn ich mein Layout in Photoshop baue, welche Maße würdet ihr mir empfehlen zu nehmen? (Meine Website soll auf User mit einer Auflösung von 1024 x 768 ausgerichtet sein)

2. Wenn ich alle Elemente meines Designs 'gesliced' habe, wie speicher ich diese am besten ab? Sollte ich alles zuvor in Photoshop designen oder ist es auch okay/professionel, wenn ich einige Bilder erst in Dreamweaver als Hintergrund hinzufüge?

3. Wenn ich mouse-over effekte usw. haben möchte, mache ich diese schon in ImageReady oder mit CSS in Dreamweaver?

Das war es fürs Erste an Fragen... Vielleicht sind sie etwas ungewöhnlich, aber da wir in dem Kurs schon Mitten in der CSS Phase stecken, kann ich nun wohl nicht mehr fragen, wie ich das Design in Photoshop mache, denn das sollte ich schon fast fertig haben ;)
 
ad 1)
1024x768 ist Standard, aber berücksichtige auch andere Auflösungen (1200, 1600 etc.). Wenn die Seite mit prozentualen Angaben bzgl. height und dergleichen aufgebaut ist, passt sich das Ganze ohnehin von selbst an.

Ist die Seite allerdings mit fixen Größen designt, kann eine einfache Auflösungsweiche via Javascript (z.B. hier von con-f-use beschrieben) Wunder wirken.

ad 2)
Ich bevorzuge das vorherige Slicen und das Anpassen des CSS an die Grafik- nicht umgekehrt. Mit einer sorgfältigen Designphase solltest du das ohne Probleme bewerkstelligen.

ad 3) Wenn der mouse-over per Grafiken passieren soll, erstellst du die Effekte im Grafikprogramm (z.B. button.png, button_hover_png) und bindest sie über die Klassen im CSS ein. Wenn der mouse-over textbasiert ist, wäre das Ganze ohnehin klar.

Hoffe, das hilft ein wenig.
 
Also, schon mal Danke für die Antworten zu 2. und 3., aber zu 1. habe ich jetzt noch mal eine Frage.
Mir ist noch nicht ganz klar, wie ich das mit den verschiedenen Größen/Auflösungen berücksichtige... ich dachte einfach daran, da ich einen farbigen Hintergrund habe, dass der breiter oder schmaler ist ?! Könntest du mir ansonsten kurz sagen, wie ich die Seite mit prozentualen Angaben aufbaue? Super wäre, wenn nur in der höhe gescrollt werden muss.

danke!
 
Ist ja toll, dass ihr gleich anfangt Websites zu erstellen, ohne vorher die Grundlagen durchzugehen ;)

Aber im Allgemeinen reicht es, die Website auf eine Breite von 1024px in der Breite zu optimieren. Üblicherweise nimmt man in dem Fall m.E.n. eine maximale Breite zwischen 900 und 960px (die Scrollbar des Browsers braucht ja auch ihren Platz). Probleme gibt es dann natürlich bei Leuten die - immer noch - eine niedrigere Auflösung nutzen (müssen). Aber der Anteil ist mittlerweile sicher zu vernachlässigen. Die Höhe der Website spielt dabei auch keine so große Rolle. Scrollen in der Vertikalen ist allgemein üblich, Scrollen in der Horizontalen allerdings ein Tabu. Außer es wird als Stilmittel eingesetzt :)

Was deine Frage betrifft willst du ein Liquid-Layout. Die Struktur gleicht dabei exakt der eines Layouts mit festen Größenangaben (üblicherweise in Pixeln angegeben), nur dass diese beim Liquid-Design in Prozent angegeben werden.

Tutorials und Beispiele findest du sicher hier auf tutorials.de Weitere Quellen wären z.B.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück