• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

[Editor] Schlichtes Layout

Status
Für weitere Antworten geschlossen.

gola-noga

Neues Mitglied
Aloha!

Ich habe ein sehr schlichtes Layout erstellt. Würde mich über Anregungen, Kritik und Verbesserungsvorschläge freuen.

Mich würde interresierenwie ihr meinen Code und das "design" bewertet..

LINK
 
Werbung:
Also...

Als erstes muss ich sagen, dass mir der Hintergrund in dieser dezenten Weise gut gefällt. Der Rahmen des Wrappers in dem schwarz wirkt dann allerdings etwas zu hart. Vielleicht wäre hier ein Grauton oder eine andere Farbe besser.
Das Headerbild find ich soweit auch ok und zum Thema passend. Die Hintergrundfarbe vom Menü finde ich gut so, ein hover-Effekt wäre jedoch wünschenswert.
Den Content-Bereich würde ich genau so lassen - der Rahmen sieht gut aus. Schade, dass du noch keine Beispiele für die Topographie gemacht hast.
So... dann würd ich dir auf jeden Fall empfehlen auf eine dynamische Breite umzusteigen. Bei der Art des Layouts ist das nämlich relativ einfach (wenn du schon ne Tabelle fürs Menü nehmen musst :wink:)

Weiter so

Gruß
Voodoo
 
Werbung:
Danke für deine Bewertung, aber sonst heißt es ich würde zu viel <div>s nehmen...

In diesem Falle wäre auch kein Div sondern eine Liste ideal ;) Wobei ich aber die Formulierung "zu viele divs" auch ein bisschen komisch finde :)

Also zur Seite: Ich finde das Design richtig gut. Das Design ist im Ganzen sehr stimmig und ich finde gerade sieses Schlichte sehr schön.
Ich würde gern mal sehen, wie die Links dann später (farblich und evtl. mit hover) aussehen :)
Finde die Seite gelungen.

MfG Icy
 
Moin,

ein schwarzer Rahmen hat immer so etwas wie ein Trauerrand.
Vielleicht würde das abgemildert wenn du einen grauen Rahmen nimmst.

Zu Code/CSS kann ich sagen, das die ersten Zeilen deiner CSS
Code:
*  {
  margin:0;
  padding:0;
    }

lauten sollten, damit die unterschiedlichen browserspezifischen Vorformatierungen auf null gesetzt werden, d.h. gleiche Startbedingungen für alle Browser schaffen.

Davon ausgehend definierst du dann die Abstände für alle Elemente.

Außerdem sollte du height für Elemente nur angeben, wenn es unbedingt notwendig ist, weil height eine Box unflexibel bezüglich unterschiedlicher Inhaltsmengen macht.

height regelt sich durch die Inhaltsmenge und wird zusätzlich durch padding/margin gesteuert.:wink:

koslowski
 
Das Bg.gif hast du nicht zufällig von meinem template geklaut?
gleiche Größe + Datengröße ^^ Zufall?!
 
Werbung:
Das Bg.gif hast du nicht zufällig von meinem template geklaut?
gleiche Größe + Datengröße ^^ Zufall?!

Zufälle gibts...^^

Nein, ich will ehrlich sein, ja, ich habe es von dir.

Demnächst Frage ich an,nur das Layout hier musste innerhalb von einer halben Stunde fertig sein, daher wäre deine Antwort zu spät gekommen.

Wenn du magst nehme ich es raus...
 
Ja ne.... nun lass es drinne. Finde es trotzdem dreist!

Dreist zu erscheinen liegt nicht in meiner Absicht. Kann aber auch verstehen das du es als dreist aufnimmst. Demnächst frage ich halt nach..

Aber jetzt zurück zum Thema. Wenn noch jmd. Lust jat eine Bewertung abzugeben, bitte tut es auch, bin füralles offen
 
Werbung:
Hast du die Grafik nun entfernt oder sehe ich sie nur nicht ?!?

Ansonsten nicht sooo übel, wäre aber schön zu sehen, wie die Navigation sich beim Hover verhält...
 
