<title>
Zuletzt aktualisiert am 3. Februar 2026
Das <title> Element definiert den Titel deiner Webseite. Dieser erscheint im Browser-Tab, in Lesezeichen, in den Suchergebnissen von Google und Co., und wenn jemand deine Seite auf Social Media teilt. Es ist eines der wichtigsten Elemente für SEO und Benutzererfahrung.
Grundlagen
Das <title> Element ist ein Pflichtelement in jedem HTML-Dokument und muss im <head> Bereich stehen. Es darf nur einmal pro Seite vorkommen und darf nur Text enthalten – keine HTML-Tags.
Der Titel sollte für jede Seite deiner Website einzigartig sein und präzise beschreiben, worum es auf der jeweiligen Seite geht. Suchmaschinen verwenden den Titel als Hauptüberschrift in den Suchergebnissen, deshalb ist er extrem wichtig für SEO.
Idealerweise ist der Titel zwischen 50 und 60 Zeichen lang. Längere Titel werden in Suchergebnissen und Browser-Tabs abgeschnitten.
Syntax
<!DOCTYPE html>
<html lang="de">
<head>
<title>Meine erste Webseite</title>
</head>
<body>
<p>Inhalt</p>
</body>
</html>Beispiele
Einfacher Seitentitel
<!DOCTYPE html>
<html lang="de">
<head>
<title>Über uns</title>
</head>
<body>
<h1>Über unser Team</h1>
</body>
</html>SEO-optimierter Titel
<!DOCTYPE html>
<html lang="de">
<head>
<title>HTML Tutorial für Anfänger — Programmieren mit Mario</title>
</head>
<body>
<h1>HTML Tutorial</h1>
</body>
</html>Ein gutes Muster für SEO-Titel ist: “Primary Keyword — Markenname”. Das gibt Suchmaschinen klare Signale und Nutzer erkennen sofort, worum es geht und wer die Quelle ist.
Dynamischer Titel für verschiedene Seiten
<!-- Startseite -->
<!DOCTYPE html>
<html lang="de">
<head>
<title>Startseite — Meine Website</title>
</head>
<body>
<p>Willkommen</p>
</body>
</html>
<!-- Blog-Seite -->
<!DOCTYPE html>
<html lang="de">
<head>
<title>Blog — Meine Website</title>
</head>
<body>
<p>Alle Blog-Artikel</p>
</body>
</html>
<!-- Kontakt-Seite -->
<!DOCTYPE html>
<html lang="de">
<head>
<title>Kontakt — Meine Website</title>
</head>
<body>
<p>Kontaktformular</p>
</body>
</html>Jede Seite sollte ihren eigenen, einzigartigen Titel haben, der den Inhalt dieser spezifischen Seite beschreibt.
Barrierefreiheit
Das <title>-Element ist für die Barrierefreiheit wichtiger, als viele denken:
- Screenreader lesen den Titel zuerst vor: Wenn ein Screenreader eine Seite lädt, ist der Titel die erste Information, die der Nutzer hört. Ein guter Titel gibt sofort Orientierung, auf welcher Seite man sich befindet.
- Tab-Navigation: Nutzer, die zwischen mehreren Tabs wechseln, sind auf aussagekräftige Titel angewiesen. Ein generischer Titel wie “Seite 1” hilft niemandem, den richtigen Tab zu finden.
- Seitenwechsel ankündigen: In Single-Page-Applications (SPAs) wird der Titel oft per JavaScript aktualisiert. Wenn sich der Titel ändert, erkennen Screenreader, dass eine neue Seite geladen wurde. Bleibt der Titel gleich, bemerkt der Nutzer den Seitenwechsel möglicherweise nicht.
- Eindeutiger Titel pro Seite: Jede Seite sollte einen einzigartigen Titel haben, der den spezifischen Inhalt beschreibt. Das erleichtert die Navigation über Browser-Verlauf und Lesezeichen — besonders für Nutzer assistiver Technologien.
Häufige Fehler
Fehlendes title Element – Wenn du das <title> Element vergisst, zeigt der Browser oft die URL oder “Untitled” im Tab an. Außerdem wird deine Seite von Suchmaschinen schlechter bewertet.
Zu langer Titel – Google zeigt in den Suchergebnissen etwa 50-60 Zeichen an. Alles darüber wird abgeschnitten und mit ”…” ersetzt. Halte deine Titel prägnant.
Gleicher Titel auf allen Seiten – Viele Anfänger verwenden denselben Titel auf allen Unterseiten. Das ist schlecht für SEO und verwirrt Nutzer. Jede Seite braucht einen einzigartigen Titel, der ihren spezifischen Inhalt beschreibt.
HTML-Tags im Titel – Das <title> Element darf nur Text enthalten, keine HTML-Tags. <title>Meine <strong>tolle</strong> Seite</title> ist ungültig und wird fehlerhaft angezeigt.
Keyword-Stuffing – Vermeide es, zu viele Keywords in den Titel zu packen. “HTML Tutorial Anfänger Webentwicklung lernen HTML Kurs” ist unnatürlich und wird von Suchmaschinen abgestraft. Schreibe für Menschen, nicht für Algorithmen.
Browser-Kompatibilität
Das title-Element wird von allen Browsern vollständig unterstützt und gehört zum HTML-Standard seit der ersten Version.
| Client | Unterstützung | Hinweise |
|---|---|---|
| Chrome | Komplett | — |
| Firefox | Komplett | — |
| Safari | Komplett | — |
| Edge | Komplett | — |
| Opera | Komplett | — |
Email-Kompatibilität
Email-Clients ignorieren das title-Element komplett. In HTML-Emails wird stattdessen die Betreffzeile als Titel verwendet.
| Client | Unterstützung | Hinweise |
|---|---|---|
| Apple Mail | Keine | Das title-Element wird ignoriert. |
| Gmail | Keine | Gmail ignoriert das title-Element. |
| Outlook | Keine | Outlook verwendet die Betreffzeile statt title. |
| Thunderbird | Keine | Das title-Element wird nicht ausgewertet. |
| Yahoo Mail | Keine | Das title-Element wird ignoriert. |
Verwandte Elemente
Bleib auf dem Laufenden
Erhalte neue Inhalte direkt in dein Postfach
Was erwartet dich?
Neue Artikel & Videos
Wenn ich was Neues veröffentliche, erfährst du's hier zuerst.
Plattform & Kurs-Updates
Neue Kurse, Referenz-Updates und gelegentlich Sonderpreise zum Launch.
Einmal die Woche in deinem Postfach
Kurz, auf den Punkt, kein Spam.