Bernhard Häussner

Pagination - Design von Umblätterern und Seitenlisten

20.12.2009, 16:51
Pagination Widgets

Pagination Widgets

Obwohl das Umblätten von Seiten mit entsprechenden Widgets etwas sehr alltägliches im Web ist, gibt es noch immer einige konkurrierende Widget-Designs. Darum habe ich mir Gedanken gemacht, welche Prinzipien diesen zu Grunde liegen, und jeweils Vor- und Nachteile anhand von 10 Beispielen erörtert.

Die Art und Weise auf die Wordpress das Blättern löst, nämlich mit Vor- und Zurücklinks, die als ältere/jüngere Bezeichnet sind, findet sich zwar heute überall, hat aber trotzdem einige Probleme, die den Leser orientierungslos in der Seitenfolge zurücklassen:

Der Leser weiß z.B. nicht wohin er blättert, da die Knöpfe nicht mit vor/zurück, sondern mit der Metainformation älter/jünger verknüpft sind. Zudem weiß der Leser genauso wenig, wohin der überhaupt blättern kann, da nicht kommuniziert wird, wie umfangreich der Seitenstapel ist.

Das nächste Problem tritt erst gar nicht auf: In einem unbegrenzten Seitengewirr interessiert es den Benutzer natürlich auch nicht, wo er sich in diesem befindet. Überflüssig zu erwähnen, dass dies nur behelfsmäßig aus der URL entnommen werden kann.

Wenn man beginnt diese Probleme zu lösen kommt man schnell auf die Idee, einfach alle Seiten(zahlen) anzuzeigen. So hat man schnell einen Überblick über die Anzahl der Seiten. Nur dumm, wenn man sich dann nicht mehr traditionell immer weiter durchklicken kann, sondern Nachdenken erfordert wird: Man muss das Kurzzeitgedächtnis üben, da man nach dem Lesen der Seite noch wissen muss, welche Nummer diese Seite hatte. Entschuldigend muss man sagen, dass das Design von TAB, wo ich dieses Negativbeispiel gefunden habe noch ganz neu und ziemlich experimentell ist, denn der Fokus liegt hier auf der Anzeige des Textes in Spalten, deren Anzahl sich an die Browserfenstergröße anpassen sollte. Das Paging ist hierbei noch nur halbherzig gelöst.

Hier eine traditionelle Lösung, diesmal mit auffalllend gestalteten Blätter-Links. Leider versäumt auch kunstmark.com dem Surfer zu zeigen, wo er sich denn nun befindet. Hier bahnt sich auch schon langsam ein weiteres Problem an: Mit wachsender Seitenzahl nimmt das Blätter-Widget immer mehr Platz ein. Vorteilhaft ist natürlich, dass man auf jeden Fall immer zu jeder Seite kommt.

Das Problem mit der Riesengröße lässt sich beheben, indem einige Seiten weggelassen werden, wie auf Nerdcore. Hier ist auch dank roter Hinterlegung eindeutig zu Erkennen, auf welcher Seite man denn ist.

Ein weiterer Lösungsansatz ist es, dem Leser die Gesamtzahl der Seiten und auch die aktuelle Seite anzuzeigen. So etwas findet sich auf Gamestar.com in geschickter Kombination mit letze/erste Seite Links, welche benötigt werden, wenn diese Seiten nicht numerisch repräsentiert sind. Ein kleines assoziations-erschwerendes Manko ist vielleicht, dass Blätter-Links und Seitenübersicht getrennt auf die beiden Seitenränder verteilt sind.

Eine komplexe Lösung, die sehr auf das Surfverhalten angepasst ist, benutzt vBulletin, hier auf unixboard.de. Einige Seiten werden als Quicklinks angeziegt, unzweifelhaft wird angezeigt wo man ist und wie viele Seiten es gibt, und Links zur ersten und letzen Seite ermöglichen schnelles Springen. Außerdem öffnet ein kleiner Button ein Eingabefeld, mittels dem man zu jeder Seite springen kann.

Dieses Widget ist gut angepasst auf die Verhaltensweise des Benutzers: Anfangs wird man vielleicht noch jede Seite des Threads lesen, dann vielleicht etwas springen. Auch der Quereinsteiger kann sich dank blau hervorgehobener Orientierungshilfe sofort ein Bild seiner Position machen. Da den Leser von Foren oft auch nur interessiert, was zuletzt passiert ist, findet sich auch der Link zur letzten Seite an Prominenter Stelle.

