ChrisB: Absolute Positionierung in CSS-Layouts

Beitrag lesen

Hi,

Ich frage mich gerade, ob meine Perspektive auch etwas daher kommt, dass ich einen bestimmten Webseiten-Typ bevorzuge und selber basteln würde, nämlich die Einspaltige, minimale Webseite mit einer maximal dazugehörigen Marginalienspalte. Ähnlich wie Orlando verstehe ich oft nicht, was an der Mehrspaltigkeit und der Nebeneinander-Darstellung mehrerer Kontexte gewünscht bis gralhaft sein soll.

Das ist natürlich wieder ein anderes Thema - und da stimme ich auch mit euch überein. (Ich hatte mir vorhin schon überlegt, ob ich nicht eben jenen Weblog-Artikel mal anführen sollte, den du jetzt auch verlinkt hast; hatte nur irgendwie im Gedächtnis, der wäre von Dirk gewesen, und nicht von Orlando.)

Exzessives Spaltenlayout (also eigentlich ab mehr als zweien) scheint mir oft auch eher die ästhetischen Ansprüche eines Designers erfüllen zu müssen, als dem Nutzer einen Mehrwert zu bieten - im Gegenteil, je mehr schmale Spalten in einen Viewport "handelsüblicher" Breite gequetscht werden, desto mehr geht die Les- und damit Nutzbarkeit meist den Bach runter.
Das klassiche Format "Zeitung" hat in der Breite mehr Platz zur Verfügung, um darauf Spalten unterzubringen; und darüber hinaus unterliegt es auch der Notwendigkeit, mir eine Vielzahl von Themen parallel und nebeneinander zu präsentieren - denn wenn die Zeitung nur schreibt, "einen Artikel zu Thema XY finden sie auf Seite 17", dann fängt lästiges Blättern und damit Suchen nach der richtigen Seite an. Bei der Webseite hingegen beschränkt sich dieses "Blättern" auf den Klick auf einen Link - da muss ich nicht Suchen, *wo* Seite 17 ist, das machen mein Browser, der Server und HTTP für mich - ich erreiche den verlinkten Inhalt direkt. (Was Orlando ja auch in seinem Fazit "Alternative: Hypertext ist Navigation" so feststellt.)

Bei Webseiten die analog zu den Titelseiten von Tageszeitungen ein Raster oder mehrere Raster aufspannen, in die Inhalte sich einreihen, ist absolute Positionierung natürlich eher unspannend.

Darüber hinaus sind die meist vom Konzeptionellen her im Medium WWW eher "falsch" angekommen - siehe oben, eine ordentlichte Strukturierung der Inhalte, Aufteilung auf einzelnen Dokumente, und konsistente, übersichtliche Verlinkung zwischen diesen, täte dem Nutzer meist viel eher einen Gefallen, als der vielleicht "gewohnten" Optik wegen die Darstellungsweise einer Zeitung o.ä. imitieren zu wollen.

Das harmoniert natürlich mit meinem Umordnungs-Argument zum CSS Naked Day. Gerade klassische Header mit Globalnavigation und Suche und anderen Krempel stören etwas in der Nicht-CSS-Ansicht, wären also besser im Quelltext nach dem Inhalt aufgehoben. In der CSS-Ansicht übersieht das leicht trainierte Auge das sehr viel mehr. Mit absoluter Positionierung kann man sich seinen Header dann halbwegs zusammen basteln.

Damit schneidest du ein weiteres Thema an, bzgl. dem die "Trennung von Inhalt und Layout" noch gar nicht so weit fortgeschritten ist, wie man uns oft weismachen will - denn absolute Positionierung ist hier eine der wenigen Möglichkeiten, die sich uns diesbezüglich überhaupt bietet. (Mit dem Thema hat sich Dirk ja auch schon mal ausführlicher auseinandergesetzt.)

Klar lässt sich ein klassisches Zwei-Spalten-Layout (oder ggf. auch mehr Spalten) oftmals auch mit absoluter Positionierung umsetzen - mit dem, mitunter recht gravierenden, Nachteil, dass eine Anspassung an den zur Verfügung stehenden Platz in der Breite nicht oder kaum gegeben ist, wie float sie mir bietet - sondern umgekehrt, der Platzbedarf angepasst wird, also bei kleinerem Viewport Scrollbalken entstehen.

min/max-width hilft in Desktop-Browsern sehr.

In wie fern hilft mir das, wenn ich Elemente per absoluter Positionierung nebeneinander bringe? Wenn ich Spalte #1 bei left:0, #2 bei meinetwegen 15em und #3 dann bei 30em positioniere - dann erfordert ein zu schmaler Viewport einen horizontalen Scrollbalken. Ich sehe gerade nicht, wie mir die Vorgabe einer Minimal- und ggf. Maximalbreite (für was?) diesbezüglich weiterhilft; jedenfalls nicht in dem Sinne, in dem float mit seinen Eigenschaften das kann - eben gerade nicht auf der Darstellung nebeneinander zu "bestehen", sondern sich im Zweifelsfall zu sagen, "der Klügere gibt nach, und ich reihe mich jetzt halt *unter* meinen Vorgängern ein".

MfG ChrisB

--
Light travels faster than sound - that's why most people appear bright until you hear them speak.
0 54

Absolute Positionierung in CSS-Layouts

Tim Tepaße
  • meinung
  1. 0
    Jeena Paradies
    1. 0
      Tom
      1. 0

        Das Leben und so ...

        Jeena Paradies
        • menschelei
        1. 0
          Der Martin
          1. 0
            Stonie
            1. 0
              Der Martin
            2. 0
              Tom
    2. 0
      Tim Tepaße
      1. 0
        Jeena Paradies
        1. 0
          Tim Tepaße
      2. 1
        molily
  2. 0
    ChrisB
    1. 6
      ChrisB
      1. 0
        molily
        1. 0
          ChrisB
      2. 0
        Tim Tepaße
        1. 0
          ChrisB
          1. 0
            Der Martin
            1. 0
              Tom
            2. 0
              molily
              1. 0
                Der Martin
                1. 0
                  molily
                  1. 0
                    Der Martin
                    1. 0
                      molily
                      1. 0
                        Der Martin
                        1. 3
                          molily
                          1. 2
                            ChrisB
                        2. 0
                          Tim Tepaße
                          1. 0
                            Der Martin
                            1. 2
                              molily
                              1. 0
                                Der Martin
                                1. 3
                                  Struppi
                                2. 0
                                  molily
                                3. 0
                                  Gunnar Bittersmann
                2. 0
                  molily
                3. 0
                  Gunnar Bittersmann
                  1. 0
                    Der Martin
                  2. 0
                    molily
            3. 0
              Gunnar Bittersmann
              1. 0
                ChrisB
                1. 0
                  molily
            4. 0
              molily
    2. 0
      molily
      1. 0
        Tim Tepaße
      2. 0
        Gunnar Bittersmann
    3. 0
      Tim Tepaße
      1. 0
        ChrisB
        1. 0
          Beat
  3. 0
    Cyx23
  4. 0
    Klawischnigg
    1. 0
      Tim Tepaße
      1. 0
        Cyx23
      2. 0
        Klawischnigg