Seitenaufteilung: links und rechts vom Hauptinhalt, die Zweite

[Matthias Scharwies]

guten Morgen,

am Mittwoch hatten wir uns zu viert ca. 45min über Marginalien unterhalten.

Zuerst etwas vorneweg:

suche literatur zu platzierung von sekundaerem web-content

Ich habe immer wieder versucht, irgendetwas zu finden und stieß immer wieder auf kurze Artikel, dass es jetzt ein aside-Element gäbe. Tiefer ging das nicht. (Bester Text war Matthias Apsels Abschnitt aus der HTML5-Serie aus 2013!)

grosse, breite bildschirme

klar, gerade nachrichtenportale passen sich den geaenderten lese-gewohnheiten an. auf den meist hochkant verwendeten smartphones sind marginalien bzw. allgemein nebeneinander angeordneter content (wenn mind. ein bestandteil fliesstext ist) fast immer kacke.

aber: werden leute mit grossen, breiten bildschirmen ignoriert oder ist es tatsaechlich selbst fuer pc-user lese- und informationstechnisch besser, wenn sie content immer untereinander dargeboten bekommen? und welche fenstergroessen (und welche breite-hoehe-verhaeltnisse) verwenden die leute? (und welche rolle spielt das ueberhaupt?)

Das ist glaube ich wirklich die Quintessenz unserer Diskussion:

Ich habe einen 32''-Monitor mit 16:9 zuhause, aber einen 12''-Surface für Arbeit und Freizeit, den anderen geht es genauso.

Zusätzlich zum Anteil von 50% mobilen Surfern kommen eben noch die Laptop-Besitzer mit 12-14''.

Fazit: Da niemand 2 oder 3 Themes entwickeln will, ist schmal eben der Standard und es wird zunehmend weniger in die Breite entwickelt. Selbst mit einem 40''-Monitor werden Webseiten nur 1024px breit sein und gescrollt werden. Das ist eine Lese-Gewohnheit, die sich durchgesetzt hat.

ebenfalls nebensaechlich ist hierbei der main content. da ist es relativ klar, dass die zeilenlaenge nicht zu gross sein soll (negativ-beispiel: derzeitige deutschsprachige wikipedia, positiv-beispiel: derzeitige franzoesischsprahige wikipedia).

Das glaube ich eben nicht! Der main-content bestimmt eben doch Textsorte, Aufbau (Kapitelstruktur) und Lesegewohnheit. Du hattest Nachrichtenportale, die wikipdeia, etc erwähnt. Bis auf die Portalseiten mit vielen kleinen Boxen und Teasern geht es um einen Text, der unterbrochen wird.

mir geht es nur um die platzierung der zusaetzlichen infos.

moechte ich dieses mal dann eben doch um meinungen bitten. :-)

• was haltet ihr davon, wenn links und rechts vom hauptcontent, also in den marginalien nur whitespace zu sehen ist?

Das ist völlig ok! Die von dir verlinkten Seiten machen das weitgehend so. Spiegel und Bild haben dort „interaktive“ Wallpaper (Ich surfe einmal mit adblocker und am anderen Gerät ohne), die mich sehr stören, die die aber wohl zur Finanzierung brauchen.

Wie ich gesehen haben ist 1024px der (alte und wieder ) neue Standard.

oder wenn dort eben meta-infos platziert werden (vorausgesetzt, das ganze ist responsive genug, dass es am smartphone ggf. anders, aber trotzdem uebersichtlich dargestellt wird)?

Das wäre ok, wenn es nicht zuviel ist.

Wiki-Makeover

Ab jetzt hatten wir uns auf unsere vorläufige Wiki-Makeover-Seite gestürzt (man kann im Seiteninspektor zw. hellem und Dark Mode umschalten).

Ich hoffe, dass du aus dieser Diskussion für dich etwas mitnehmen kannst.

• wie/wo sollten meta-informationen (verwandte artikel, toc, erstellungs-infos, downloads) dargeboten werden?

so, dass der Lesefluss nicht gestört ist und die asides natürlich erscheinen.

Auf dieser Beispiel-Seite sind alle Boxen gedrängt sichtbar - trotzdem war unsere Motivation, die asides und div role=note" so zu platzieren und formatieren, dass der Lesefluss des Hauptinhalts nicht gestört wird.

• in der linken oder rechten marginalie, wenn das fenster gross genug ist, z.b. linke marginalie,
• den hauptcontent unterbrechend oder
• vom hauptcontent umflossen?
• falls die marginalien frei bleiben: sollen alle sektionen streng voneinander getrennt werden oder sollen zusatzinfos lieber in unmittelbarer naehe zum verweis stehen, aber eben graphisch abgegrenzt?

Ja, wir bei SELFHTML haben uns für die mittlere Variante entschieden. Die linke Marginalie enthält nur die Sidebar mit einer internen Wiki-Navigation.

Rechts bleibt frei.

Innerhalb des main-contents gibt es jetzt 100% breite Noteboxen, die aber keine aufdringlichen Kästen mehr sein sollen, sondern nur durch ihren linken Rand als Hinweis sichtbar sind.

Ausnahme sind die "Post-It"s. Sie dienen der Text-Info, sollen aber eben nur klein sein. Ohne class="aside" oder in schmaler Ansicht haben auch sie nur einen linken Rand.

• weitere moeglichkeiten?

Wir sind gestern drauf gekommen, die Post-Its bei genügender Breite um 5em aus dem Hauptinhalt herauszuschieben. Dabei bleibt der originale Platz erhalten und es entsteht white-space. Sieht das gut aus?

• welche websites (mit mind. 50 seiten) seht ihr als besonders negative oder besonders positive beispiele bzgl. der hier angesprochenen navigationsthematik -- mit/ohne marginalien?

daily Mail - besonders die Popups und Videos-Popups.

um nicht nur zu fragen, sage ich auch kurz meine meinung:

• bei laengeren seiten ohne marginaliennutzung nervt es mich, viel rumscrollen zu muessen, um ueberhaupt erstmal herauszufinden, was mir alles geboten wird.

Nein. Das hat auch eher mit dem fehlenden Kapitelverzeichnis zu tun, oder?

• harte unterbrechungen von text finde ich eigentlich immer doof (ausnahmen sind zugehoerige wirklich informative bilder/diagramme; kein stock-mist).

Ja.

• frueher fand ich die rechte marginalie doof, weil ich die haeufig ignorierte. mittlerweile habe ich mich aber daran gewoehnt und beziehe sie beim anschauen ein -- und erwarte dort zum teil zusatz-infos, z.b. downloadlinks zu podcasts.

Ja.

• deswegen mag ich loesungen mehr, bei denen die marginalien (egal, ob rechts oder links oder beide) genutzt werden.

Kommt drauf an!

• ueberladene marginalien (oder zu viele verschiedenen menues auf einer seite) mag ich trotzdem nicht. uebersicht ist das ziel.

Ja. Genau!

Herzliche Grüße

Matthias Scharwies

PS: Die Links, bzw. hover und die gelben Infoboxen passe ich am Wochenende noch an!