Hier findet ihr eine umfassende Sammlung von zweispaltigen und dreispaltigen Layouts. Sie sind W3C-konform und funktionieren auf Internet Explorer 6, Internet Explorer 7, Firefox 2.0, Opera 9, Konqueror 3.5 und Safari 1.3.
Zweispaltiges, EM-basiertes Layout
Das EM-basierte Layout basiert auf der Idee, die Breite der Spalten mit Werten zu belegen, die sonst für Schriftgrößenangaben genutzt werden. So skalieren die Spalten
schön mit, wenn Benutzer mit vergrößerter Schrift browsen. Besonders für Seiten, die Wert auf Behindertengerechtigkeit legen, ist dies wichtig.
Dreispaltiges, EM-basiertes Layout
Das EM-basierte Layout basiert auf der Idee, die Breite der Spalten mit Werten zu belegen, die sonst für Schriftgrößenangaben genutzt werden. So skalieren die Spalten
schön mit, wenn Benutzer mit vergrößerter Schrift browsen. Besonders für Seiten, die Wert auf Behindertengerechtigkeit legen, ist dies wichtig.
Zweispaltiges, Pixel-basiertes Layout
Pixel-Basierte Layouts sind wohl die gängisten Layouts im Webdesign. Hierbei hält sich die Spaltenbreite streng an die vorgegebene Pixelanzahl und skaliert weder bei
Schriftvergrößerung noch Browserfenster-Veränderung mit. Dies ist sinnvoll für Layouts, deren Schönheit stark von der genauen Positionierung von Hintergrund-Bildern
abhängt - Oder schlicht wenn man keine Veränderung in der Spaltenbreite wünscht. Man muss sich aber im Klaren darüber sein, daß bei solch unflexiblen Layouts
vergrößerte Schrift u.ä. über den Spaltenrand herausragen könnten, da sich dieser nicht dynamisch verändert.
Dreispaltiges, Pixel-basiertes Layout auf voller Monitorbreite
und
Dreispaltiges, Pixel-basiertes Layout mit Zentrierung auf der Seite und gleichbreiten Spalten
Pixel-Basierte Layouts sind wohl die gängisten Layouts im Webdesign. Hierbei hält sich die Spaltenbreite streng an die vorgegebene Pixelanzahl und skaliert weder bei
Schriftvergrößerung noch Browserfenster-Veränderung mit. Dies ist sinnvoll für Layouts, deren Schönheit stark von der genauen Positionierung von Hintergrund-Bildern
abhängt - Oder schlicht wenn man keine Veränderung in der Spaltenbreite wünscht. Man muss sich aber im Klaren darüber sein, daß bei solch unflexiblen Layouts
vergrößerte Schrift u.ä. über den Spaltenrand herausragen könnten, da sich dieser nicht dynamisch verändert.
Zweispaltiges, Prozent-basiertes Layout
Prozent-basierte Layouts orientieren sich an der tatsächlichen Größe des Browserfensters. Das heißt daß die Spalten z.B. 15% der Browserfenster-Breite einnehmen. Im
Extremfall (Sehr kleines Browserfenster) kann dies jedoch dazu führen, daß die Spalten so dünn werden, daß kein Text mehr hereinpasst. Dafür wirken Prozentbasierte
Layouts ausgeglichener auf verschiedenen Monitoren mit unterschiedlichen Auflösungen, da sie sich immer anpassen. So kann z.B. der berühmte "Goldene Schnitt" nur
wirklich mit einem Prozent-Layout erreicht werden, da er sonst nur für eine bestimmte Auflösung funktionieren würde.
Dreispaltiges, Prozent-basiertes Layout
Prozent-basierte Layouts orientieren sich an der tatsächlichen Größe des Browserfensters. Das heißt daß die Spalten z.B. 15% der Browserfenster-Breite einnehmen. Im
Extremfall (Sehr kleines Browserfenster) kann dies jedoch dazu führen, daß die Spalten so dünn werden, daß kein Text mehr hereinpasst. Dafür wirken Prozentbasierte
Layouts ausgeglichener auf verschiedenen Monitoren mit unterschiedlichen Auflösungen, da sie sich immer anpassen. So kann z.B. der berühmte "Goldene Schnitt" nur
wirklich mit einem Prozent-Layout erreicht werden, da er sonst nur für eine bestimmte Auflösung funktionieren würde.