Eigene Homepage

[phoenix]

Erstelle ich via PS nun mein Layout, habe ich ja nur begrenzt Platz, quasi nur für die wichtigsten Hyperlinks später (Home, Gallery, Kontakt, Impressum...).

Eigentlich designst Du in Photoshop nur Elemente. Du baust da keine komplette Webseite. Das kannst Du natürlich, um dem Brainstorming ein Gesicht zu geben, aber nötig ist es nicht. Die einzelnen Bereiche, deren Grösse und Aussehen (sowie natürlich auch der Inhalt), wird alles über die programmierung festgelegt. Natürlich kannst Du Bildschnippsel die Du in PS vorbereitet hast (die angesprochenen Elemente) mit zur Formatierung in CSS einsetzen. Aber Du designst nicht einen Content-Hintergrund in z.B. 600x1500 und slicest das dann. Ja das geht zwar, aber das ist dann so die Seifenkiste, während Du links und rechts von fitten Füssgängern und Sportboliden überholt wirst.

Die "Willkommen"-Rubrik mit dem Einleitungstext, welche Zeile ist dies genau in der Codierung?

Nutze die Entwicklerkonsole in Deinem Browser. In Opera z.B. ist das Dragonfly, mit einem Rechtsklick "Element untersuchen" wird sie aufgerufen. Danach kannst Du in der Webseite jedes Element anklicken und die Konsole zeigt Dir die Informationen dazu wie HTML und CSS Code.

In diesem Fall:

<div id="side_h1">Willkommen</div>
<div id="side_text">Ich begrüße euch auf meiner kleinen Grafik-Seite. Ihr könnt hier Wallpaper, Signaturen, Icons, Layouts und vieles mehr finden. Viel Spaß beim Umschauen!</div>

Um auf den Punkt zu kommen. Ich lese heraus, das die Grundlagen fehlen. Ich vermute das Du zum besten Ergebnis kommst, wenn Du ein fertiges Template einsetzt. Um eine Webseite wie die gezeigte zu bauen, müssen die Grundlagen sitzen und etwas fortgeschrittenen Wissen schadet auch nicht. Kann man sich aber alles aneignen, Übung macht den Meister.

Die gezeigte Webseite besteht grob gesagt aus 2 Teilen. In HTML sieht das dann in etwa so aus (extrem vereinfacht):

<div id="ganze seite">
    <div id="linke seite">
    </div>
    <div id="rechte seite">
    </div>
</div>

Und mit CSS wird es in die passende Form gebracht.