Navigation - Paginierung | Usability On Air

Navigation - Paginierung

14. Juni 2008
Veröffentlicht von Krzysztof P.

Long Inhalte auf der Website war schon immer ein Problem gewesen. Auf der einen Seite wollen wir auf der Website alle Inhalte setzen, auf der anderen Seite Scrollen durch mehrere Bildschirme Inhalt ist nicht immer eine gute Wahl. Die Ausnahme sind Blogs , in denen Benutzer-Browser gewohnt sind Schieberegler, um den vertikalen Einsatz. Allerdings wird es heute über Blogging. Ich würde schreiben, ein wenig über gute Beispiele für den Umgang mit langen Inhalte innerhalb der Website.

Long Inhalte (Content) ist am häufigsten im Fall von Suchlisten, wo die Party ist zu finden, um die Liste der Ergebnisse zu präsentieren. In den meisten Fällen sprechen wir nicht sind hier über die Ergebnisse der Länge von zwei oder drei Bildschirme, sondern der Inhalt der dies kann bis zur Länge des sichtbaren Bereich des Browserfensters kilkunastokrotną.

Ein weiteres Beispiel, wo der Inhalt in lange vorgestellt wird, sind alle Arten von Seiten mit News, Produkte (E-Commerce-Anwendungen), die die Überprüfung bestimmter Sätze (Dateien zum Download, eine Liste der Plug-Ins, etc.).

Die Lösung in der Praxis verwendet (und wahrscheinlich eines der besseren) ist uns das Motoren-Sharing (Portionieren), um für ein paar-mehr als ein Dutzend Seiten und zeigt sie nacheinander uns - die sogenannten. Paginierung. Um den nachfolgenden Seiten (Teile von Informationen) in der Regel durch die Navigationsleiste gehen, mit den Links (Links) auf den nachfolgenden Seiten.

Lösungen sind vielfältig. Einige sind besser, andere schlechter - wie es in der Praxis geschieht. Nachfolgend präsentiere ich Ihnen die interessantesten aus der Perspektive, wie ihre Umsetzung und Organisation.

Google

Google ist ein Paradebeispiel für das, was ich möchte zitieren. Die meisten von uns kennt wahrscheinlich statndardowy nawigacujny bar auf Suchergebnisseiten bei Google.

Parallel Liste von Links, fortlaufend nummeriert. Die Seitenzahl wird derzeit gerade in einer anderen Farbe und nicht anklickbar hervorgehoben. Alles wäre richtig, wenn nicht für die geringe Kontrast zwischen den farbigen Elementen und anklickbar nieklikalnych. Links zu betonen, was die Möglichkeit ihrer Klicks symbolisiert, und es ist eine gute Sache. Für die nächste Party kann man durch einen Klick auf einen der Links oder die Anzahl der markierten Wörter gehen auf "Weiter".

Wahrscheinlich bemerkt, dass es keine Möglichkeit gibt hier für eine schnelle Sprünge bis 10, 20 Seiten, etc., die einen klaren Nachteil dieses Mechanismus ist. Dodarkowo klickbare Fläche eines jeden der Beteiligten ist sehr klein (wie der Abstand zwischen ihnen), wodurch es schwieriger zu navigieren. Dies zeigt sich besonders, wenn die Anzahl der Seiten von 20 gestiegen Es sollte hier auch erwähnen, das Fehlen der Übergang zu den ersten und letzten Seiten, die unangenehm sein kann für die langen Listen von Ergebnissen.

Letzte Seite (wie der erste) hat nur einen Link (zurück) hervorgehoben.

Ein weiterer Nachteil von Lösungen präsentiert von Google fehlt ein Prüfsiegel Link (Titel). Versäumen Sie nicht, darauf hinzuweisen, die Ausbreitung tuaj Grafik Inschrift "Goooooooogle", das ist wirklich die Lösung fügt nichts als eine weitere Dosis des Chaos und der Unschärfe der Transparenz der Schnittstelle.

Mozilla

Mozilla hat Ergänzungen zu den vorgeschlagenen Standort in Ihren Firefox-Browser recht interessante Lösung, die im Vergleich mit Google, ist es viel besser (obwohl es ustrzegło Fehler macht).

Wie in diesen Zeichnungen dargestellt, nahm Mozilla für Ihre Gesundheit und die Vision und die Navigation neben Dagegen hat einen großen Abstand zwischen den einzelnen klickbaren Links und eine große Kiste, die übrigens, Flash auf der Maus über die, die weiter verbessert die Wahrnehmung und die Wahrnehmung dessen, was wir tun, zeigen, . Auf der Minus allerdings noch gehören der Mangel an schnellen Sprüngen (nach ein paar Ergebnisse auf der Vorder-und Rückseite) und das Fehlen von textuellen Beschreibungen der Nutzung von Links, wie dies bei Google war.

Andere Lösungen

Interessantes Beispiel ist die vorgeschlagene Lösung auf einem Blog .

Es ist zum Verwechseln ähnlich einer Lösung von Mozilla, unterscheidet sich jedoch noch einige kleinere Details und Verhaltensweisen in Abhängigkeit von der Anzahl der Ergebnisse. Nach einer umfassenderen Beschreibung der Maßnahme und Kommentaren in allen Fällen, lade ich Sie zu einer Seite mit Artikel . Ich vermisse in dieser Ausführungsform ähnliche Dinge, die nicht von Mozilla verwendet wurden, aber es ist ideal in der Nähe und erfolgreiche kleinere Anpassungen könnten in der Praxis angewandt werden.

Meiner Meinung nach ist ein guter Motor für Paginierung erfüllen die folgenden Empfehlungen:

Transparenz und verwendet den Abstand zwischen Elementen
Elemente der aktiven und inaktiven sollten eindeutig gekennzeichnet werden
Click-through-Bereich der Elemente müssen so groß sein
Benutzer sollten in der Lage, jederzeit zu bewegen das erste und letzte Seite der Ergebnisse
Benutzer sollten in der Lage, schnell springen (0 von 5, 10 oder 20 Elemente) in beide Richtungen für lange Listen von Ergebnissen
redundante Elemente in der Navigation sollte nicht angezeigt werden
Links sollten Titelnamen zu verwenden erleichtern die Navigation für Menschen screendreaderami
Links sollten ein Highlight, das wirkt sich positiv auf ihre Wahrnehmung der Benutzer wahrgenommene
verfügbaren Bandbreite und eine einzige Liste mit Links zu ausgewählten sollte die Anzahl der Ergebnisse angepasst werden - die optimale Anzahl beträgt 3-5 Ergebnisse in vorwärts und rückwärts

Ich konnte aber nicht finden solche Implementierungen. Vielleicht kennst du sie?

Hinzugefügt 16. Juni 2008:
Aber es geschafft, zu finden (dank einem Blog Szuby Martin), ein wunderbares Beispiel dafür, wie man es nicht Paginierung Design.