Der Titel einer Seite

Der Titel einer Webseite spielt bei der Orientierung innerhalb eines Webauftritts eine wichtige Rolle. Zusammen mit einer schlüssigen Navigation, Suchfunktionen und ergänzenden Navigationsmechanismen sind sie Teil einer barrierefreien Nutzerführung. Dabei geht es insbesondere darum, dass das Thema oder der Zweck der Seite im Titel beschrieben wird. Beschreibende Seitentitel erlauben es verschiedenen Nutzergruppen, den Inhalt einer Webseite inhaltlich einzuordnen oder zu finden.

Fast immer ohne Kontext

Der Titel einer Seite wird von Browsern und Suchmaschinen vielfältig genutzt. Im Browser wird er

• in der Titelleiste,
• im Verlauf der besuchten Seiten,
• Beim Speichern von Lesezeichen oder
• In einem Browser-Tab

angezeigt. Suchmaschinen und andere Anwendungen zeigen den Titel in den Ergebnislisten an. In den meisten Fällen wird der Titel ohne Kontext gelesen, d.h. der Inhalt wird zwar mit anderen Inhalten angezeigt, aber die Inhalte der Seite selbst stehen nicht zur Verfügung bzw. müssen erst aufgerufen werden. Eine Beschreibung des Seiteninhalts im Titel ist vorteilhaft für alle Nutzende.

Angabe des Titels

Der Titel einer Seite wird mit dem TITLE-Element zu einer Webseite hinzugefügt. Nach der HTML-Spezifikation darf nur ein TITLE-Element pro Webseite vergeben werden. Üblicherweise wird es im Kopfbereich berücksichtigt:

Hinweis: Der Seitentitel sollte für Webseiten immer vergeben werden. Allerdings kann HTML auch beispielsweise in E-Mails genutzt werden, wo die Betreffzeile (und kein Titel) Thema oder Zweck der Nachricht beschreiben soll.

Gründe für sorgfältige Formulierung

Weil der Titel einer Seite in vielen Situationen ohne Kontext angezeigt wird, liegt es auf der Hand, Seitentitel inhaltsbezogen zu formulieren und von generischen Titeln Abstand zu halten. Neben der Nutzerfreundlichkeit spielt vor allem die Suchmaschinenoptimierung eine wichtige Rolle bei der Formulierung von Seitentiteln, da sie nicht zuletzt auch Einfluss auf das Ranking haben. Zumeist werden darüber hinaus die Titel von Webseiten in den Ergebnissen einer Suche aufgelistet.

Abgesehen davon, dass ein guter Seitentitel ohne Kontext Aufschluss über den Inhalt der Seite geben sollte, muss insbesondere auf die Bedeutung des Titels in einem Screenreader hingewiesen werden, denn das erste, was Screenreader über eine Seite mitteilen, ist der Seitentitel. Beschreibt der Seitentitel das Thema oder den Zweck einer Seite, können Screenreadernutzer entscheiden, ob sie sich zum Inhaltsbereich der Seite durchlesen oder ob sie sofort eine andere Seite aufrufen wollen.

Kriterien für barrierefreie Seitentitel

Was im Titel im Hinblick auf Suchmaschinenoptimierung berücksichtigt werden sollte wird in zahlreichen Beiträgen im Web beschrieben. Nachfolgend finden Sie einige Kriterien, die vor dem Hintergrund der Barrierefreiheit wichtig sind.

Seitentitel sollen kurz sein.

Wie lange ein Titel sein sollte, hängt von sehr vielen Faktoren ab. Für die Barrierefreiheit kommt es auf die angezeigten Zeichen in der Titelleiste des Browsers an. die maximal empfohlene Länge für Seitentitel im Hinblick auf Suchmaschinen variiert. 70 Zeichen ist ein guter Orientierungswert für die maximale Länge.

Seitentitel müssen beschreibend sein.

Web Content Accessibility Guidelines (WCAG) 2.2 sind beschreibende Seitentitel einzusetzen. Ein beschreibender Seitentitel identifiziert den Inhalt einer Seite und ist ohne Kontext nachvollziehbar.

Seitentitel für verschiedene Seiten müssen unterscheidbar sein.

Jeder Seitentitel muss sich möglichst von anderen Seitentiteln des gleichen Webauftritts unterscheiden. Nutzende können dann eine Beziehung zwischen einzelnen Seiten innerhalb eines Webauftritts besser herstellen z.B. in einer Sitemap oder in den Ergebnissen einer Suche. Wenn der Seitentitel für alle Seiten gleich lautet, kann im Übrigen die Konformität zur WCAG 2.2 nicht mehr erreicht werden (siehe dazu auch die Fehlertechnik F25 der WCAG 2.2, wo einige Beispiele für nicht zulässige Seitentitel aufgelistet werden).

