ONMA Ratgeber

Homepage und Unterseite: wie die Seiten eines Internetauftritts zusammenhängen

Wie Unterseiten zur Startseite und zueinander gehören: übliche Seitentypen, sinnvolle Ebenen und die Rückwege über Breadcrumbs, Logo und Fußzeile.

Die Homepage ist die Startseite eines Internetauftritts, die Unterseiten sind alles, was darunter liegt. Wer beides sauber zueinander in Beziehung setzt, beantwortet damit drei praktische Fragen: Was gehört überhaupt auf eine eigene Seite, wo hängt diese Seite im Aufbau, und wie kommen Besucher von dort wieder zurück oder weiter. Dieser Text beschreibt genau diese Zuordnung innerhalb eines mehrseitigen Auftritts.

Kurz abgegrenzt: Website, Webseite, Homepage

Eine Website ist eine zusammengehörige Sammlung verlinkter Webseiten, die in der Regel unter einem gemeinsamen Domainnamen erreichbar sind. Eine Webseite dagegen ist ein einzelnes Dokument im Web, also eine Seite dieses Auftritts. Als Homepage wird technisch die Haupt- beziehungsweise Startseite einer Website bezeichnet, im Alltag benutzen viele den Begriff für den gesamten Internetauftritt. Eine Unterseite ist in dieser Logik jede Seite des Auftritts, die nicht die Startseite ist. Mehr Begriffsklärung braucht es hier nicht, interessant wird es erst bei der Frage, wie diese Seiten zusammenspielen.

Die Startseite ist ein Verteiler, kein Sammelbecken

Die Startseite hat eine Doppelrolle. Sie beantwortet in wenigen Sekunden, worum es hier geht und für wen, und sie verteilt Besucher auf die Seiten, die ihr eigentliches Anliegen abdecken. Beide Aufgaben vertragen sich schlecht mit dem Versuch, alle Inhalte schon auf der Startseite unterzubringen.

Die Faustregel für den Schnitt: Ein Thema bekommt eine eigene Unterseite, wenn es einen eigenen Anlass hat, danach zu suchen, und wenn man dieser Seite eine eigene, klare Überschrift geben kann. Überschriften und Beschriftungen sollen das Thema oder den Zweck des nachfolgenden Inhalts verständlich beschreiben. Wenn eine Überschrift für eine geplante Unterseite nur “Sonstiges” oder “Weitere Infos” lauten kann, ist der Schnitt an der falschen Stelle gesetzt.

Auf der Startseite steht dann nicht der ganze Inhalt, sondern der Einstieg dazu: eine kurze Einordnung und ein benannter Weg dorthin.

Seitentypen, die in fast jedem Auftritt vorkommen

Die meisten mehrseitigen Auftritte bestehen aus wenigen wiederkehrenden Typen:

  • Leistungs- oder Produktseiten. Eine Seite pro Angebot, nicht eine Seite für alle Angebote zusammen.
  • Über uns oder Team. Wer dahintersteht, oft mit Einzelseiten je Person bei größeren Teams.
  • Referenzen, Projekte, Fallbeispiele. Übersicht plus Detailseiten.
  • Blog oder Ratgeber. Eine Übersicht, darunter die einzelnen Beiträge.
  • Kontakt. Der Abschluss fast jeder Besucherreise.
  • Pflichtseiten wie Impressum und Datenschutz, in der Regel aus der Fußzeile erreichbar.

Typisch sind dabei zwei Muster: die Einzelseite, die für sich steht, und das Paar aus Übersichtsseite und Detailseiten. Die Übersicht ist selbst eine Unterseite der Startseite und gleichzeitig die übergeordnete Seite ihrer Details. Genau an dieser Stelle entsteht Hierarchie, ganz ohne Technik.

Ebenen, Geschwister und Querverweise

Ein Internetauftritt ist damit ein Baum mit wenigen Ebenen. Ebene eins ist die Startseite, Ebene zwei sind die Hauptbereiche, Ebene drei die Details innerhalb eines Bereichs. Für kleinere und mittlere Auftritte reichen diese Ebenen fast immer aus. Wer eine vierte oder fünfte Ebene braucht, hat meist zu fein geschnitten oder mischt zwei Ordnungen, etwa nach Thema und nach Zielgruppe gleichzeitig.

Seiten derselben Ebene innerhalb eines Bereichs sind Geschwisterseiten. Sie sollten sich inhaltlich nicht überlappen, sonst konkurrieren sie um dieselbe Frage und Besucher landen zufällig auf einer von beiden. Nützlich ist stattdessen der Querverweis: eine Leistungsseite, die auf die passende Referenz zeigt, ein Ratgeberbeitrag, der auf die zugehörige Leistung führt. Ein logischer Aufbau und aussagekräftige interne Links helfen sowohl Nutzern als auch Suchmaschinen dabei, wichtige Seiten zu finden und ihre Beziehungen zu verstehen.

Das Hauptmenü bildet die Ebenen eins und zwei ab, mehr nicht. Es ist die Landkarte des Auftritts, keine vollständige Inhaltsliste. Detailseiten der dritten Ebene erreicht man über ihre Übersichtsseite, nicht über ein dreifach verschachteltes Klappmenü.

Die Beschriftung im Menü entscheidet dabei mehr als die Anzahl der Punkte. Ein Menüpunkt sollte so heißen, wie die Seite dahinter beginnt, damit der Klick keine Überraschung ist.

Rückwege: wie Besucher wieder herauskommen

Der häufigste Fehler in der Zuordnung ist nicht der fehlende Hinweg, sondern der fehlende Rückweg. Besucher steigen oft direkt auf einer Detailseite ein, nicht auf der Startseite. Diese Seite muss deshalb von selbst erklären, wo sie steht.

Dafür haben sich vier Elemente etabliert:

  1. Breadcrumbs. Sie zeigen Nutzern die Position einer Seite innerhalb der Website-Hierarchie und ermöglichen die Navigation zu übergeordneten Ebenen. Auf Detailseiten sind sie der direkteste Rückweg zur Übersicht.
  2. Das verlinkte Logo. Die Konvention, dass das Logo oben links zur Startseite führt, ist so verbreitet, dass Besucher sie voraussetzen.
  3. Die Fußzeile. Sie trägt die Wege, die nicht ins Hauptmenü gehören, etwa Pflichtseiten und einzelne Querverweise.
  4. Suche und Seitenübersicht. WCAG 2.2 empfiehlt für Seiten außerhalb eines linearen Prozesses mehr als einen auffindbaren Zugangsweg, etwa Navigation, Suche oder eine Seitenübersicht. Bei größeren Auftritten ist das der Unterschied zwischen “gefunden” und “aufgegeben”.

Woran man merkt, dass die Zuordnung nicht stimmt

Drei Signale sind zuverlässig. Erstens: Eine Seite lässt sich nur über einen Link mitten im Fließtext erreichen und über keinen Menüweg. Zweitens: Zwei Seiten beantworten dieselbe Frage, und niemand im Team kann sagen, welche von beiden gemeint ist. Drittens: Um von einer Detailseite zu einer benachbarten Detailseite zu kommen, muss man den Weg über die Startseite nehmen, weil die Übersicht dazwischen fehlt.

Alle drei lassen sich ohne Umbau der Technik lösen, indem man den Baum aufzeichnet: Startseite oben, Bereiche darunter, Detailseiten an ihren Bereich gehängt. Jede Seite, die sich dabei nirgends einhängen lässt, gehört entweder in einen bestehenden Bereich eingearbeitet oder braucht einen eigenen.