zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden {column-fill:auto} Welche Höhe zum Füllen des Viewports?

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 06.10.2018, 20:28
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.247
AndreasB wird schon bald berühmt werden
Standard {column-fill:auto} Welche Höhe zum Füllen des Viewports?

Moin.


Ich habe eine Liste mit vielen Einträgen von geringer Länge (2-3 Worte, gegen Umbruch geschützt).
Beispiel: https://borumat.de/netflix-genres-de



Diese Liste soll - solange die Fläche des Displays genügt - ohne Scrollen sichtbar sein: in einer mehrspaltigen Darstellung.


Die erste Spalte soll genau bis zum Ende des Viewports reichen. Die nachfolgenden Spalten ebenfalls, solange noch Inhalt genug dafür da ist.



Für diese mehrspaltige Darstellung ist wohl die CSS-Eigenschaft "column-fill" mit dem Wert "auto" gedacht.


Frage 1:
Gibt es einen Methode, wo man die Anzahl der Spalten nicht angeben muss?
Denn genau das will man ja bei Responsivness nicht.


Frage 2:
Jede Spalte soll nur so breit sein, wie sein breitester Eintrag. Die Spalten sollen also automatisch unterschiedlich breit sein dürfen. Geht das?



Frage 3:
Für column-fill muss eine Höhe angegeben werden. Provisorisch habe ich 87vh angegeben.

Gibt es sowas wie "Viewporthöhe minus die Höhe der beiden Elemente vor der Liste"?


Über euren Rat freue ich mich.
Danke.
__________________


