Lernen/On-Page-SEO

Meta-Tags (Titel & Beschreibung)

KurzfassungIhr Meta-Titel und Ihre Meta-Beschreibung erscheinen in den Google-Suchergebnissen. Ein guter Titel bringt Klicks. Fehlt die Beschreibung, schreibt Google oft selbst eine - meistens schlecht.

Was sind Meta-Tags?

Meta-Tags sind HTML-Elemente im <head> Ihrer Seite, die Suchmaschinen und sozialen Plattformen Informationen ueber die Seite geben. Die zwei wichtigsten fuer SEO sind der Title Tag und die Meta Description.

Der Title Tag ist der blaue klickbare Link in den Suchergebnissen. Die Meta Description ist der graue Text darunter. Zusammen sind sie Ihr Pitch mit rund 160 Zeichen an jede Person, die Sie bei Google findet.

Warum sie fuer Rankings wichtig sind

Title Tags beeinflussen Rankings direkt. Google nutzt den Title Tag, um zu verstehen, worum es auf Ihrer Seite geht. Eine Seite mit dem Titel "Pricing" rankt anders als "AI Website Builder Pricing - Plaene ab $149/mo". Der Title Tag ist eines der staerksten On-Page-Signale.

Meta Descriptions beeinflussen die Klickrate. Google nutzt Beschreibungen nicht direkt fuer Rankings, aber die CTR ist ein Ranking-Signal. Eine gute Beschreibung, die zur Suchintention passt, bringt mehr Klicks. Das signalisiert Google, dass Ihr Ergebnis relevant ist.

Was ohne sie passiert:

  • Kein Title Tag: Google erzeugt einen aus dem Seiteninhalt, oft holprig
  • Keine Description: Google zieht irgendeinen Textausschnitt von der Seite
  • Titel zu lang (ueber 60 Zeichen): wird mit "..." abgeschnitten
  • Beschreibung zu lang (ueber 155 Zeichen): endet mitten im Satz

Die Richtwerte:

  • Title Tags sollten 50-60 Zeichen lang sein
  • Descriptions sollten 110-155 Zeichen lang sein
  • Seiten mit eigener Meta Description haben laut Ahrefs im Schnitt eine hoehere CTR als Seiten ohne

Wie es in der Praxis funktioniert

In HTML:

<title>AI Website Builder Pricing - Plaene ab $149/mo | Webentity</title>
<meta name="description" content="Vergleichen Sie Webentitys Build- und Grow-Plaene. KI-native Websites mit automatisiertem SEO, Content-Agenten und taeglichem Keyword-Tracking." />

In Next.js (so wie bei Webentity):

export const metadata: Metadata = {
  title: "AI Website Builder Pricing - Plaene ab $149/mo | Webentity",
  description: "Compare Webentity's Build and Grow plans...",
};

So schreiben Sie gute Titel:

  • Das wichtigste Keyword moeglichst weit vorne platzieren
  • Den Markennamen einbauen, meist am Ende nach einem Trenner
  • Konkret werden: "AI Website Builder" ist besser als "Unsere Plattform"
  • Zahlen nutzen, wenn sie helfen: "$149/mo", "5 Wochen", "21 Rankings"

So schreiben Sie gute Beschreibungen:

  • Den Nutzen der Seite zusammenfassen, nicht nur das Thema
  • Wenn passend, eine Handlungsaufforderung einbauen ("Plaene ansehen", "Case Study lesen")
  • Die Suchintention treffen: Wer nach "pricing" sucht, will den Preis sehen
  • Keine Keywords stopfen - fuer Menschen schreiben, die entscheiden, ob sie klicken

Open-Graph- und Twitter-Tags sind das soziale Gegenstueck. Sie steuern, was erscheint, wenn jemand Ihren Link auf LinkedIn, X oder in Slack teilt:

<meta property="og:title" content="..." />
<meta property="og:description" content="..." />
<meta property="og:image" content="https://example.com/og-image.png" />

Hauefige Fehler:

  • Auf jeder Seite derselbe Titel
  • Keyword-Stuffing im Titel
  • Descriptions, die nicht zum Seiteninhalt passen
  • Kein OG-Bild, wodurch Social Shares generisch aussehen
  • Nicht zu pruefen, wie Titel in verschiedenen Laengen dargestellt werden

So handhabt Webentity das

Jede Seite auf einer Webentity-Website bekommt beim Build sauber gesetzte Meta-Tags. Bei Blogposts kommen Titel und Beschreibung aus dem Frontmatter - und werden beim Build validiert, damit Titel unter 60 Zeichen und Beschreibungen unter 155 Zeichen bleiben.

Bei Seiten, die von KI-Agenten erzeugt werden, schreiben die Agenten Meta-Titel und Meta-Beschreibung direkt im Content-Prozess mit. Optimiert fuer Suchintention und Klickrate.

Open-Graph-Tags werden global und pro Seite gesetzt. Es gibt ein Standard-OG-Bild, das pro Beitrag ueberschrieben werden kann. Dadurch sehen Social Shares immer ordentlich aus.