html-tags für seo

HTML-Tags für SEO: Was WordPress-Benutzer wissen müssen

Wie wichtig sind HTML-Tags für SEO? Welche müssen Sie lernen?

HTML-Tags können beeinflussen, wie Ihr Inhalt in den Suchergebnissen erscheint und wie er eingestuft wird.

HTML-Tags sind also für die Suchmaschinenoptimierung unerlässlich, aber Sie können sie automatisch zu Ihren Inhalten hinzufügen lassen. Finden wir heraus, wie.

Was sind HTML-Tags für SEO?

Obwohl einige der unten aufgeführten HTML-Tags mehr als eine Verwendung haben, können sie sich alle darauf auswirken, wie Ihr Inhalt in den Suchmaschinenergebnissen erscheint.

So kann Schema Markup zum Beispiel auffällige Suchanzeigen erzeugen, die den Traffic erheblich steigern.

Alle HTML-Tags helfen den Suchmaschinen, Ihren Inhalt zu verstehen und ihn den Suchanfragen anzupassen.

Da 68 % des gesamten Internetverkehrs über Suchmaschinen abgewickelt werden, ist SEO der Marketingkanal, den Sie nicht ignorieren können.

In den folgenden Abschnitten zu den einzelnen Tags werden die entsprechenden Auswirkungen auf die Suchmaschinenoptimierung erläutert.

Muss ich HTML lernen?

Nein, Sie müssen nicht HTML lernen, um SEO effektiv zu nutzen.

Die meisten modernen Website-Plattformen wie WordPress bieten Formularfelder, in die Sie Titel und Beschreibung Ihres Artikels eingeben können. Die HTML-Tags werden dann automatisch hinzugefügt.

Aber was ist mit den anderen HTML-Tags, die in diesem Artikel besprochen werden?

Das All in One SEO (AIOSEO) Plugin herunterladen

Wir empfehlen die Verwendung eines SEO-Plugins wie All in One SEO (AIOSEO).

Dieses einsteigerfreundliche Plugin analysiert den Inhalt Ihrer Webseite und bietet eine einfache Checkliste für die Verbesserung des Inhalts.

aioseo Homepage

Wie AIOSEO funktioniert

Viele der von AIOSEO geprüften Artikel haben zugehörige HTML-Tags. Und das Plugin sorgt dafür, dass diese Tags für Sie hinzugefügt werden.

Hier sind einige Seitenelemente, die AIOSEO Ihnen bei der Optimierung helfen wird und die mit dem HTML-Code zusammenhängen.

  • Titel-Tag: All in One SEO prüft Ihren Titel, um sicherzustellen, dass Sie Ihr Ziel-Keyword verwendet haben. Sie werden auch sehen, ob Ihr Titel mehr als 60 Zeichen hat, was bedeutet, dass Google Search ihn wahrscheinlich abschneidet.
  • Meta-Beschreibungs-Tag: AIOSEO prüft auch, ob Sie Ihr Ziel-Keyword in Ihrer Meta-Beschreibung verwendet haben. Wenn es fehlt, werden Sie aufgefordert, es hinzuzufügen. Sie werden auch gewarnt, wenn Ihre Beschreibung mehr als 160 Zeichen umfasst.
  • Zwischenüberschriften: Da Zwischenüberschriften das Scannen von Inhalten erleichtern können, prüft AIOSEO, ob es lange Passagen ohne Zwischenüberschriften gibt. Das Plugin prüft auch, ob Sie Ihr Ziel-Keyword in einigen Ihrer Zwischenüberschriften verwendet haben.
  • Bild SEO: Mit AIOSEO können Sie seitenweite Einstellungen für Bild-SEO vornehmen, auch für Alt-Tags.
  • Schema-Auszeichnung: Um Schema-Markup hinzuzufügen, klicken Sie auf ein paar Schaltflächen und füllen einige Formularfelder aus.
  • Tags für soziale Medien: Optimieren Sie Ihre Inhalte für die Weitergabe auf Facebook und Twitter. Dazu müssen Sie einige Schaltflächen anklicken. All in One SEO fügt die erforderlichen OG-Tags und Twitter Card-Tags hinzu.
  • Noindex-Robot-Tags: Sie können Inhalte vor Suchmaschinen verbergen, indem Sie einfach auf eine Schaltfläche klicken. AIOSEO fügt automatisch die benötigten Noindex-Robots-Meta-Tags zu Ihrem HTML-Code hinzu.

