{"id":31630,"date":"2024-11-12T12:40:18","date_gmt":"2024-11-12T12:40:18","guid":{"rendered":"https:\/\/www.seobility.net\/?post_type=wiki&p=31630"},"modified":"2025-03-18T13:46:24","modified_gmt":"2025-03-18T13:46:24","slug":"Pagination","status":"publish","type":"wiki","link":"https:\/\/www.seobility.net\/de\/wiki\/Pagination","title":{"rendered":"Pagination"},"content":{"rendered":"

Definition<\/span><\/h2>\n

Der Begriff Pagination kann mit \u201cSeitennummerierung\u201d ins Deutsche \u00fcbersetzt werden und kommt zur Anwendung, wenn auf Websites Inhalte auf mehrere Seiten aufgeteilt werden, beispielsweise bei langen Auflistungen von Produkten in einem Online-Shop.\n<\/p>\n

Anwendungsszenarien<\/span><\/h2>\n

Eine Pagination kann zum Beispiel bei langen Nachrichten- oder Blog-Artikeln notwendig sein, wenn der Inhalt zu umfangreich ist und deshalb auf mehrere Seiten aufgeteilt werden muss.\n<\/p>\n

Au\u00dferdem stellen, wie oben bereits erw\u00e4hnt, Produktauflistungen in Online-Shops einen beliebten Anwendungsbereich f\u00fcr eine Pagination dar. Dabei werden beispielsweise nur 25 Produkte einer Kategorie pro Seite angezeigt, da die Website ansonsten zu un\u00fcbersichtlich und schwer navigierbar wird. Aus diesem Grund ist eine Pagination f\u00fcr sehr gro\u00dfe Online-Shops h\u00e4ufig unverzichtbar.\n<\/p>\n

Weiterhin werden Seitennummerierungen h\u00e4ufig in Foren mit sehr langen Threads oder in Kommentarbereichen von Websites eingesetzt.\n<\/p>\n

Au\u00dferdem empfiehlt sich die Nutzung der Pagination bei langen Bilderstrecken in Online-Magazinen, bei denen h\u00e4ufig jedes Bild auf einer eigenen Seite dargestellt wird.\n<\/p>\n

Vorteile<\/span><\/h2>\n

Die Verwendung einer Pagination kann sich aus vielen Gr\u00fcnden lohnen. Der wohl wichtigste Aspekt liegt hierbei in der Erh\u00f6hung der \u00dcbersichtlichkeit und Benutzerfreundlichkeit durch das Aufteilen von sehr umfangreichen Inhalten auf mehrere Seiten. Beispielsweise k\u00f6nnen sich User schnell \u00fcberfordert f\u00fchlen, wenn alle 150 Produkte einer bestimmten Kategorie in einem Online-Shop auf einer Seite angezeigt werden, bei der der User sehr lange scrollen muss, um alle Produkte zu sehen. Werden stattdessen nur 20 Produkte pro Seite angezeigt, wirkt dies \u00fcbersichtlicher und der User kann zudem bequem zwischen den einzelnen Teilseiten hin und her navigieren.\n<\/p>\n

Die Reduzierung der Inhalte, die auf einer einzelnen Seite angezeigt werden, f\u00fchrt au\u00dferdem zu einer Reduktion der Ladezeit, da der komplette Inhalt der Auflistung nicht auf einmal geladen werden muss. Dies f\u00fchrt ebenfalls zu einer Verbesserung der Usability<\/a> und wirkt sich positiv auf die Suchmaschinenoptimierung (SEO) aus.\n<\/p>\n

Weiterhin entsteht insbesondere f\u00fcr Webmaster, die auf ihrer Website Werbung von Dritten einblenden, der Vorteil, dass sich mehr Page Impressions<\/a> pro User sowie mehr M\u00f6glichkeiten f\u00fcr Werbeeinblendungen ergeben. Wird beispielsweise ein redaktioneller Artikel auf drei Seiten aufgeteilt, kann auf jeder dieser Seiten Werbung angezeigt werden (statt nur auf einer).\n<\/p>\n

SEO-freundliche Pagination<\/span><\/h2>\n

Paginierungen tragen zwar aus Sicht der Nutzer zu mehr \u00dcbersichtlichkeit bei, allerdings k\u00f6nnen sich hinsichtlich der Suchmaschinenoptimierung auch Probleme ergeben. Dies l\u00e4sst sich damit begr\u00fcnden, dass bei einer Pagination zusammengeh\u00f6riger Content auf mehrere Seiten aufgeteilt wird, die alle einzeln indexiert werden. Infolgedessen wei\u00df Google nicht, welche Seite f\u00fcr eine bestimmte Suchanfrage relevanter ist (da sich alle Teilseiten auf dasselbe Thema beziehen) und zeigt dem User deshalb in den Suchergebnissen m\u00f6glicherweise nicht die Seite an, die am hilfreichsten f\u00fcr ihn w\u00e4re. Dar\u00fcber hinaus f\u00fchrt die unabh\u00e4ngige Indexierung<\/a> der Teilseiten dazu, dass die einzelnen Seiten miteinander konkurrieren, wodurch das Ranking jeder einzelnen Seite beeintr\u00e4chtigt wird, da sich die Link Power entsprechend aufteilt.\n<\/p>\n

Um diesen Problemen zu begegnen, gibt es zwei Konfigurationsm\u00f6glichkeiten f\u00fcr eine SEO-freundliche Pagination, n\u00e4mlich die Erstellung einer View-All-Seite oder die Nutzung der Attribute rel=\u201dnext\u201d und rel=\u201dprev\u201d.\n<\/p>\n

View-All-Seite<\/span><\/h3>\n
\n
\"View-All-Seite<\/a> <\/p>\n
Abbildung:<\/b> View-All-Seite – Autor: Seobility – Lizenz: CC BY-SA 4.0<\/a><\/div>\n<\/div>\n<\/div>\n

Bei Anwendung der ersten Variante wird eine View-All-Seite genutzt, die den gesamten aufgeteilten Inhalt auf einer Seite b\u00fcndelt und von Google zur Indexierung herangezogen werden soll. Im obigen Online-Shop-Beispiel w\u00fcrden also alle Produkte einer Kategorie zus\u00e4tzlich auf einer einzelnen Seite zusammengefasst werden. In den Suchergebnissen werden solche \u00dcbersichtsseiten von Usern bevorzugt, da sie alle Informationen, nach denen der User sucht, auf einer Seite vereinen und deshalb nicht mehrere Seiten geladen werden m\u00fcssen.\n<\/p>\n

Wie Maile Ohye in einem Google Webmaster Video beschreibt<\/a>, erkennt Google solche View-All-Seiten und zieht sie automatisch zur Indexierung heran, wobei die Link Power aller Einzelseiten auf die \u00dcbersichtsseite geb\u00fcndelt wird. Wer trotzdem auf Nummer sicher gehen will, kann einen Canonical Tag<\/a> auf die Teilseiten setzen, der Google zus\u00e4tzlich auf die \u00dcbersichtsseite hinweist:\n<\/p>\n

\n
\u201cIf you have a view-all page available, Google will automatically try to detect that, send searchers there as well as consolidate your indexing properties. […].The second option is to actually use rel=\u201dcanonical\u201d to explicitly hint to Google what is your view-all page.\u201d (Maile Ohye, Developer Programs Tech Lead)<\/i><\/dd>\n<\/dl>\n

Dieser Link kann zum Beispiel folgenderma\u00dfen aussehen:\n<\/p>\n

<link rel=\u201dcanonical\u201d href=\u201dhttps:\/\/www.example.com\/page\/view-all\/\u201d><\/pre>\n
Wenn Webmaster sich f\u00fcr eine View-All-Seite entscheiden, ist es jedoch wichtig, darauf zu achten, dass die Ladezeit dieser \u00dcbersichtsseite nicht zu lang ist. Dabei sollte ein Richtwert von etwa 4 Sekunden nicht \u00fcberschritten werden. Zudem muss die Seite f\u00fcr den User immer noch einfach zu navigieren sein, um die Usability nicht einzuschr\u00e4nken. Da es jedoch insbesondere bei sehr gro\u00dfen Websites nicht immer m\u00f6glich (oder gew\u00fcnscht) ist, eine View-All-Seite zu erstellen, die diesen Anforderungen gerecht wird, gibt es eine zweite Alternative f\u00fcr die Konfiguration einer Pagination, n\u00e4mlich die Verwendung der Attribute rel=\u201dnext\u201d und rel=\u201dprev\u201d.\n<\/p>\n
rel=\u201dnext\u201d\/\u201dprev\u201d<\/span><\/h3>\n
\n
\"rel="next"\/"prev"<\/a>  <\/p>\n
Abbildung:<\/b> rel=“next“\/“prev“ – Autor: Seobility – Lizenz: CC BY-SA 4.0<\/a><\/div>\n<\/div>\n<\/div>\n
Durch das Einf\u00fcgen der Attribute rel=\u201dnext\u201d und rel=\u201dprev\u201d im Head-Bereich einer Webseite signalisiert man Google die Zusammengeh\u00f6rigkeit einzelner Seiten. Die Attribute zeigen den jeweiligen Vorg\u00e4nger (rel=\u201dprev\u201d) und Nachfolger (rel=\u201dnext\u201d) einer Seite an.\n<\/p>\n
Nachfolgendes Beispiel soll die richtige Verwendung der Attribute verdeutlichen:
\nAngenommen, eine Website verwendet eine Pagination bestehend aus drei Einzelseiten mit den folgenden URLs:\n<\/p>\n
Seite 1: https:\/\/www.example.com\/page1.html\n<\/p>\n
Seite 2: https:\/\/www.example.com\/page2.html\n<\/p>\n
Seite 3: https:\/\/www.example.com\/page3.html\n<\/p>\n
Da Seite 1 keinen Vorg\u00e4nger, sondern nur einen Nachfolger besitzt, wird im Head-Bereich nur das rel=\u201dnext\u201d Attribut verwendet:\n<\/p>\n
<link rel=\u201dnext\u201d href=\u201dhttps:\/\/www.example.com\/page2.html\u201d><\/pre>\n
Auf Seite 2 hingegen sind beide Attribute erforderlich:\n<\/p>\n
<link rel=\u201dprev\u201d href=\u201dhttps:\/\/www.example.com\/page1.html\u201d><\/pre>\n
<link rel=\u201dnext\u201d href=\u201dhttps:\/\/www.example.com\/page3.html\u201d><\/pre>\n
Auf der letzten Seite ist dann wiederum nur ein rel=\u201dprev\u201d Attribut n\u00f6tig:\n<\/p>\n
<link rel=\u201dprev\u201d href=\u201dhttps:\/\/www.example.com\/page2.html\u201d><\/pre>\n
Bei korrekter Umsetzung dieser Anmerkungen behandelt Google die einzelnen Seiten als Einheit und b\u00fcndelt deren Relevanz. In der Regel wird dann die erste Seite in den Suchergebnissen angezeigt, da diese meist am relevantesten f\u00fcr die Nutzer ist. Die Nutzung der Attribute empfiehlt sich auch, wenn zwar eine View-All-Seite vorhanden ist, aber der Webmaster m\u00f6chte, dass stattdessen eine Teilseite indexiert und in den Suchergebnissen angezeigt wird.\n<\/p>\n
Bei Anwendung dieser Alternative ist zu beachten, dass Parameter wie Session-IDs<\/a>, die den Inhalt der Seite nicht ver\u00e4ndern, auch in den rel=\u201dnext\u201d\/\u201dprev\u201d Attributen enthalten sein sollten.\n<\/p>\n
Ein Canonical Link auf die erste Seite der Pagination darf in diesem Fall nicht verwendet werden, da dieser nur f\u00fcr Duplicate Content<\/a> bestimmt ist und der Inhalt von Teilseite 2 nicht dem Inhalt von Teilseite 1 entspricht.\n<\/p>\n
Weiterhin ist zu beachten, dass die Attribute nur einen Hinweis an Google darstellen und deren Ber\u00fccksichtigung f\u00fcr die Suchmaschine nicht verpflichtend ist.\n<\/p>\n
\n
Update (22.03.2019):<\/b> Google hat am 21. M\u00e4rz 2019 \u00fcber Twitter bekannt gegeben, dass es rel=“next“\/“prev“ Attribute schon seit Jahren nicht mehr bei der Indexierung ber\u00fccksichtigt<\/a>. Google empfiehlt stattdessen, wenn m\u00f6glich, alle Inhalte auf einer Seite bereitzustellen, da diese Variante grunds\u00e4tzlich auch von Nutzern bevorzugt wird. Generell sollten Webmaster aber die Variante w\u00e4hlen, die im individuellen Anwendungsfall das beste Ergebnis f\u00fcr Nutzer liefert<\/a>. Websites, die rel=“next“\/“prev“ verwenden, k\u00f6nnen dies also weiterhin tun, zumal das Markup (teilweise) von anderen Suchmaschinen und von Browsern ber\u00fccksichtigt wird.\n<\/p>\n<\/div>\n
Weitere Aspekte im Hinblick auf die Pagination<\/span><\/h2>\n
Auch wenn in den obigen Ausf\u00fchrungen der Canonical Link f\u00fcr View-All-Seiten empfohlen wurde und die rel=\u201dnext\u201d\/\u201dprev\u201d Attribute als alternative Konfigurationsm\u00f6glichkeit beschrieben wurden, sollten Webmaster beachten, dass es sich hierbei um voneinander unabh\u00e4ngige Ans\u00e4tze handelt und deshalb beide Anmerkungen gleichzeitig auf einer Seite vorhanden sein k\u00f6nnen. Konkret bedeutet das, dass zus\u00e4tzlich zu den rel=\u201dnext\u201d\/\u201dprev\u201d Links auch ein Canonical Link vorhanden sein kann, mit dem die Seite auf sich selbst verweist.\n<\/p>\n
Eine h\u00e4ufige Vorgehensweise, die allerdings nur bedingt zu empfehlen ist, ist die Verwendung von \u201cnoindex<\/a>, follow\u201d im Robots Meta Tag<\/a>, um die Indexierung der Seiten 2 bis n einer Pagination zu verhindern. Dies ist deshalb problematisch, da Google den Links auf noindex Seiten ab einem gewissen Zeitraum nicht mehr folgt<\/a>. Somit k\u00f6nnen beispielsweise bei Online-Shops wichtige interne Links<\/a> f\u00fcr einzelne Produkte verloren gehen. Dar\u00fcber hinaus ist die Verwendung von \u201cnoindex, follow\u201d f\u00fcr die Seiten 2 bis n auch bei redaktionellen Artikeln nicht sinnvoll, da sich die Information, nach der ein User sucht, beispielsweise auch auf Seite 2 eines Artikels befinden kann. Zudem w\u00fcrde dann nicht der vollst\u00e4ndige Text f\u00fcr die inhaltliche Einordnung des Artikels durch Google zur Verf\u00fcgung stehen. Aus diesem Grund sollte man die Anweisung nur dann verwenden, wenn sich auf den Folgeseiten einer Pagination keine wichtigen Inhalte oder internen Verlinkungen befinden.\n<\/p>\n
Ein weiterer wichtiger Aspekt betrifft die gestalterische Umsetzung der Pagination. Diese sollte grunds\u00e4tzlich immer mit Zahlen statt nur mit \u201cVor\u201d und \u201cZur\u00fcck\u201d Links realisiert werden, da dies nicht nur f\u00fcr User \u00fcbersichtlicher sondern auch f\u00fcr Google besser verst\u00e4ndlich ist. Google selbst liefert hierf\u00fcr ein gutes Beispiel:\n<\/p>\n
\"Pagination\n<\/p>\n
Screenshot mit Pagination von google.de<\/a>\n<\/p>\n
Dieses Beispiel verdeutlicht zudem einen weiteren Aspekt, der bei Seitennummerierungen beachtet werden sollte: die aktuelle Seite (also hier Seite 3) sollte nicht mit einem Link versehen sein und daf\u00fcr optisch hervorgehoben werden.\n<\/p>\n
Au\u00dferdem ist es empfehlenswert, immer die erste und letzte Seite der Pagination mit anzugeben, wie es beispielsweise hier der Fall ist:\n<\/p>\n
\"Pagination\n<\/p>\n
Screenshot mit Pagination von kleiderkreisel.de<\/a>\n<\/p>\n
Dies erm\u00f6glicht es dem Google Crawler<\/a> die vollst\u00e4ndige Pagination schnell zu erfassen, ohne dass er sich durch mehrere Ebenen der Website navigieren muss (also z.B. von Seite 1 zuerst auf Seite 5, dann auf Seite 10 usw. bis er bei Seite 18 ankommt).\n<\/p>\n
Hinsichtlich des Aufbaus der Pagination kann au\u00dferdem die Usability erh\u00f6ht werden, indem mit sprachlichen Elementen (\u201cZur\u00fcck\u201d, \u201cWeiter\u201d, \u201cletzte Seite\u201d, \u201cerste Seite\u201d) gearbeitet wird, die f\u00fcr den User im Gegensatz zu unterschiedlichen Pfeil-Varianten unmissverst\u00e4ndlich sind.\n<\/p>\n
Weiterhin ist (insbesondere bei der Verwendung von Zahlen) auf einen ausreichend gro\u00dfen Abstand zwischen den einzelnen Links zu achten.\n<\/p>\n
Praxisbeispiele<\/span><\/h2>\n
Ein Beispiel f\u00fcr eine Pagination, bei der eine View-All-Seite vorhanden ist, findet sich bei zeit.de. Hier werden die Artikel auf mehrere Seiten aufgeteilt und es wird au\u00dferdem f\u00fcr jeden Artikel eine zus\u00e4tzliche View-All-Seite bereitgestellt, auf der der vollst\u00e4ndige Artikel zu finden ist. Allerdings wird auf der Website ebenfalls mit rel=\u201dprev\u201d\/\u201dnext\u201d gearbeitet und jede Teilseite enth\u00e4lt zus\u00e4tzlich einen Canonical Link auf sich selbst. Das Beispiel verdeutlicht, dass sich die Verwendung einer View-All-Seite und der Attribute rel=\u201dnext\u201d\/\u201dprev\u201d nicht ausschlie\u00dfen m\u00fcssen und dass es nicht immer erw\u00fcnscht ist, dass die View-All-Seite in den Suchergebnissen angezeigt wird.\n<\/p>\n
\"Pagination\n<\/p>\n
Screenshot mit Pagination von zeit.de<\/a>\n<\/p>\n
\n\"Pagination\n<\/p>\n
Screenshot mit Canonical Link und rel=\u201dprev\u201d\/\u201dnext\u201d von zeit.de<\/a>\n<\/p>\n
\nEin weiteres gutes Beispiel f\u00fcr eine Pagination ohne View-All-Seite findet man bei bonprix.de. Hier wird die Pagination im HTML-Code ebenfalls mit den Attributen rel=\u201dnext\u201d\/\u201dprev\u201d umgesetzt.\n<\/p>\n
\"Pagination\n<\/p>\n
Screenshot mit Pagination von bonprix.de<\/a>\n<\/p>\n
\n\"Pagination\n<\/p>\n
Screenshot mit rel=\u201dprev\u201d\/\u201dnext\u201d Attributen von bonprix.de<\/a>\n<\/p>\n
\nDie Beispiele zeigen, dass die Verwendung der rel=\u201dnext\u201d\/\u201dprev\u201d Attribute meist die bevorzugte Variante darstellt und eine View-All-Seite somit nicht zwingend f\u00fcr eine Pagination vorhanden sein muss.\n<\/p>\n
Weiterf\u00fchrende Links<\/span><\/h2>\n