[kabar]

Hallo an Alle,

Ich stelle hier mal 2 Ansätze vor:

Ansatz 1:
Positionierung: static, mit Hilfe von margins und neagtive margins OHNE float
Vorteile: kurzer Quellcode
Nachteile: evtl. später Abstrafung durch Suchmaschinen wegen zahlreicher negative margins????

Ansatz 2:
Positionierung: static, alle Inhalte liegen in einem umfassenden Container-Element, Float wird eingesetzt
Vorteil: läßt sich gut nachträglich zentrieren
Nachteil: ein bißchen mehr In-Einander-Geschachtel

Ansatz 3:
jedes Element auf das body-Element bezogen absolut positioniert
Nachteil: läßt sich nicht gut nachträglich zentrieren

Was ist Eure Meinung zu den genannten Ansätzen und deren Vor- und Nachteilen?


kabar

[Paul Kleinhans]

Ansatz 2 wird wohl auch bei deiner Umsetzung der richtige Weg sein.
Neu wäre mir jedoch, dass negative margins von Suchmaschinen abgestraft werden. Hast du dazu eine Quelle?

[kabar]

Erstmal herzlichen Dank für Dein Feedback

Zu den Suchmaschinen + negative margins habe ich nur Folgendes gefunden - Zitat von folgender Website:

Suchmaschinenoptimierung für Wordpress-Weblogs » Netprofit

Alternativ zur Verwendung eines Wrappers könnte man auch mit negativen margin-Werten arbeiten. Dies hat aus meiner Sicht zwei Nachteile: Erstens wird die Anzeige je nach Browser stark variieren (mangelnde Browserkompatibilität), zweitens könnten Suchmaschinen hohe negative Werte als Missbrauch deuten und irgendwann nicht mehr werten (Risiko künftiger Entwertung).

(Hintergrund: Viele verstecken suchmaschinentauglichen Text über ein nicht-sichtbares Element mit negativen margins)

Auf der anderen Seite heißt es hier:
SimpleBits ~ Exceptionally Negative

Dan Cederholm → SimpleBits
I didn’t mean to imply that negative margins are evil. They’re perfectly fine — just not always the first solution that comes to mind, and that’s why I thought I’d document it.

Aus welchen Gründen würdest Du die 2. Vorlage vorziehen?

[fricca]

Negative Margins sind ein gutes Werkzeug, um bestimmte Dinge zu erreichen. Sie sind kein gutes Werkzeug, um wie in deinem Fall Box nebeneinander zu bringen. Du bist immer auf feste Höhen angewiesen. Sowas funktioniert nicht bei Textinhalt.
Gib deinen Boxen mal Hintergrundfarben. Und dann ändere die Inhaltsmengen oder vergrößere die Schrift.

edit: Du schreibst bei deinem Float-Layout, es sei ein Ineinandergeschachtel. Warum hast du es derart geschachelt? Nimm mal bei deinem ersten Layout deine negativen Margins weg und floate die drei Spalten.

[Paul Kleinhans]

Zitat von kabar

Aus welchen Gründen würdest Du die 2. Vorlage vorziehen?

Die Vorlage habe ich mir gar nicht angeschaut, da sie falsch verlinkt war und auf eine Fehlerseite führte. Der Abschnitt "alle Inhalte liegen in einem umfassenden Container-Element, Float wird eingesetzt" bezeichnet aber das Standardvorgehen einer Umsetzung - daher fiel meine Wahl auf Ansatz 2.

Um die bestmöglichste Herangehensweise an eine Layoutumsetzung erkennen zu können ist ein Bild vom fertigen Layout, und die gewünschte Skalierbarkeit von Nöten.

[kabar]

@Paul:
Würdest Du ein Container-Element auch dann einsetzen, wenn es zunächst nicht benötigt wird, einfach um für zukünftige Layout-Umstellungen offen zu bleiben?
@fricca
Ich denke auch, dass negative margins eher für bestimmte Effekte eingesetzt werden sollten.

Noch eine Frage: welche linksbündigen Layouts mit fixer Breite findet ihr vorbildlich vom Ansatz?

[Paul Kleinhans]

Würdest Du ein Container-Element auch dann einsetzen, wenn es zunächst nicht benötigt wird,
einfach um für zukünftige Layout-Umstellungen offen zu bleiben?

Nein. Wenn es sich um ein größeres Projekt handelt, kannst du ein CMS einsetzen, in dem die wenigen Templates später geändert werden können.
Bei einem kleineren Projekt könntest du mit <?php include() ?> einzelne Abschnitte (z.B. Header) einbinden bzw. auslagern und bei Bedarf in diesen Dateien später zusätzliches Markup unterbringen.

welche linksbündigen Layouts mit fixer Breite findet ihr vorbildlich vom Ansatz?

So schlank wie möglich, umgesetzt mit semantischen Elementen.

[kabar]

Einige Rundfunkanstalten haben linksbündige Layouts

ARD.de - Homepage
Südwestrundfunk | SWR.de
Homepage | MDR.DE
Rundfunk Berlin-Brandenburg | Willkommen beim rbb - rbb Portal

Eigentlich arbeiten alle diese Websites mit einem Container der Inhalts- und Menüspalte umfaßt. Manchmal notwendig, weil ein andersfarbiger Hintergrund gesetzt wurde, manchmal aber auch verschwenderisch wie z.B. mdr.de


Wollte aber nochmal fragen was Du mit "gewünschte Skalierbarkeit" meintest?

Hier das ganze nochmal als Bild: (ein reines 3-spaltiges Layout ist das nicht, eher eine header-Zeile und danach 3 Spalten)