Das Kriterium der Unterscheidbarkeit gilt auch für Webanwendungen: Wird die Seite nicht neu geladen, aber verändert sich der Inhalt der Seite, dann muss der Seitentitel dynamisch angepasst werden.

Seitenspezifische Begriffe sollten am Anfang des Titels stehen.

Wenn ein Seitentitel aus verschiedenen Teilen (z.B. Beschreibung des Inhalts und Domainname) besteht, sollte der seitenspezifische Teil vor allgemeineren Teilen stehen. Das hat allgemeine Vorteile, etwa dass bei mehreren geöffneten Tabs die Seiten besser identifiziert werden können, aber vor allem profitieren Screenreadernutzer davon, je früher Informationen über den Seiteninhalt im Titel stehen. Auch Überlegungen aus der Suchmaschinenoptimierung sprechen für diese Reihenfolge: Ist der Seitentitel zu lang und der spezifische Teil steht am Ende, dann kann der Inhaltsbezug möglicherweise nicht in den Suchergebnissen angezeigt werden.

Pfadangaben, wie bei Bread-Crumb-Pfaden, sollten im Titel nicht verwendet werden. Die Titel können dadurch sehr lang werden und der Inhaltsbezug befindet sich nicht am Anfang, sondern am Ende des Titels.

Erforderliche Anpassungen des Seitentitels

Der Titel einer Seite ist nicht nur für HTML-Dokumente wichtig, sondern auch für Webanwendungen. Solche Prozesse können sehr unterschiedliche Inhalte unter einer URI anzeigen. Bei dynamischen Anwendungen muss der Seitentitel angepasst werden, wenn der Inhalt der Seite ausgetauscht wird.

Der Seitentitel kann mit Javascript wie folgt geändert werden:

Auch Prozesse, die über mehrere einzelne Seiten ablaufen benötigen sorgfältig gewählte Seitentitel. Einige Beispiele sind:

1. Wenn ein Kontaktformular ausgefüllt und abgeschickt wird und dabei Eingabefehler angezeigt werden, dann sollte der Seitentitel einen Hinweis darauf enthalten.

   <title>Fehler bei der Eingabe im Kontaktformular - bitte korrigieren</title>

2. Ähnlich kann bei Bestätigungen nach dem Abschicken eines Formulars und anderen Hinweisen vorgegangen werden. Für eine Seite von Suchergebnissen kann der Titel z.B. wie folgt lauten:

   <title>20 bis 30 von 54 Ergebnissen für "Seitentitel"</title>

3. Auch mehrschrittige Formulare (Überweisungen im Online-Banking, Kaufabwicklung in einem E-Shop usw.) sollten die verschiedenen Schritte im Seitentitel berücksichtigen, z.B.:

   <title>Empfänger und Betrag eingeben (1/3 für Inlandsüberweisung)</title>
<title>Eingaben kontrollieren und PIN eingeben  (2/3 für Inlandsüberweisung)</title>
<title>Überweisung wurde erfolgreich übermittelt  (3/3 für Inlandsüberweisung)</title>

Namen für eingebettete HTML-Seiten

Eine Webseite benötigt nach Erfolgskriterium 2.4.2 normalerweise immer einen Seitentitel. Webseiten sind nach dem Glossar der WCAG 2.2 aber nicht-eingebettete Ressourcen. HTML-Seiten, die per iframe-Element in einer Webseite eingebettet werden, sind keine Webseiten und benötigen keine Seitentitel.

Wenn eine HTML-Seite per iframe-Element in einer Webseite eingebettet wird, wird ein Seitentitel mit dem title-Element von Assistenztechnologien unterschiedlich behandelt. Manchmal wird der Seitentitel ignoriert und manchmal nicht.

Weil ein Rahmen ein aktives Element ist und per Tab-Taste fokussiert werden kann, benötigt er einen Namen. Dieser wird mit einem title-Attribut festgelegt. Der Wert des title-Attributs wird zum Namen des Rahmens.

Assistenztechnologien wie Screenreader identifizieren den Inhalt eines iframe-Elements anhand des Namens des Rahmens. Der Wert des title-Attributs muss den eingebetteten Inhalt beschreiben:

Weil ein Rahmen einen Namen braucht, ist die Angabe eines Seitentitels für eingebettete HTML-Seiten redundant. Nur wenn die HTML-Seite als einzelne Webseite im Browser aufgerufen werden kann, benötigt die eingebettete Seite einen Seitentitel per title-Element.