Achot: column-count

Hallo,

in Magazinen ist es üblich dass ein Leser zwei Blöcke Text vorfindet, wenn die Spalten zu breit sind. Im Web kann ich mit column-count die gleiche Darstellung realisieren wenn die Breite zu lang wird.

Nun meine Frage, verstehen die User, dass sie von links oben nach links unten und dann weiter von rechts oben, nach rechts unten, lesen müssen? Bis jetzt war man ja gewohnt von links nach rechts und von oben nach unten zu lesen.

Habt ihr Erfahrungswerte?

  1. Hallo

    Klar verstehen die Leser das. Etwas Unterstützung durch Rahmen, Abstände oder Überschriften / Bilder über alle Zeilen helfen dabei.

    ABER

    User lesen Internetseiten anders als Druckerzeugnisse.

    Von Webseiten sieht man in der Regel nur einen Teil.

    Bei Druckerzeugnissen hat der Leser zunächst immer den gesamten Aufbau einer Seite oder bei großformatigen Zeitungen zumindest eine Hälfte vor sich.

    Außerdem nervt es die meisten User zum Lesen eines Textes mehrfach rauf- und runterscrollen zu müssen.

    Deshalb ist Spaltensatz für Webseiten auch zukünftig grundsätzlich nicht zu empfehlen.

    Außer der Inhalt des Spaltensatzes kann auf einen Blick erfasst werden. Also für eher kurze Texte.

    Gruss

    MrMurphy

    1. Hallo,

      danke für deine Erklärung. Ich möchte dieses auch nicht für alle Texte nutzen. Nur auf der Startseite habe ich einen Einleitungstext, der sehr wichtig ist.

      Bis jetzt hatte ich diesen über die ganze Breite laufen, allerdings ist mein neues Design (Content-Bereich) 1200px Breit, einfach viel zu lange, wie man es mir auch schon öfters hier im Forum gesagt hat.

      Noch mehr Bilder möchte ich auch nicht hochladen nur um Platz zu füllen. Deshalb ist mir die Lösung mit 2-3 Spalten gekommen, somit wäre der Text nicht mehr so lange und sieht bestimmt etwas schöner aus.

      1. Hallo Achot,

        Noch mehr Bilder möchte ich auch nicht hochladen nur um Platz zu füllen. Deshalb ist mir die Lösung mit 2-3 Spalten gekommen, somit wäre der Text nicht mehr so lange und sieht bestimmt etwas schöner aus.

        Bei zwei bis drei kurzen Texten würde ich eher folgendes Schema vermuten („GrafikX“ ist optional, machen einige so):

        ##Unserer Leistungen

        | Grafik1 | Grafik2 | Grafik3 | | Text |Text |Text |

        Gruß
        Julius

        --

        Zu argumentieren, dass Sie keine Privatsphäre brauchen, weil Sie nichts zu verbergen haben, ist so, als würden Sie sagen, dass Sie keine Freiheit der Meinungsäußerung brauchen, weil Sie nichts zu sagen haben.

        Edward Snowden

        1. Hallo Julius,

          für die Leistungen mache ich dieses genau so. Allerdings ist der Einleitungstext, um den es geht eher so eine Art "Wir über uns". Darüber habe ich eine schöne große Headergrafik, daher ist ein weiteres Bild neben dem Text etwas zu viel des guten.

          1. Hallo Achot,

            für die Leistungen mache ich dieses genau so. Allerdings ist der Einleitungstext, um den es geht eher so eine Art "Wir über uns".

            Da der Einleitungstext auch gelesen werden soll, würde ich den an deiner Stelle etwas kürzen, sodass er auf die gängigsten Viewports draufpasst. Alternativ muss der Nutzer eben scrollen.

            Darüber habe ich eine schöne große Headergrafik, daher ist ein weiteres Bild neben dem Text etwas zu viel des guten.

            Da stimme ich dir zu, mach ihn doch einfach schmaler.

            Gruß
            Julius

            --

            Zu argumentieren, dass Sie keine Privatsphäre brauchen, weil Sie nichts zu verbergen haben, ist so, als würden Sie sagen, dass Sie keine Freiheit der Meinungsäußerung brauchen, weil Sie nichts zu sagen haben.

            Edward Snowden

            1. Hallo,

              hier ein Beispiel von meiner Bank: https://www.fidor.de/personal-banking/smart-account oben habe ich ebenfalls ein schönen Titelbild, welches auf jeder Seite angezeigt wird. Darunter ein Text, wie in etwas "Endlich eine Bank, die smart ist: Konto + Karte + Community" auf der verlinken Seite.

              Oder anderes Beispiel. Derzeit sieht es bei mir aus, wie auf https://unternehmerkanal.de/unsere-mission/ darüber noch ein Titelbild. Einfach viel viel zu lange.

              1. Hallo Achot,

                Einfach viel viel zu lange.

                Den Umfang kannst du ja mit dem Design nicht ändern, da müsstest du schon den Inhalt kürzen.

                Gruß
                Julius

              2. @@Achot

                Derzeit sieht es bei mir aus, wie auf https://unternehmerkanal.de/unsere-mission/

                Du musst nicht den Rechtschreibfehler aus der Überschrift jener Seite übernehmen.

                Und mit „sieht es bei mir aus wie“ meinst du nur nur die Satzbreite, nicht die Gestaltungsfehler und unscharfen Fotos?

                LLAP 🖖

                --
                “When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory
                1. Hallo,

                  ich meine selbstverständlich nur die Satzbreite.

  2. Hallo Achot,

    Nun meine Frage, verstehen die User, dass sie von links oben nach links unten und dann weiter von rechts oben, nach rechts unten, lesen müssen? Bis jetzt war man ja gewohnt von links nach rechts und von oben nach unten zu lesen.

    Ich würde das verstehen; finde es aber nichtsdestotrotz extrem nervig.

    Gruß
    Julius

    --

    Zu argumentieren, dass Sie keine Privatsphäre brauchen, weil Sie nichts zu verbergen haben, ist so, als würden Sie sagen, dass Sie keine Freiheit der Meinungsäußerung brauchen, weil Sie nichts zu sagen haben.

    Edward Snowden

    1. Hallo,

      findest du es also besser, wenn der Text über eine ganze Spalte von 1200px läuft und den den Kopf ständig von links nach rechts drehen musst?

      1. Hallo Achot,

        findest du es also besser, wenn der Text über eine ganze Spalte von 1200px läuft und den den Kopf ständig von links nach rechts drehen musst?

        Das ist natürlich keine Alternative. Die Alternative ist, dass der Text schmaler ist und ich nach unten scrolle (BTW: mein 8″-Tablet hat ungefähr 1200px in der Breite, dennoch muss ich den Kopf nicht ständig drehen, um den ganzen Bildschirm betrachten zu können).

        Gruß
        Julius

        --

        Zu argumentieren, dass Sie keine Privatsphäre brauchen, weil Sie nichts zu verbergen haben, ist so, als würden Sie sagen, dass Sie keine Freiheit der Meinungsäußerung brauchen, weil Sie nichts zu sagen haben.

        Edward Snowden

        1. Hallo Julius,

          --

          Zu argumentieren, dass Sie keine Privatsphäre brauchen, weil Sie nichts zu verbergen haben, ist so, als würden Sie sagen, dass Sie keine Freiheit der Meinungsäußerung brauchen, weil Sie nichts zu sagen haben. – Edward Snowden

          SIgnatur mit

          
          -- 
          Signatur (hinter den beiden Strichen ein Leerzeichen)
          

          Bis demnächst
          Matthias

          Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.

          1. Hallo Matthias,

            -- 
            Signatur (hinter den beiden Strichen ein Leerzeichen)
            

            Dann ist aber leider die Zitat-Formatierung weg :(

            Ich glaube, ich muss mir einfach eine kompaktere Signatur einfallen lassen :-)

            Gruß
            Julius

            --
            > Zu argumentieren, dass Sie keine Privatsphäre brauchen, weil Sie nichts zu verbergen haben, ist so, als würden Sie sagen, dass Sie keine Freiheit der Meinungsäußerung brauchen, weil Sie nichts zu sagen haben. – Edward Snowden
            1. Hallo Julius,

              Hallo Matthias,

              -- 
              Signatur (hinter den beiden Strichen ein Leerzeichen)
              

              Dann ist aber leider die Zitat-Formatierung weg :(

              Dann

              
              -- 
              Signatur (hinter den beiden Strichen ein Leerzeichen)
              {: style="border-left:.3em solid #d5d5d5; padding-left:1em;"}
              

              Bis demnächst
              Matthias

              Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.

              1. Hallo Matthias,

                das hat irgendwie nicht funktioniert (Copy-Paste):

                --
                Signatur (hinter den beiden Strichen ein Leerzeichen)
                1. Hallo Julius,

                  das hat irgendwie nicht funktioniert (Copy-Paste):

                  Ja, es wird span in span gerendert.

                  
                  -- 
                  *Signatur (hinter den beiden Strichen ein Leerzeichen)*{: style="border-left:.3em solid #d5d5d5; padding-left:1em;font-style:normal"}
                  

                  Bis demnächst
                  Matthias

                  Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.

                  1. Hallo Matthias,

                    tatsächlich, so sollte es aussehen, vielen Dank!

                    --
                    Signatur (hinter den beiden Strichen ein Leerzeichen)