Design aufbauen - aber wie?

[ganjaman41]

Heyho,
also habe leider keinen Anhaltspunkt, wonach ich suchen soll.
Ich habe ein fertiges Design (ein Bild) und möchte nun darüber Text, Links und nen Header legen. Das ganze soll möglichst in HTML oder PHP geschehen.
Ich habe euch mal eine Skizze gemacht, wie ich mir das vorgestellt hatte, hoffe sie schafft ein wenig Klarheit:
http://imageshack.us/m/688/2372/skizzem.jpg

Am besten wäre es, wenn ihr mir einfach ein Link für ein Tutorial geben könnt, oder selbst kurz erläutert, wie ich das anstelle.

Vielen Dank im Voraus.

LG ganjaman41

[mrjerk]

Hallo,
Aus Deinem Post ist schwierig zu entnehmen, wie fit Du in HTML oder CSS bist, aber ich versuche mal einen ersten Ansatz, auf die Gefahr hin, Dir Sachen zu erzählen, Die Du vielleicht schon weißt.

Zunächst: Kennst Du CSS?
Wenn nicht, solltest Du Dich damit als erstes beschäftigen. Mit CSS machst Du dem Browser sozusagen einen Vorschlag, wie er bestimmte Dinge darstellen soll - z.b. kannst Du in HTML einen Bereich definieren, in dem Deine Navigation untergebracht ist, und über CSS sagst Du dem Browser, dass er diesen Bereich links neben dem Haupt-Inhalt darstellen soll - nur so als Beispiel. Es geht aber auch noch mehr. Du kannst für jedes HTML-Element das Aussehen bestimmen, oder nur für ganz bestimmte HTML-Elemente oder....

Wichtig ist zu wissen, dass CSS nur "Vorschläge" zur Darstellung macht - denn ein Benutzer kann das auch verändern (zum Beispiel, weil er eine größere Schrift haben will) oder gar ganz abschalten. Auch interpretieren die Browser leider diese "Vorschläge" bisweilen recht eigenwillig.

Soweit so gut. Der nächste Schritt wäre die Grobstruktur Deiner Seite. Deine Skizze zeigt, dass es sich um ein klassiches 2-Spalten-Layout mit einer Kopfzeile handelt. Dies lässt sich einfach mit CSS umsetzen - lies am besten hierzu den Selfhtml-artikel über mehrspaltige Layouts.

Damit müsstest Du die erste Grobstruktur Deiner Seite mit HTML/CSS aufbauen können.
Jetzt kommen die verschiedenen Elemente Deiner Seite - diese soltltest Du dir im Vorfeld überlegen, also z.b.:

• Wieviele Überschriften/Unterüberschriften/Unter-Unter-Überschriften
    werde ich haben? Wie sollen die aussehen?
• Welche Menu-Strukturen brauche ich?
• Gibt es Elemente/Formatierungen, die ich immer wieder brauche?
• Welche Elemente kann ich mit HTML+CSS zusammenbauen, für was brauche ich Grafiken?
  usw.

Evtl. hilft es hierzu, sich das mal aufzumalen (ggf. auch in einem Grafikprogramm, z.b. Photoshop oder GIMP, falls Du diese beherrschst).

Wenn Du weißt, was Du so brauchst, kannst Du anfangen, mit CSS die Elemente so zu formatieren wie Du sie haben willst. Ein Patentrezept gibt es hierfür nicht, nur ein paar Tipps:

• DRY: Don't repeat yourself: Gleiche Elemente sollten an einer zentralen
    Stelle im CSS definiert sein
• Nutze Grafiken nur dort, wo es nötig und sinnvoll ist.
• Versuche, ähnliche Elemente zu vereinheitlichen
  ...

Ich hoffe, das reicht Dir als Anhaltspunkt, um weiter zu suchen und Dich schlau zu machen...und wenns noch Fragen gibt, bist Du hier im Forum ja gut aufgehoben.

Viele Grüße,
Jörg

PS: Es mag Dir in den Sinn kommen, Dein zweispaltiges Layout einfach mit Frames zu gestalten, weil das so verführerisch einfach aussieht. Ein guter Rat: Tu es nicht! Frames machen zu 99,9% Probleme, und Du wirst Dich nachher ärgern. Mach das gleich von Anfang an mit CSS, und Du wirst länger Freude an Deiner Seite haben.