Wenn Sie auf Schaltflächen klicken und Formularfelder ausfüllen können, können Sie All in One SEO (AIOSEO) verwenden.

All in One SEO (AIOSEO) ist ein etabliertes Plugin mit Tausenden von 5-Sterne-Bewertungen auf WordPress.org. Und derzeit nutzen es über 3 Millionen Menschen.

Schauen wir uns nun die wichtigsten HTML-Tags für SEO an.

Titel-Tag

Ihr Webseitentitel ist ein wesentlicher Bestandteil eines Such-Snippets. Zusammen mit der Beschreibung kann er Nutzern einen Grund geben, sich zu Ihrer Website durchzuklicken.

beispiel für titel tag in serp

Aber woher weiß Google (oder andere Suchmaschinen), wie Ihr Titel lautet? An dieser Stelle kommen die Titel-Tags ins Spiel.

Titel Tags sind winzige Codestücke, die am Anfang und am Ende von Seitentiteln erscheinen. Diese Tags sagen den Suchmaschinen: "Hier ist der Titel".

Titel-Tag im HTML-Code

So sieht ein Titel-Tag in HTML aus

<title></title>

Beachten Sie, dass es einen öffnenden und einen schließenden Tag gibt.

Zwischen diesen beiden Tags befindet sich der Titel.

<title>Your Title Goes Here</title>

Wenn Sie oben auf einer Webseite einen Titel eingeben, fügen die meisten Website-Plattformen den Titel-Tag automatisch hinzu. Sie müssen also nicht einmal darüber nachdenken.

Es gibt jedoch einige bewährte Praktiken, die Sie beachten sollten.

Bewährte Praktiken für Titel-Tags

  • Der Titel sollte präzise sein und Ihr Schlüsselwort enthalten.
  • Suchmaschinen schneiden Titel nach etwa 60 Zeichen ab. Nutzen Sie also diese 60 Zeichen gut aus.
  • Sie können mehr als 60 Zeichen verwenden, aber achten Sie darauf, dass der sichtbare Teil des Titels das Thema Ihres Artikels wiedergibt.
  • Wenn Ihr Titel nicht klar oder präzise ist, wird er von Google möglicherweise umgeschrieben.

Erfahren Sie, wie Sie All in One SEO zur Optimierung von Titeln einsetzen können.

SEO-Wert der Titel-Tags

Da Ihr Titel und Ihre Beschreibung auf den Ergebnisseiten der Suchmaschinen (SERPs) erscheinen, sind dies 2 wichtige Gelegenheiten, um Suchende zum Klicken zu bewegen.

Die Aufnahme Ihres Schlüsselworts in den Titel hilft Google, Ihre Seite zu verstehen, ist aber kein Ranking-Faktor.

Ein gut gestalteter Titel ist jedoch ein Aspekt eines hochwertigen Inhalts. Und die Qualität der Inhalte ist der wichtigste Ranking-Faktor.

Meta Description Tag

Wir haben gesehen, dass die Such-Snippets eine kurze Beschreibung Ihrer Webseite enthalten.

In der SEO wird diese Beschreibung als Meta-Beschreibung bezeichnet.

Wie bei den Titeln stellen die meisten Website-Plattformen ein Formularfeld zur Verfügung, in das Sie eine Beschreibung eintragen können, und fügen automatisch den Meta-Description-Tag hinzu.

Meta-Beschreibungs-Tag im HTML-Code

So sieht ein Meta-Description-Tag in HTML aus.

<meta name="description" content="Your description goes here." />

Dies ist ein so genannter selbstschließender Tag. (Im Gegensatz zum Titel-Tag gibt es keinen öffnenden und schließenden Tag).