Dieser reiche Funktionsumfang zieht natürlich auch Probleme mit sich (KISS). So sind die in der Liste weggelassenen Seiten nicht repräsentiert und die Vor/Zurück Pfeilchen fallen etwas klein aus, obwohl dies wohl die meist benutze Funktion sein dürfte. Das Widget benötigt also etwas Eingewöhnung.

Ein - wie ich hoffe nahezu perfektes - Design findet sich auf den Seiten meines Journals. Die Vor/Zurück-Links sind auffallend gestaltet und schleißen die Seitenliste ein, in welcher nur das direkte Umfeld der aktuellen Seite angezeigt wird, alle anderen Seitenzahlen werden weggelassen, was durch Auslassungspunkte angedeutet wird. Erste und letzte Seite werden dann wieder angezeigt. Zudem finden sich miniatur-Pfeilchen, welche das Überspringen von einigen Seiten ermöglichen bzw. den Bereich der angezeigten Zeitenzahlen verschieben.

Damit hoffe ich alle benötigen Funktionen und Informationen in einem klaren, platzsparenden Widget zu vereinen.

Technisch gesehen benutze ich eine kleine Modifikation des von Sweetcron verwendeten PaginateIt von Brady Vercher.

Sehr einfach aber natürlich mit dem geringsten Funktionsumfang funktioniert das umblättern bei Twitter - auf Knopfruck werden weitere Einträge gealden. Das ist hier möglich, da der Fokus auf Aktualität und „realtime“ liegt, es gibt also keinen Grund zwischen Seiten hin und her zu springen. Die Seitenzahlen würden sich auch ständig ändern.

Sehr abstrakt und gut für Menschen mit neugierigem Forschungsdrang geeignet, ist das Paging auf Shimones Lifestream. Statt Seitenzahlen finden sich jeweils drei kleine Kreischen, die aktuelle Seite wird durch den gefüllten Kreis angezeigt. Wie man sieht lösen sich einige Probleme, wenn es nur 3 Seiten gitbt von selbst.

Der Grund, warum ich mich mit Ursachen und Wirkung von Usability-Problemen im Berich der Pagination beschäftigt habe, ist die Tatsache, dass mein Lifestram (powered by Sweetcron) mit einem denkbar unpraktischem Pager kam: Keine Vor-/Zurück-Buttons, daneben unechte Vor-/Zurück-Buttons, und hier im Beispiel von simon.dynamicmushroom.com befinden wir und übrigens auf Seite 16.

Ungelöstes Problem

Ein Problem, das ich noch nicht wirklich lösen konnte, ist die Verschiebung von Seiten und die unlogische Leserichtung bei chronologisch rückwärts sortierten Journalen. Wenn neue Einträge hinzu kommen, verschieben sich die älteren um deren Anzahl nach hinten und damit beständig auf andere Seiten.

Bei Twitter und Wordpress wird das gelöst, indem die Seitenzahlen weggelassen werden und Permalinks auf Einträge angeboten werden.

Man könnte zum Beispiel auch die Seiten Rückwärts aufbauen, also bei der Seite mit der höchsten Zahl beginnen und dann nach 1 blättern, so würden sich die Seiten nicht mehr verschieben. Es wäre interessant zu sehen, wie das der User aufnimmt.

Wo möglich sollte man im Web das Aufteilen auf Seiten sowieso unterlassen. Schließlich ist der Traffic für das Laden von Text heute vernachlässigbar. Probleme ergeben sich natürlich, wenn viele Medien eingebettet sind. Ich mag darum z.B. nicht die Gravatars und Kommentarseiten.

Kurze URL http://1-co.de/b/1Z. Post to twitter

Kommentare

Luca meint: (#213)
27.12.2009, 12:34

Da hast du dir ja richtig Mühe gegeben!

Allerdings fehlt für mich noch eine wichtige Spielart der Seitenanzeige: die Drop-Down-Navigation und/oder die Textnavigation.






 
Χρόνογραφ
© 2008-2017 by Bernhard Häussner - Impressum - Login
Kurz-Link zu dieser Seite: http://1-co.de/b/1Z