Ein Reiter (Tab) ist ein Bedienelement der grafischen Benutzeroberfläche, das mehrere Inhaltsbereiche kompakt unter einer Oberfläche organisiert und per Klick zugänglich macht.
Was bedeutet das?
Das Wort Reiter stammt aus der Bürosprache und bezeichnet die vorstehenden Laschen an Registerblättern in Hängeordnern. In der digitalen Welt hat sich das Konzept übertragen: Ein Tab ist eine beschriftete Schaltfläche, die beim Anklicken einen bestimmten Inhaltsbereich sichtbar macht und alle anderen Bereiche verbirgt. Das spart Platz und sorgt für eine übersichtliche Darstellung umfangreicher Inhalte.
Im Browser ist das Tab-Konzept allgegenwärtig. Jedes geöffnete Browser-Fenster kann mehrere Tabs gleichzeitig halten. Jeder Tab lädt eine eigene Webseite und läuft in einem weitgehend isolierten Prozess. Das ermöglicht es, viele Seiten gleichzeitig geöffnet zu halten, ohne den Browser für jede Seite separat starten zu müssen.
In Softwareoberflächen und Webanwendungen bezeichnet ein Tab zusätzlich eine UI-Komponente innerhalb einer einzelnen Seite. Formulare, Einstellungsseiten und Produktbeschreibungen verwenden Tab-Leisten, um verwandte Inhalte zu gruppieren. WordPress selbst setzt auf Tabs im Dashboard, beim Plugin-Installer, in der Gutenberg-Seitenleiste und in WooCommerce-Produktseiten. Themes bieten häufig einen Tab-Block oder Tab-Shortcode an, mit dem sich Inhalte auf Unternehmens- oder Leistungsseiten geordnet präsentieren lassen.
Beispiel aus der Praxis
Die WooCommerce-Produktseite zeigt standardmäßig drei Reiter: Beschreibung, Zusätzliche Informationen und Bewertungen. Statt alle Inhalte untereinander darzustellen, wählen Besucherinnen und Besucher den gewünschten Reiter und sehen sofort die relevanten Informationen. Plugins wie Tab Manager oder der Gutenberg-Gruppe-Block erlauben es, diese Tabs individuell anzupassen oder eigene Reiter hinzuzufügen.
Im WordPress-Plugin-Bereich findet sich das Tab-Muster ebenfalls in Einstellungsseiten. Ein Backup-Plugin listet zum Beispiel die Reiter Allgemein, Zeitplan, Speicherorte und Protokoll, sodass die vielen Optionen geordnet bleiben.
Häufiger Fehler
Wer wichtige Inhalte ausschließlich hinter Tabs versteckt, riskiert ein SEO-Problem. Suchmaschinen lesen zwar den gesamten Seiteninhalt, gewichten jedoch sichtbare Inhalte tendenziell stärker als versteckte. Texte, die sich erst nach einem Klick zeigen, werden möglicherweise weniger stark berücksichtigt als direkt sichtbare Inhalte. Für zentrale Keywords und Produktbeschreibungen empfiehlt es sich daher, die wichtigsten Informationen im ersten sichtbaren Abschnitt zu platzieren und Tabs nur für ergänzende Details zu nutzen.
Achten Sie außerdem darauf, Tab-Inhalte technisch korrekt zugänglich zu gestalten: Tastaturnavigation und ARIA-Attribute sorgen dafür, dass auch Nutzerinnen und Nutzer von Screenreadern die Reiter vollständig bedienen können.