Bewährte Praktiken für Meta-Beschreibungen

  • Machen Sie Ihre Beschreibung präzise und heben Sie das Besondere an Ihrem Artikel hervor.
  • Da Suchmaschinen den Platz für Webseitenbeschreibungen begrenzen, ist es üblich, sie auf 160 Zeichen zu beschränken.
  • Geben Sie Ihr Zielkeyword und 1-2 verwandte Keywords an.

Erfahren Sie mehr über Meta-Beschreibungen.

SEO-Wert von Meta-Beschreibungen

Während Ihre ursprüngliche Meta-Beschreibung bei der Suche nach Ihrem Ziel-Keyword erscheinen kann (oder auch nicht), schreibt Google die Beschreibungen oft um, um sie an verschiedene Suchanfragen anzupassen.

Mit "umschreiben" meinen wir, dass es einen anderen Text von Ihrer Seite zieht, der als Meta-Beschreibung angezeigt wird.

Im folgenden Beispiel zieht Google eine andere Meta-Beschreibung heran als die, die wir geschrieben haben. Aber die Beschreibung stimmt mit der Suchanfrage überein: "Was ist mehrsprachige SEO?"

beispiel für eine meta-beschreibung in serp

Während Sie also eine Meta-Beschreibung verfassen, kann Ihr Artikel bei der Suche nach mehreren Schlüsselwörtern erscheinen, wobei für jedes eine andere Beschreibung von Google angezeigt wird.

Überschrift Tags

Die logische Gliederung Ihrer Inhalte und die Verwendung von Überschriften (oder Zwischenüberschriften) für verschiedene Abschnitte helfen Suchmaschinen und Nutzern, Ihre Inhalte schnell zu erfassen.

Das Bearbeitungsfeld in WordPress bietet Überschriftenoptionen von h1 bis h6.

  • H1 wird für Seitentitel verwendet und erscheint normalerweise in der größten Schriftart.
  • Die anderen, h2-h6, sind kleiner und dienen dazu, Inhalte in einer logischen, hierarchischen Reihenfolge zu organisieren.

Ein Artikel kann zum Beispiel mehrere Abschnitte mit h2-Überschriften haben, und innerhalb dieser Abschnitte würden Sie h3- oder h4-Überschriften verwenden.

Im Hintergrund fügt WordPress HTML-Header-Tags hinzu, die den Suchmaschinen helfen, Ihr Inhaltsformat zu verstehen.

Kopfzeilen-Tags im HTML-Code

In HTML sieht ein Header-Tag wie folgt aus:

<h1></h1>

Der h1-Tag ist normalerweise für den Titel reserviert. In HTML würde der Titel Ihrer Seite also in h1-Tags eingeschlossen erscheinen.

<h1>This is My Page Title</h1>

Sie fragen sich vielleicht, warum der Titel-Tag nicht hier steht. Ihr Seitentitel wird im HTML-Code 2 Mal angezeigt:

  • Eingeschlossen in einen Titel-Tag (Dies ist ausschließlich für Suchmaschinen gedacht)
  • Umgeben von einem h1-Tag. (Dies ist der Titel, der für Ihre Leser sichtbar ist.)

Die anderen h-Tags verwenden dieselbe Syntax. Hier ist zum Beispiel ein h2-Tag, das für einen Artikelabschnitt verwendet wird.

<h2>Introduction to Sales</h2>

Bewährte Praktiken für Überschriften

  • Machen Sie Überschriften sinnvoll und konkret.
  • Halten Sie sie kurz und bündig, damit sie gut lesbar sind.
  • Stellen Sie die wichtigsten Begriffe an den Anfang.

SEO-Wert von Überschriften

Überschriften-Tags können Suchmaschinen helfen, Abschnitte Ihres Inhalts zu finden und sie mit verwandten Suchanfragen abzugleichen.

Aus diesem Grund können sie dazu beitragen, dass Ihre Inhalte für mehr als einen Suchbegriff erscheinen.

Sie sind aber auch wichtig für die Erstellung lesbarer Inhalte.

