Homepage erstellen mit Photoshop CS

Hallo,

Das einzige, was einen hier abschreckt, ist die Art und Weise und mit welcher
Selbstverständlichkeit hier die Frage gestellt und im Verlauf der Diskussion
argumentiert wurde. Wir sind nicht dazu da, die Leute an die Hand zu nehmen
und jeden Schritt vorzukauen, sondern um sie in die richtige Richtung zu stubsen.

Und wenn man sieht, dass ein User sich nicht den Hauch einer Mühe gibt,
etwas Eigeninitiative zu zeigen, bekommt er (zumindest von meiner Seite
her) keine weitere Unterstützung.

Vergleiche hierzu auch Dr Soongs Blogpost.

In diesem Sinne
Markus
 
Wir legen hier auch grossen Wert auf Eigeninitiative.
Kleiner Auszug aus der Netiquette:

Ok, diesen Auszug kenne ich, auch aus anderen Foren in gleicher oder ähnlicher Art, und finde es auch in Ordnung.
Nur wenn einem die Frage nicht gefällt, weil eben ein User zu "faul" ist die Suchfunktion zu nutzen, sollte Mann/Frau sich eben eine Antwort verkneifen, anstatt den User "anzumachen".
Wie gesagt ich bin in einigen Fotoforen unterwegs, auch mich nerven die immer wieder gleichen Fragen, reagiere dann aber nicht darauf, heist schreibe nichts dazu. Das finde ich immer noch besser als einen User "anzugreifen", ist auch besser für den Hausfrieden.:)
 
Moin,

Sagt mal ist das die Art und Weise neue Besucher die einfache Fragen haben zu begrüssen?

Ich bin eigendlich nur durch Zufall auf diesen Thread gestossen, und fand es von allen Beteiligten eine Unverschämtheit, eine zwar durchaus einfach zu beantwortende Frage nicht zu beantworten! Thema verfehlt, setzen, sechs! Allesamt!

Wieso hocken in so vielen Foren schreibfaule Semiprofis die auf Fragen antworten ohne was zu beantworten? Das frag ich mich in letzter Zeit immer wieder, diese Tendenz die User selber suchen zu lassen oder gegen die Wand latschen zu lassen, find ich voll mistig Ist das kollegial - nein! Ihr habt alle mal klein angefangen und ich verwette meinen Arshc, das Ihr genauso dämliche Fragen gestellt habt! Wenn Ihr alle nur auf Google oder die Suche verweisen könnt ohne inhaltlilch auch eine Lösung zur Hand zu haben dann behaltet diese wertlosen Kommentare doch einfach für Euch.

Wer helfen will der hilft, und wenn zum 100. Mal die selbe Frage beantwortet wird. Es muss doch nicht ständig das Rad neu erfunden werden...
---

So aber nun zum Thema:
Such selbst :D

Nein Spass beiseite, also wie fang ich am besten an...

Du solltest für den Anfang schonmal die Grundzüge von PS kennen, und die wichtigsten Werzeuge beherrschen. Davon gehe ich jetzt mal einfach aus, weil sonst kann ich Dir auch nicht weiterhelfen ;)

Mache am besten einen Screenshot deines laufenden Browsers, und schmeiss den Screen in ein neues Dokument in PS. Mit Hilfe des Freistellwerkzeuges schnippelst Du nun die Browserelemte (Scrollbalken, Adress- und Tableiste) und OS-Elemente (Taskleiste, Dock) ab, und hast somit die reine Fläche zu Anzeige deiner Seite.
Mit Hilfe von "Bild skalieren" rundest die Breite ein wenig ab.
(Bei mir sind es aufn 15" TFT etwa 950 Pixel in der Breite, dies kann aber je nach Bildschirmgrösse varieren, und je nachdem ob man eine statische Seite oder eine in der Breite dynamische Seite plant sollten einem die Vor-und Nachteile der beiden Lösungen bekannt sein. Das würde jetzt aber zu weit gehen.)

Die Höhe ist erstmal egal, sollte aber ausreichend sein, als Nominalwert nehmen wir aber mal 1000 Pixel. Da haben wir erstmal genügend Platz.

Den Rest des Screenshot kannste nun einfach löschen oder mit einer Farbe deiner Wahl füllen. Alternativ lösch die Ebene und erstell ein Neue leere.

Nun mach einfach mal 4 Rechtecke in beliebiger Farbe, (Header, Navi,. Main, Footer)
Diese Rechtecke werden später deine grafischen Hintergründe für die Content-tragenden Elemente auf deiner HTML-Seite. Nun hast Du du in Photoshop ein Dokument mit 4 einfachen Boxen die später den Inhalt enthalten sollen. nun musst Du nur noch das Slice-Werkzeug gebrauchen und die Boxen vernünftig in Teile schneiden, stelle es Dir einfach wie ein Puzzle vor, das Du erst auseinandernehmen musst um es wieder zusammen zu setzen.
Denke bei der Erstellung der Seite in Photoshop an später zu nutzenden Platz, (für Banner, Text, und Bilder, dynamische Elemente, diese Slices brauchst du nicht als Bild exportieren da ja eh was anderes den leeren Platz ersetzt.)

Wie jetzt daraus eine HTML-Seite machen?
Es gibt dafür 2 Wege, den einfachen und den nicht so einfachen ;)

Der einfache Weg: (Nicht zu empfehlen, aber für schnelle Ergebnisse ok)
"Male" deine Seite so wie du sie haben willst, inkl Text, exportier sie als HTML mit Tabellen und alles ist gut.

Der nicht so einfache Weg:
Öffne Dreamweaver oder ein vergleichbares Tool, und bereite eine neues Projekt vor.
In PS speicherst Du deine soeben erstellten Slices, speicherst alles und fügst sie als Hintergrund in deine HTML-Umgebung ein. Sobald das Grafische Gerüst in Dreamweaver steht, beginnst damit den Content ein zu fügen.

So Sorry, wir sind zwar noch längst nicht am Ende, aber ich denk das es für den Anfang
schonmmal weiterhilft. Ich hab dafür noch ein paar Links für Dich gesucht, die musste aber selber durchlesen, es sei denn du hast nen Screenreader ;)

Gruß,
Fanthom

---
Weiterführende Links bitte lesen, sonst nix lernen: ;)

How to Slice?:
Slice 1
Slice 2

How can I use Photoshop for the Web?
Photshop-Webdesign 1
Photoshop-Webdesign 2
Photoshop-Webdesign 3

Forenbeiträge:
Photoshop-Webdesign
 
Zuletzt bearbeitet:
  • Gefällt mir
Reaktionen: ink

Neue Beiträge

Zurück