<title>: Das Dokumenttitel-Element

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Das <title>-HTML-Element definiert den Dokumenttitel, der in der Titelleiste eines Browsers oder im Tab einer Seite angezeigt wird. Es enthält nur Text; HTML-Tags innerhalb des Elements werden, falls vorhanden, ebenfalls als einfacher Text behandelt.

html
<title>Grandma's Heavy Metal Festival Journal</title>

Attribute

Dieses Element umfasst nur die globalen Attribute.

Nutzungshinweise

Das <title>-Element wird immer innerhalb eines <head>-Blocks einer Seite verwendet.

Seitentitel und SEO

Der Inhalt eines Seitentitels kann erhebliche Auswirkungen auf die Suchmaschinenoptimierung (SEO) haben. Im Allgemeinen haben längere, beschreibende Titel eine bessere Leistung als kurze oder generische Titel. Der Inhalt des Titels ist einer der Faktoren, die von Suchmaschinenalgorithmen verwendet werden, um zu entscheiden, in welcher Reihenfolge Seiten in den Suchergebnissen gelistet werden. Außerdem ist der Titel der erste „Haken“, der die Aufmerksamkeit der Leser auf der Suchergebnisseite erregen soll.

Einige Richtlinien und Tipps für das Verfassen guter Titel:

  • Vermeiden Sie ein- oder zwei-Wort-Titel. Verwenden Sie eine beschreibende Phrase oder ein Begriffs-Definitions-Paar für Glossar- oder Referenzseiten.
  • Suchmaschinen zeigen typischerweise die ersten 55–60 Zeichen eines Seitentitels an. Text darüber hinaus kann verloren gehen, daher versuchen Sie, Titel nicht länger als das zu machen. Wenn Sie einen längeren Titel verwenden müssen, stellen Sie sicher, dass die wichtigen Teile früher erscheinen und dass nichts Kritisches im Teil des Titels enthalten ist, der wahrscheinlich entfernt wird.
  • Verwenden Sie keine „Keyword-Blobs“. Wenn Ihr Titel nur aus einer Liste von Wörtern besteht, verringern Algorithmen oft die Position Ihrer Seite in den Suchergebnissen.
  • Versuchen Sie, Ihre Titel auf Ihrer eigenen Website so einzigartig wie möglich zu machen. Doppelte oder nahezu doppelte Titel können zu ungenauen Suchergebnissen führen.

Barrierefreiheit

Es ist wichtig, einen genauen und prägnanten Titel bereitzustellen, um den Zweck der Seite zu beschreiben.

Eine gängige Navigationstechnik für Benutzer von unterstützenden Technologien besteht darin, den Seitentitel zu lesen und daraus den Inhalt der Seite zu schließen. Dies liegt daran, dass es ein zeitaufwändiger und potenziell verwirrender Prozess sein kann, in eine Seite zu navigieren, um deren Inhalt zu bestimmen. Titel sollten auf jeder Seite einer Website einzigartig sein und idealerweise den Hauptzweck der Seite zuerst zeigen, gefolgt vom Namen der Website. Das Befolgen dieses Musters hilft sicherzustellen, dass der Hauptzweck der Seite zuerst von einem Screenreader bekannt gegeben wird. Dies bietet eine weitaus bessere Erfahrung, als für jede Seite, zu der ein Benutzer auf derselben Website navigiert, den Namen einer Website hören zu müssen, bevor der einzigartige Seitentitel kommt.

Beispiele

html
<title>Menu - Blue House Chinese Food - FoodYum: Online takeout today!</title>

Wenn eine Formulareinsendung Fehler enthält und die Einsendung die aktuelle Seite neu rendert, kann der Titel verwendet werden, um Benutzer auf etwaige Fehler in ihrer Einsendung aufmerksam zu machen. Beispielsweise aktualisieren Sie den Seiten-title-Wert, um signifikante Zustandsänderungen der Seite (z. B. Probleme bei der Formularvalidierung) widerzuspiegeln.

html
<title>
  2 errors - Your order - Sea Food Store - Food: Online takeout today!
</title>

Hinweis: Derzeit wird das dynamische Aktualisieren eines Seitentitels nicht automatisch von Screenreadern angekündigt. Wenn Sie den Seitentitel aktualisieren, um signifikante Änderungen des Seitenzustands widerzuspiegeln, kann die Verwendung von ARIA Live Regions erforderlich sein.

Beispiele

html
<title>Awesome interesting stuff</title>

Dieses Beispiel erstellt eine Seite, deren Titel (wie oben im Fenster oder im Tab des Fensters angezeigt) "Awesome interesting stuff" lautet.

Technische Zusammenfassung

Inhaltskategorien Metadaten-Inhalt.
Erlaubter Inhalt Text, der nicht aus Zwischen-Element-Leerzeichen besteht.
Tag-Auslassung Sowohl öffnende als auch schließende Tags sind erforderlich. Beachten Sie, dass das Weglassen von </title> dazu führen sollte, dass der Browser den Rest der Seite ignoriert.
Erlaubte Eltern Ein <head>-Element, das kein anderes <title>-Element enthält.
Implizite ARIA-Rolle Keine entsprechende Rolle
Erlaubte ARIA-Rollen Keine role erlaubt.
DOM-Schnittstelle [`HTMLTitleElement`](/de/docs/Web/API/HTMLTitleElement)

Spezifikationen

Specification
HTML
# the-title-element

Browser-Kompatibilität

Siehe auch