# Pagination
Teilt eine lange Liste in Seiten auf und wechselt zwischen ihnen, indem es angibt, wo sich die Person befindet und wie viel noch übrig ist.
## Playground
```html
```
## Wann verwenden
- Wenn eine Tabelle oder Liste etwa 25 bis 50 Zeilen überschreitet.
## Wann nicht verwenden
- **Wenige Zeilen:** zeige sie alle an.
- **Infinite scroll:** nein. Es verbirgt das Footer, erlaubt nicht den Rückgang zum gleichen Ort und verwirrt Screenreader.
## Beispiele
### Seiten und pro Seite
Vorherige und Nächste in Worten, die aktuelle Seite mit der Tinte markiert, die Anzahl und optional die Anzahl der Elemente pro Seite.
Code anzeigen
```html
```
## Variationen
- **Erschte und letzte Seite:** ein Link, der nirgendwohin führt; er verschwindet; er ist nicht deaktiviert.
- **Viele Seiten:** die erste, die letzte und die Nachbarn der aktuellen mit einem Ellipsenzeichen dazwischen.
- **Bei Änderung der Größe:** die neue Seite beginnt bei dem ersten Element, das die Person sah.
- **Alles passt auf eine Seite:** der ganze Komponente verschwindet; wenn nur die Zahlen bleiben, bleibt "Pro Seite" stehen.
## Anatomie
1. **Vorherige und Nächste:** Wort mit dem Pfeil; sie verschwinden auf der ersten und letzten Seite.
2. **Aktuelle Seite:** Tinte markierung, kein Link.
3. **Nächster:** immer am Ende der Zeile.
4. **Zähler:** wo sich die Person befindet und wie viel insgesamt.
5. **Pro Seite:** optional.
## Do and don't
Do
Sagt, wo sich die Person befindet und wie viel noch übrig ist.
Don’t
Nur Pfeile, keine Zahl, keine Gesamtzahl.
## Barrierefreiheit
- Ein benanntes `