Mit einer klaren, logischen Struktur und Zwischenüberschriften für die einzelnen Abschnitte können Sie dafür sorgen, dass Ihre Leserinnen und Leser aufmerksam bleiben und immer wieder zurückkommen.

Bild-Alt-Tags

Alt-Text ist ein Text, der ein Bild beschreibt. Die meisten Website-Plattformen, einschließlich WordPress, bieten ein Formularfeld zum Hinzufügen von Alt-Text an.

Dieser Alt-Text hat zwei Funktionen:

  • Suchmaschinen lesen und indizieren den Alt-Text von Bildern und helfen ihnen, den Bildinhalt zu verstehen.
  • Bildschirmlesegeräte, die von sehbehinderten Menschen verwendet werden, lesen den Alt-Text laut vor.
aktualisierbarer Braille-Leser
Die Stifte dieses "aktualisierbaren Braille-Lesegeräts" heben oder senken sich als Reaktion auf den Text auf dem Bildschirm.

Sobald Sie Ihren Alt-Text hinzugefügt haben, wird er von WordPress automatisch in ein Alt-Tag für das Bild eingefügt.

Bild-Alt-Tags im HTML-Code

Alt-Tags sind HTML-Attribute, die innerhalb eines Bildelements erscheinen.

Die Bild-Tags ("img") verweisen auf eine Online-Quelle ("src") für das Bild, in Form einer URL.

<img src="https://upload.wikimedia.org/wikipedia/commons/c/c0/Yury_Pen_-_Portrait_of_Marc_Chagall.jpg" alt="marc chagall portrait">

Bewährte Praktiken für Bild-Alt-Tags

  • Fügen Sie immer einen Alt-Text für Bilder ein, es sei denn, sie sind dekorativ.
  • Lassen Sie Satzzeichen, Bindestriche oder Sonderzeichen weg.
  • Beschreiben Sie das Bild und seinen Kontext.

Wenn es sich bei Ihrem Bild beispielsweise um ein Diagramm über die Entwicklung der Kriminalitätsrate in Oslo, Norwegen, handelt, erklären Sie, was es den Lesern zeigt.

alt="crime trends in oslo norway"

SEO-Wert von Bild-Alt-Tags

Alt-Tags helfen dabei, dass Ihre Bilder und Diagramme in der Bildersuche auftauchen.

Und über SEO hinaus verbessern sie die Zugänglichkeit Ihrer Website.

Schema-Auszeichnung (für Rich Snippets)

Durch das Hinzufügen von Schema-Markup zu Ihren Webseiten können diese in den Suchergebnissen als Rich Snippets angezeigt werden.

Sie können sich Rich Snippets als Super-Deluxe-Suchmaschinenanzeigen vorstellen.

Hier ist ein Standard-Suchschnipsel.

Beispiel für einen Standard-Suchausschnitt

Und hier ist ein Rich Snippet.

Rich-Snippet-Beispiel

Das Hinzufügen dieser Art von Markup ist einfach. Mit All in One SEO (AIOSEO) klicken Sie auf einige Schaltflächen und füllen einige Formularfelder aus.

Es gibt mehr als 30 Arten von Rich Snippets, aus denen Sie wählen können, darunter:

  • Buch
  • Kurse
  • HÄUFIG GESTELLTE FRAGEN
  • Ereignis
  • Software-Anwendung
  • Person.

Schema Markup ist zwar komplizierter als Tags, weist aber einige Ähnlichkeiten auf. Dieser Code kennzeichnet Teile einer Webseite, damit Google diese Seite in ein Rich Snippet umwandeln kann.

Schema-Auszeichnung in HTML

Der Code für die Schemaauszeichnung kann sehr umfangreich sein.

Wenn Sie sehen möchten, wie es aussieht, empfehlen wir Ihnen, einige der Codebeispiele auf Schema.org anzusehen.

Bewährte Praktiken für Schema Markup

Fügen Sie, wo immer möglich, Schema-Markup zu Ihren Webseiten hinzu.

Und erkunden Sie die Schematypen, die in AIOSEO verfügbar sind.

SEO-Wert von Schema Markup

Rich Snippets ziehen mehr Klicks an als Standard-Snippets.