Wobei ich aber die Formulierung "zu viele divs" auch ein bisschen komisch finde :)
Daran ist gar nichts komisch, ich kann Dir das gern erklären.
Auch diese Seite tendiert zur "div-Suppe". Eine Seite mit div-Suppe hat eindeutig zu viele, eigentlich aussagelose, divs. Das Ergebnis ist dann von der Semantik her auch nicht besser, als Tabellenlayout.

Bei "zu viele divs" geht es darum, dass der Ersteller einer solchen Seite noch nicht verstanden hat, wozu HTML da ist, nämlich um den Inhalt mit einer Struktur auszuzeichnen. So hat normalerweise jede Seite mindestens eine Überschrift (<h1>), Fließtextabsätze (<p>), manchmal auch tabellarische Daten in Form einer Tabelle (<table>), Listen/Menus (<ul>) oder Adressen (<address>). Der Sinn von HTML ist, seinen Inhalt mit passenden Tags semantisch korrekt auszuzeichnen, also jedem Element auf der Seite eine Bedeutung zu geben.

Ein <div> ist lediglich ein allgemeines Block-Element (wie <span> ein allgemeines Inline-Element ist), und wird nur eingesetzt, um mehrere Elemente zu gruppieren, in der Regel, um diese dann gemeinsam mit CSS zu formatieren.

Es ist also durchaus verständlich und logisch, dass es auch "zu viele divs" gibt. Denn, um eine Tabelle zu formatieren, kann ich das <table>-Tag formatieren, ich muss nicht noch ein <div> außen drum legen, um das dann zu formatieren. Ein <div> brauche ich erst, wenn ich eine Überschrift (z.B. <h2>) und mehrere nachfolgende Textabsätze (<p>) zusammen formatieren will (um ihnen bspw. einen Rahmen oder ein gemeinsames Hintergrundbild zu geben, oder um den gesamten Block zu positionieren).

Es gibt eigentlich immer ein Tag außer <div>, mit dem man seinen Inhalt beschreiben kann. Deswegen gibt es durchaus auch "zu viele divs".

In der hier vorgestellten Seite sind auch definitiv zu viele <div>s. Das liegt aber auch daran, dass die Seite keinen Inhalt hat. Es ist schwierig, eine semantisch korrekte Seite zu erstellen, wenn man keinen Inhalt hat. Deswegen empfehle ich immer wieder, beim Erstellen einer Seite niemals mit dem Layout zu beginnen, sondern mit dem Inhalt. Dann den Inhalt mit HTML auszeichnen, ohne Rücksicht darauf, wie das im Browser aussieht. Und dann erst das Stylesheet schreiben. Wer richtig gut ist, muss an der Stelle nie wieder in den HTML-Code rein.

div#heade auf dieser Seite sollte letztendlich ein <h1> werden, denn das Element stellt die Überschrift der Seite dar.
div#nav ist schon hier völlig überflüssig, kommt in dem allgemeinen Block-Element doch auch nur wieder ein Block-Element. Die Formatierungen, die man hier div#nav gegeben hat, kann man auch alle div#nav table geben und dann div#nav weglassen.
Zudem ist die Tabelle ohnehin völlig fehl am Platze, da gehört, wie schon richtig festgestellt, eine Liste hin.
div#inha ist im Moment auch völlig überflüssig, weil darin nur ein Block-Element ist und nichts gruppiert werden muss. Man könnte div#inha p auch so formatieren, wie div#inha. Da aber hier wahrscheinlich auf jeder Seite mindestens ein <h2> und mehrere <p> kommen werden, hat div#inha natürlich schon seine Berechtigung in der finalen Version der Seite.

Ansonsten zur Seite:
Ich kann mich nur dem Vorschlag anschließen, das Layout unbedingt dynamisch zu machen. In einem maximierten Browserfenster bei hohen Auflösungen macht die Seite keinen Spaß. Sie verschwendet schon jetzt bei mir bei 1280x1024 viel zu viel Platz. Außerdem passt sie sich auch schon jetzt einer Schriftvergrößerung nicht mit an, weswegen sie schon bei geringer Vergrößerung aus allen Nähten platzt.
Und die Links sind noch keine Links.

Gruß,
-Efchen
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben