Design mit Photoshop in code verwandeln.

[anonymus]

Hallo leute,
ich habe das Design in Photoshop fertig.
Alle Unterseiten etc.
Nur ähm, wie gehts weiter?
Wie macht Ihr aus einem Design aus Photoshop
eine fertige Seite?
Wäre schön wenn mir jemand helfen könnte.


mfg anonymus

 

[threadi]

Du hast mehrere Möglichkeiten:
a) Du kannst die Seite von Photoshop slicen lassen. Der dabei entstandene Quellcode ist jedoch meist unbrauchbar und unübersichtlich.
b) Du erstellst eine HTML- sowie eine CSS-Datei per Hand mit einem Editor deiner Wahl. In diesen trägst Du das Grundgerüst für den HTML-Code ein. Dann fängst Du an die Seite von oben nach unten aufzubauen. Erst der Kopfbereich. Dazu schneidest Du aus der Photoshop-Datei wichtige Designelemente als Grafiken aus (PNG oder JPG) und bindest diese in dein CSS ein. Dann die anderen Bereiche. Je nachdem wie komplex dein Design ist und wie umfangreich deine HTML- und CSS-Kenntnisse sind kann das einige wenige Stunden bis einige Tage dauern.

 

[anonymus]

ok wunderbar threadi.
das bringt mich schonmal ein wenig weiter
um erstmal irgendwie zu beginnen.
Ich habe das Design mit PS gesliced.
den HTML Code habe ich gelöscht jedoch die
Bilder gelassen um diese einzubinden.
Ist das soweit richtig?

 

[threadi]

Die gesliceden Bilder kannst Du durchaus als Grundlage nehmen. Ob es aber auch inhaltlich das trifft was Du per HTML und CSS abbilden willst, ist fraglich. Z.B. würde ein einfarbiger Hintergrund als komplette Grafik erstellt werden, aber bei CSS braucht man quasi nur ein kleines Stück davon. Ich schneide die nötigen Bilder daher meist selbst manuell in Photoshop aus.