Erfahren Sie mehr über Rich Snippets.

Kanonische Tags

Canonical-Tags helfen Google, doppelte Seiten auszusortieren, indem sie angeben, welche Seite in den Suchergebnissen angezeigt werden soll.

Kanonische Tags werden häufig für Produktseiten verwendet, wenn derselbe Inhalt in mehreren Bereichen Ihrer Website erscheinen kann.

Bewährte Methoden

Wenn Sie intern verlinken, verlinken Sie auf die kanonische URL. Damit teilen Sie Google Ihre Präferenz mit.

Kanonische Tags im HTML-Code

Die Syntax für kanonische Tags (oder Attribute) lautet:

rel="canonical"

Hier ist ein Beispiel für einen Link mit hinzugefügtem kanonischen Tag.

<link rel="canonical" href="https://example.com/sneakers/green-sneakers" />

Dieser Link wird im Kopfbereich der HTML-Datei platziert.

Kanonische Tags sind ein technisches SEO-Thema. Siehe Googles Richtlinien für Entwickler über Methoden zur Festlegung kanonischer URLs.

Andere wichtige HTML-Tags

Wir haben die wichtigsten HTML-Tags für SEO behandelt. Aber hier sind einige spezielle Tags mit ihren Verwendungen.

Open Graph Tags

Haben Sie sich jemals gefragt, warum manche Webseiten, wenn sie auf Facebook geteilt werden, aussehen, als würde etwas fehlen?

Wenn ein Nutzer Ihre Seite auf Facebook teilt, durchsucht die Social Media-Plattform Ihren Code nach Open Graph-Tags.

Diese HTML-Tags teilen Facebook mit, welches Bild, welcher Titel und welche Beschreibung angezeigt werden sollen. Wenn Ihre Seite nicht über diese OG-Tags verfügt, sieht sie beim Teilen fade aus.

Mit All in One SEO (AIOSEO) kannst du auf einfache Weise steuern, wie deine Inhalte auf Facebook erscheinen. (Und Sie müssen sich nicht mit Code herumschlagen.)

aioseo Optimierung der Seite für Facebook
Oben: AIOSEO bietet eine Facebook-Vorschau für Ihre Inhalte. Sie können die Einstellungen ganz einfach anpassen, damit Ihre Seite genau so erscheint, wie Sie es auf Facebook wünschen. Im Hintergrund fügt AIOSEO die erforderlichen Open Graph-Tags hinzu.

Twitter-Karten-Tags

Twitter Card-Tags funktionieren wie OG-Tags. Und hier können Sie auch All in One SEO (AIOSEO) verwenden, um zu steuern, wie Ihre Seite beim Teilen auf Twitter erscheint.

Sie können auf 1 Schaltfläche klicken und Ihre Facebook-Einstellungen für die Twitter-Freigabe kopieren.

aioseo optimierte Twitter-Karten

Backlinks sind ein wichtiger Ranking-Faktor. (Backlinks sind Links von anderen Websites zu Ihrer.)

Links von angesehenen, hochwertigen Websites können das Ranking Ihrer Website verbessern.

Links können jedoch Attribute enthalten, von denen einige diesen SEO-Wert zunichte machen können.

Ein "nofollow"-Attribut bedeutet zum Beispiel, dass Suchmaschinen den Link ignorieren sollen.

So sieht dieses Attribut im Code des Links aus.

<a href="https://www.example.com" rel="nofollow">linked text</a>

Erfahren Sie mehr über die Attribute nofollow, ugc und sponsored und wie Sie diese vermeiden können.

Noindex Robots Tag

Das noindex-Tag verhindert, dass Inhalte in den Suchergebnissen erscheinen.

Anmeldeseiten für Mitarbeiter oder "Erfolgsseiten" sind Beispiele für Inhalte, die von Suchmaschinen übersprungen werden sollten.

Hier ist ein noindex-Attribut in einem meta robots-Tag enthalten.

<meta name="robots" content="noindex" />

Früher wurden manchmal noindex-Direktiven zur robots.txt-Datei einer Website hinzugefügt. Dieser Ansatz wurde jedoch 2019 von Google verworfen.

