Beispiele und bewährte Vorgehensweisen für die Seitennummerierung

<br />Struktur und Hierarchie reduzieren die Komplexität und verbessern die Lesbarkeit. Je besser Ihr Artikel oder Ihre Site strukturiert ist, desto einfacher ist es für die Benutzer, Ihre Punkte zu verstehen und die Botschaft zu erfassen, die Sie vermitteln möchten. Im Internet geschieht dies auf verschiedene Weise.
Überschriften und Listen werden als logisch eigenständige Informationsblöcke im Fließtext verwendet. Eine weitere Lösung ist ein Mechanismus namens „Paginierung“, der den Benutzern zusätzliche Navigationsoptionen zum Durchsuchen eines einzelnen Abschnitts eines bestimmten Artikels bietet. An diesen Stellen im Artikel finden sich neben den Schaltflächen „Zurück“ und „Weiter“ auch Zahlen, Eingabeaufforderungen und Pfeile.
Suchmaschinen verwenden fast immer die Seitennummerierung, und Zeitungen nutzen sie häufig zur Navigation in großen Artikeln mit mehreren Abschnitten. Teilweise ist auch bei Blogs (Weblogs) eine Paginierung erforderlich. Eine zusätzliche Navigation kann den Zugriff auf einige Seiten einer Site vereinfachen, indem sie Benutzern beispielsweise das einfache Durchsuchen der Archive einer Site ermöglicht.
In den meisten Fällen ist die Paginierung der herkömmlichen Navigation „vorherige Seite, nächste Seite“ überlegen und ermöglicht den Besuchern eine schnellere und einfachere Navigation durch die Site. Es ist nicht erforderlich, aber eine nette Funktion.
Sehen wir uns einige bewährte Paging-Praktiken an, einige Beispiele, wann und wie Paging durchgeführt wird.
Bewährte Praktiken für die Seitengestaltung (7 Aspekte von Faruk Ates):

Stellen Sie große anklickbare Bereiche bereit. Unterstreichen Sie die aktuelle Seite nicht. Trennen Sie Weblinks. Stellen Sie Links zur vorherigen und nächsten Seite bereit. Verwenden Sie Links zur ersten und letzten Seite (falls zutreffend). Platzieren Sie Links zur ersten und letzten Seite außerhalb.
Verwandte Referenzen

Seitennummerierung 101, Faruk Ates hat den endgültigen Entwurf zur Seitennummerierung fertiggestellt. Einige Stile für Ihre Paginierung. Sie können jeden gewünschten Paginierungsstil herunterladen. Wenn Ihr Blog auf WordPress basiert, können Sie zur Generierung einer Seitennummerierung das Plugin WP-PageNavi installieren. Die Installation ist sehr einfach, erfordert allerdings die Änderung einiger Quellcodes Ihres Designs.
Fehler Nr. 1: Seitennummerierungsoptionen sind nicht sichtbar <br />Da der Hauptzweck der Seitennummerierung darin besteht, als verbesserte Navigation zu dienen, muss den Besuchern klar gemacht werden, wo sie sich befinden, wo sie waren und wohin sie als Nächstes gehen können. Diese drei Fakten vermitteln dem Benutzer ein umfassendes Verständnis für die Funktionsweise des Systems und die Verwendung der Navigation.
Aber am wichtigsten ist, dass die Navigationsoptionen sichtbar sind. hugg.com befolgt diese Richtlinie nicht. Die Linkfarbe weist einen sehr geringen Kontrast zum weißen Hintergrund auf. Es sind keine Mouseover-Effekte vorgesehen.

Fehler Nr. 2: Nicht intuitive Seitennummerierung <br />Wenn Sie zwischen einer relativ komplexen (aber schönen) Navigation und einer einfachen Navigation mit den erforderlichen Funktionen wählen müssen, wählen Sie immer den einfachen Ansatz. Wenn Benutzer die Mechanik der Seitennummerierung nicht verstehen, können sie diese nicht verwenden und werden daher Ihre Site nicht nutzen.
Helium.com ist ein gutes Beispiel für diesen Fehler. Schauen Sie sich den Screenshot unten an: Was stellen diese Pfeile dar? Stellt die von Ihnen besuchte oder die Seite dar, die Sie besuchen? Warum hat dieser Link zur zweiten Seite einen weißen Hintergrund? Warum haben die Pfeile unterschiedliche Farben? Das ist nicht intuitiv.

Nicht intuitive Designs sind auf einen Mangel an Struktur, Hierarchie und durchdachten Designentscheidungen zurückzuführen. Eine leere Navigation ist ebenso wenig intuitiv wie überladene Lösungen.

Weblinks ohne Leerzeichen sind schwer zu scannen und zu navigieren. Make-Believe.org ist ein Beispiel für eine Site, die so konzipiert wurde, dass sie nicht intuitiv ist.

Vorherige Seite 1 2 3 4 Nächste Seite Gesamten Artikel lesen

<<: Webpack lädt CSS-Dateien und ihre Konfigurationsmethode

>>: Mehrere Möglichkeiten zum Ändern der SELECT-Optionen in einer HTML-Dropdown-Box

CSS erzielt den „Bottom Absorption“-Effekt im Footer

Beispiele und bewährte Vorgehensweisen für die Seitennummerierung

CSS erzielt den „Bottom Absorption“-Effekt im Footer

Hinweise zur Zeitverwaltung des Linux-Kernel-Gerätetreibers

Lösung für das Problem, dass die Umleitung der Crontab-Ausgabe unter Linux nicht wirksam wird

Detaillierte Erläuterung des direkten Routings bei der hostübergreifenden Kommunikation von Docker-Containern

Erläuterung des Prozesses des Docker-Packaging-Node-Projekts

So fügen Sie Docker dynamisch Ports hinzu, ohne das Image neu zu erstellen

Detaillierte Erläuterung des Prozesses zum Erstellen und Ausführen von Docker-Containern

Mausposition in CSS abbilden und Seitenelemente durch Mausbewegungen steuern (Beispielcode)

Detaillierte Erklärung zur Identifizierung von Dateien mit gleichem Inhalt unter Linux

Detaillierte Erläuterung der Speicherverwaltung der MySQL InnoDB-Speicher-Engine

Artikel empfehlen

Docker erstellt eine Jenkins+Maven-Plattform zum Erstellen und Bereitstellen von Code

Bringen Sie Ihnen einen Trick bei, um das Problem des Einfügens chinesischer Zeichen in MySQL dauerhaft zu lösen

Three.js-Beispielcode zur Implementierung des Tautropfen-Animationseffekts

Eine kurze Analyse der Verwendung von USING und HAVING in MySQL

Fallstricke bei langsamen MySQL-Abfragen

Docker-Compose - Bereitstellung der chinesischen Gitlab-Version per Mausklick - Methodenschritte

Methode zur Realisierung der Internetverbindung durch VMware Virtual Machine Bridging

Handschriftliche Implementierung von new in JS

Detaillierte Erläuterung der MySQL SQL-Anweisungsanalyse und Abfrageoptimierung

Praktische Methode zum Löschen verknüpfter Tabellen in MySQL

Eine kurze Einführung in React

React + Threejs + Swiper vollständiger Code zum Erzielen eines Panoramaeffekts

Detaillierte Erläuterung der Implementierungsmethode für die Datenbank-Mehrtabellenverbindungsabfrage

MySQL 5.6-Binärinstallationsprozess unter Linux

So verwenden Sie http und WebSocket in CocosCreator