Geändert von AndreasB (07.10.2018 um 10:30 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 10.10.2018, 06:33
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.247
AndreasB wird schon bald berühmt werden
Standard

Antwort Frage 3:

height: calc(100vh - 4em)

Das Ziel Responsiveness muss ich wohl aufgeben.

Die gesetzten Gestaltziele lassen es wohl nicht zu.

Das Ziel "Kein vertikales Scrollen solange es geht" bedeutet zum Beispiel, dass die notwenige Anzahl der Spalten nicht von der Viewportbreite abhängt, sondern der Anzahl der Listeneinträge.



Mit Gridlayouts kenne ich mich bisher nicht aus. Damit muss ich mich noch beschäftigen. Vielleicht lässt von den Eigenschaften etwas sinnvoll für die "lange Liste" anwenden.


Die beste Usability zum Lesen von mehrspaltigem Text, der nicht mehr komplett auf den Viewport passt, wäre das "seitenweise horizontale Blättern", wie man es von ebooks kennt.

Ob man das vernünftig im Browser umsetzen könnte, weiß ich nicht.


Falls doch noch jemand Lust hat, zu kommentieren: ich freue mich.
__________________


Geändert von AndreasB (10.10.2018 um 06:51 Uhr)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 10.10.2018, 09:05
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 1.881
cloned ist ein sehr geschätzer Menschcloned ist ein sehr geschätzer Menschcloned ist ein sehr geschätzer Mensch
Standard

Du fängst wieder an, wie in deinen alten Beiträgen, irgendwelche Behauptungen aufzustellen, ohne diese zu verifizieren.


Zitat:
Zitat von AndreasB Beitrag anzeigen

Das Ziel Responsiveness muss ich wohl aufgeben.
Die gesetzten Gestaltziele lassen es wohl nicht zu.
Wieso? Du kannst vielleicht nicht exakt "deinen" Wunsch nur mit CSS umsetzen, aber mithilfe von JS kannst du zB ausrechnen, wie breit das Display ist und dementsprechend die Breite/Höhe etc. von deinen Spalten setzen.

Wieso sollte man "so lange es geht" auf vertikales Scrollen verzichten wollen? Damit quetscht man alles in einen Bildschirm und erschlägt den Nutzer mit Informationen. Besser ist es, eine Filtermöglichkeit für so eine Liste einzubauen damit der User wirklich nur das sieht, was ihn interessiert.

Auch ist vertikales Scrollen auf Desktops/Smartphones vom User gewohnt und auch von der Usability her am besten, am schlechtesten wäre es, wenn man versucht, ein "Seitenweises" scrollen wie am ebook-reader zu ermöglichen.

Besser ist es hier, eine Navigation wie es zB auch jquery.datatables hat, zu verwenden. Dann können die User seitenweise navigieren (aber ohne zu scrollen)


Damit driftet dieses Thread aber wieder in eine "Ich sehe das so und ich bin im Recht" ab, deshalb halte ich mich hier absichtlich kurz.
Mit Zitat antworten
  #4 (permalink)  
Alt 10.10.2018, 10:47
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.247
AndreasB wird schon bald berühmt werden
Standard

@cloned
Dein feindlicher Unterton ist überflüssig und unangemessen, dies vorab.

Ontopic sind in dieser Rubrik Lösungen per CSS und nicht per JS.

Ich habe nichts gegen JS-Lösungen, sie sind mir jedoch nicht zugänglich, da ich die Programmiersprache nicht beherrsche.

Deine Behauptungen zur Usability "viele Informationen sind gleichzeitig sichtbar = erschlagen" wirst du nicht belegen können. Ich habe übrigens keine gegenteilige Behauptung aufgestellt.

Weiter behauptest Du, dass im Usecase "langer mehrspaltiger Fließtext" seitenweises blättern schlecht sei: auf Deinen Beleg bin ich gespannt.

Kannst Du eine Seite mit langem mehrspaltigem Fließtext nennen, die Du gerne per vertikalem Scrollen auf einem Desktopdisplay bedienst?
__________________

Mit Zitat antworten
  #5 (permalink)  
Alt 10.10.2018, 10:58
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 1.881
cloned ist ein sehr geschätzer Menschcloned ist ein sehr geschätzer Menschcloned ist ein sehr geschätzer Mensch
Standard

Ich habe das Gefühl, dass dieses Thema einen ähnlichen Verlauf nimmt, wie auch deine letzten Themen.

Du schreibst "Die beste Usability zum Lesen" und jemand anderer muss nun den Beweis bringen, dass dies nicht stimmt?

Ich habe auch das Gefühl, dass du wieder einzelne Punkte der "Anforderung" unterschlägst. Du sprichst in deinem Anfangspost von einer Liste (einem Datensatz?) und jetzt auf einmal von mehrspaltigem Text.

Mehrspaltiger Text ist nicht wirklich ideal für Texte "im Internet", mehrspaltige Listen können durchaus Sinn machen, wenn man dem User eine Möglichkeit gibt, diese zu filtern.
Mit Zitat antworten
  #6 (permalink)  
Alt 10.10.2018, 11:05
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.247
AndreasB wird schon bald berühmt werden
Standard

Zitat:
Zitat von cloned Beitrag anzeigen
Ich habe auch das Gefühl, dass du wieder einzelne Punkte der "Anforderung" unterschlägst. Du sprichst in deinem Anfangspost von einer Liste (einem Datensatz?) und jetzt auf einmal von mehrspaltigem Text.
Meine Liste ist ein Spezialfall.
Langer Fließtext als Usecase passt besser, wenn wir die grundlegenden Darstellungs- und Navigationsformen diskutieren wollen.

Zitat:
Zitat von cloned Beitrag anzeigen
Mehrspaltiger Text ist nicht wirklich ideal für Texte "im Internet"
Warum bitte?


Warum sollte etwas, was seit Ewigkeiten auf Papier hochbewährt auf großen Zeitungsformaten ist auf einem 30-Zöller nicht gut sein?
Da bin ich wirklich gespannt.
__________________

Mit Zitat antworten
  #7 (permalink)  
Alt 10.10.2018, 11:38
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 1.881
cloned ist ein sehr geschätzer Menschcloned ist ein sehr geschätzer Menschcloned ist ein sehr geschätzer Mensch
Standard

Ich will nicht über grundlegende Darstellungsformen diskutieren, ich will dein Problem verstehen und nachvollziehen können. Ich bin jetzt aber von deiner ursprünglichen Aussage, es handelt sich um eine Liste, abgekommen und bin jetzt bei einem normalen Text, wie er sich auch in einem Buch findet.

Sehe ich es also richtig, dass du für deine Aussage bezüglich "beste Usability zum Lesen von mehrspaltigem Text" keinerlei Belege hast?

Eines der ersten Dinge, die man bei Webdesign lernt, ist, dass man Sachen nicht 1:1 von Print auf Desktop übertragen kann. Vieles, was dort funktioniert, geht im Internet nicht (Bzw. gehen würde es schon, die Benutzer nehmen es dann aber nicht an, was in sinkenden Zugriffszahlen zum ausdruck kommt)

Auch muss ich meine Aussage revidieren, ganz stimmt meine Information, das einspaltiger Text grundsätzlich besser fürs Internet ist, wohl nicht http://citeseerx.ist.psu.edu/viewdoc...=rep1&type=pdf

Auch ist hier eine gute Antwort zu dem Thema:
https://ux.stackexchange.com/questio...ty-on-websites


Eine Studie belegt auch, dass es besser ist, längere Texte auf mehrere Seiten aufzuteilen. Auch sagt diese Studie, dass man den Text auf keinen Fall so lange halten soll wie zB bei einer Printausgabe.
Dort wird zB auch die Seitennavigation, welche ich bereits erwähnt habe, angesprochen.

https://www.nngroup.com/articles/be-...g-for-the-web/

Edit: Weitere Link zu dem Thema. https://designshack.net/articles/lay...-your-layouts/
Mit Zitat antworten
  #8 (permalink)  
Alt 10.10.2018, 12:20
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.247
AndreasB wird schon bald berühmt werden
Standard

Ich habe noch nicht nach Studien gesucht, die sich mit dem konkreten Thema "beste Darstellung von langen Fließtexten auf 30-Zöllern oder größer" beschäftigen.

Mein Argument, dass auf Papierzeitungen, die Methode "Mehrspaltigkeit" und "großflächige Nutzung des Displays" extrem bewährt ist, habe ich genannt. Natürlich hast Du Recht, dass man vorsichtig mit 1:1 Übertragungen sein muss. Aber hier halte ich die Analogie für sehr treffend. Es geht ja um lange Fließtexte und nicht um irgendwelchen Inhalte.

Wesentlich für die Usabilitystudie wäre eine Rahmenbedingung, die Nutzern echtes seitenweises Blättern erlaubt.

Denn wenn das nicht gegeben ist, man also scrollen muss, brauchen wir nicht weiter diskutieren. Dann muss das Auge des Nutzers mühsam die Stellen suchen, wo Anschluss zu finden, wo es weiter geht.

Soweit ich das beim Überfliegen Deiner Links sehen kann, wird auf das seitenweise Blättern nicht eingegangen.
__________________

Mit Zitat antworten
  #9 (permalink)  
Alt 10.10.2018, 13:18
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 1.881
cloned ist ein sehr geschätzer Menschcloned ist ein sehr geschätzer Menschcloned ist ein sehr geschätzer Mensch
Standard

Doch, die Studie von nngroup erwähnt das Seitenweise blättern.
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 10.10.2018, 13:37
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.247
AndreasB wird schon bald berühmt werden
Standard

Die ist von 1997. Da gab es noch keine hochauflösenden Desktop-Displays. Insgesamt geht Nielsen wohl eher von Miniinhalten aus.

Für eine aussagekräftige Studie zum hier diskutierten Fall benötigen wir User, die überhaupt bereit sind längere Texte zu lesen und die dies regelmäßig am Display tun.
__________________

Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Spalten bis zum Ende des Browser füllen... philipp1988 CSS 6 30.10.2007 11:45
Div im IE zu hoch RancoR CSS 10 09.07.2007 23:11
Fotozoom einbinden r0k CSS 3 01.11.2006 11:58
<div>-Bereich mit Höhe des gesamten BrowserFensters BullPit CSS 3 13.02.2005 10:49
Höhe des DIVs automatisch auf volle Höhe scheichxodox Knowledge Base 5 21.12.2004 10:31


Alle Zeitangaben in WEZ +2. Es ist jetzt 19:21 Uhr.