HTML 5 Semantische Tags

Semantische Tags helfen den Suchmaschinen zu verstehen, wie sich die Teile einer Seite zueinander verhalten.

Sie waren eine wichtige Funktion bei der Veröffentlichung von HTML 5 im Jahr 2008.

Hier sind einige Beispiele für semantische Tags.

  • <main>
  • <aside>
  • <form>
  • <table>
  • <time>

Die Codebasis von WordPress und die Themes enthalten semantische Tags.

Fragen und Antworten zu HTML-Tags für SEO

Jetzt, da Sie die wichtigsten HTML-Tags für SEO kennen, haben Sie vielleicht noch einige Fragen.

Brauche ich HTML-Kenntnisse für SEO?

Nein, Sie brauchen keine HTML-Kenntnisse, um gute SEO zu betreiben. Dank der Fortschritte bei Content-Management-Systemen wie WordPress und verwandten Plugins wie All in One SEO (AIOSEO) ist es möglich, effektive SEO zu betreiben, ohne irgendeinen Code zu kennen.

Wie strukturiere ich HTML für bessere SEO-Ergebnisse?

HTML liefert Browsern und Suchmaschinen Informationen über die Formatierung Ihrer Seite. Bessere Ergebnisse erzielen Sie, wenn Sie Ihre Seite logisch strukturieren, damit der Inhalt übersichtlich und klar ist.

Sie können dies in einem WYSIWIG-Editor tun, wie er von Top-Plattformen wie WordPress und Drupal bereitgestellt wird.

Außerdem sollten Sie lernen, wie Sie Ihre Seiten so formatieren, dass sie leicht zu scannen sind. Und wenden Sie gegebenenfalls Schema-Markup auf die Seite an.

Nach HTML-Tags für SEO . . .

Wir hoffen, dass dieser Beitrag Ihnen geholfen hat, einige der wichtigsten HTML-Tags für SEO zu identifizieren und zu verstehen, warum Sie keinen Code lernen müssen, um sie anzuwenden.

All in One SEO stellt sicher, dass Ihre Website die Metadaten korrekt verwendet.

Als Nächstes erfahren Sie, wie Sie eine HTML-Sitemap zu Ihrer Website hinzufügen können. Sehen Sie sich diese On-Page-SEO-Tools an. Und erfahren Sie, wie Sie gute Ankertexte erstellen.

Wenn Sie mehr über Suchmaschinenoptimierung erfahren möchten, abonnieren Sie unseren YouTube-Kanal. Dort finden Sie tolle Schritt-für-Schritt-Tutorials. Sie können uns auch auf X (Twitter), LinkedIn oder Facebook folgen, um auf dem Laufenden zu bleiben.

Möchten Sie AIOSEO kostenlos testen?

Geben Sie die URL Ihrer WordPress-Website ein, um AIOSEO Lite zu installieren.

Bitte aktiviere JavaScript in deinem Browser, um dieses Formular fertigzustellen.

Offenlegung: Unsere Inhalte werden von unseren Lesern unterstützt. Das bedeutet, wenn Sie auf einige unserer Links klicken, erhalten wir möglicherweise eine Provision. Wir empfehlen nur Produkte, von denen wir glauben, dass sie unseren Lesern einen Mehrwert bieten.

Autor-Avatar
Sherrie Gossett, Inhaltsautorin
Sherrie ist eine SEO-Analystin mit Sitz in New Hampshire in den USA. Wenn sie nicht gerade mit der Recherche, Implementierung und dem Schreiben neuer SEO-Entwicklungen beschäftigt ist, findet man sie beim Wandern und Gitarrespielen.

Kommentar hinzufügen

Wir freuen uns, dass Sie sich entschieden haben, einen Kommentar zu hinterlassen. Bitte beachten Sie, dass alle Kommentare gemäß unserer Datenschutzrichtlinie moderiert werden und alle Links Nofollow sind. Verwenden Sie KEINE Schlüsselwörter im Namensfeld. Lassen Sie uns ein persönliches und bedeutungsvolles Gespräch führen.