SEO Wiki: Die wichtigsten Meta Tags für Suchmaschinenoptimierer
SEO Meta Tags
[2020 Edition] Dieser Artikel beschäftigt sich rund um die relevanten SEO Meta Tags, die für Online Marketer und Suchmaschinenoptimierer relevant sind. Welche Meta Tags solltest du für SEO optimieren?
Neben dem HTML Title bzw. dem Title Tag, der extrem wertvoll er für die Suchmaschinenoptimierung ist, gibt es aber noch weitere Tags die für die Suchmaschinen von höchster Relevanz sind. In diesem Artikel sehen wir uns die wichtigsten SEO Meta Tags an. Welche sind davon relevant für die Suchmaschinenoptimierung und wie können wir diverse Inhalte steuern?
Inhaltsverzeichnis
- Fragen und Antworten
- Was sind Meta Tags überhaupt?
- Wie ist ein Meta Tag in der Regel aufgebaut?
- Beeinflussen Meta Tags das Ranking?
- Ist der Title ein Meta Tag?
Was sind Meta Tags überhaupt?
Meta Tags sind unsichtbare Hinweise im <head>-Bereich einer Website und können Maschinen und Robots diverse Informationen übermitteln, mit denen sie arbeiten können. Die Technik stammt noch aus den 90er Jahren, als Suchmaschinen und andere Software noch nicht ausgereift genug waren, eigene Entscheidungen zu treffen. Diese Entscheidungen bzw. Hinweise wurden ihnen damals wie heute häufig per Meta Tags mitgeteilt.
So reagieren Suchmaschinen und Websites heute noch auf einige Meta Tags und beeinflussen die Darstellung unserer Suchergebnisse, z. B. bei Google, Bing und andere Suchmaschinen. Somit sind auch ein paar gewisse SEO Meta Tags auch für die Optimierung an der Website von Relevanz.
Wie ist ein Meta Tag in der Regel aufgebaut?
Meta Tags werden in der Regel wie folgt im HTML eingebunden:
<html>
<head>
<title>HIER IST DER TITLE - vioma GmbH</title>
<meta name="METATAGNAME" content="METATAGCONTENT" />
[...]
</head>
<body>
[...] hier ist der restliche sichtbare Bereich der Website [...]
</body>
</html>
Wobei der Name des Meta Tags einem festgelegten Inhalt haben sollte und der Content manchmal ebenfalls fest definiert, bei anderen willkürlicher Text sein kann. Dazu schauen wir uns aber die SEO Meta Tags im Einzelnen weiter unten an.
Beeinflussen Meta Tags das Ranking?
Wenn wir von der Beeinflussung des Rankings sprechen - also der Verschiebung der Positionen - dann ist das in fast allen Fällen bei Meta Tags mit Nein zu beantworten. Und die ganz wenigen Ausnahmen sind erstens fast unrelevant in Suchmaschinen und zweitens beziehen sich definitiv nicht auf Google, denn Google ignoriert die Meta Tags als direkten Rankingfaktor durchgehend. Grob kann man also sagen, einen signifikanten Rankingboost erhalten wir durch keinen der Meta Tags.
Aber: Wenn eine entsprechende Position in Suchmaschinen gewonnen ist, beeinflusst es direkt den Suchenden. Und das kann zur Steigerung der Anklickrate des Suchergebnisses führen. Das wird dann eine Optimierung der Click Through Rate genannt, kurz CTR. SEO ist nämlich nicht nur die Steigerung der Positionen in Suchmaschinen, die Suchenden müssen auch auf das Suchergebnis klicken wollen. Die Optimierung der Click-Through-Rate sollte also bei der OnPage-Optimierung mit berücksichtigt werden.
Ist der Title ein Meta Tag?
Der HTML Title bzw. Title Tag gehört nicht zur Kategorie der Meta Tags. Trotzdem ist gerade der ein wichtiger Rankingfaktor und sollte bei der Optimierung der SEO Meta Tags mit berücksichtigt werden. Weitere Infos zur Optimierung des Title Tags findest du auf der Seite Top Suchergebnis Snippets.
Meta Description - Die Beschreibung deiner Website
In der Meta Description kann Text hinterlegt werden, der bei der Ausgabe in Suchmaschinen eine bedeutende Rolle spielt. Die hier eingegebene Beschreibung entspricht bspw. bei Google dem schwarz angezeigten Text des Suchergebnisses:
Die Meta Description sieht im HTML etwa so aus:
<meta name="description" content="HIER IST DER INHALT MEINER META DESCRIPTION" />
Tipps für die Optimierung der Meta Description
- Die Meta Description wird in Suchmaschinen als schwarzer Text ausgegeben. Die Länge des Textes ist jedoch auf ungefähr 145 bis 160 Zeichen beschränkt. Bei einer Optimierung werden deshalb empfohlen, um die 150 Wörter in der Meta Description zu verwenden.
- In der mobilen Suche ist die max. Anzahl von Zeichen noch weiter eingeschränkt; teilweise werden nicht mehr als 100 Zeichen angezeigt, je nachdem, wie viele Zusatzelemente noch ausgegeben werden (Vorschaubild, Ankerlinks, Schema und ähnliches).
- Die Darstellung der Meta Description kann durch diverse → HTML-Sonderzeichen visuell aufgewertet werden.
- Bei manchen Bookmarkdiensten oder bei manchen Browser-Lesezeichen wird die Meta Description als zusätzliche Information automatisch mit angelegt.
Anmerkung: Wie auch beim Title Tag ist keine Suchmaschine an die Darstellung der exakten Daten der Meta Tags fest gebunden. Das gilt ganz besonders für die Meta Description. Entscheidet sich eine Suchmaschine wie Google dazu, dass ein Inhalt der jeweiligen Webseite besser für die Ausgabe geeignet ist, so nimmt die Suchmaschine auch einen von der Meta Description abweichenden Inhalt.
Anmerkung #2: Die Meta Description ist kein direkter Rankingfaktor bei Google. Leider hält sich dieser Mythos recht hartnäckig.
Meta Keywords – Suchbegriffe hinterlegen
Der Meta Tag für Keywords, kurz Meta Keywords, wird heute kaum noch gebraucht. Google ignoriert die SEO Meta Keywords komplett. Und für alle anderen Suchmaschinen (wie Bing) ist es fraglich, ob der überhaupt zur Berechnung zum Einsatz kommt und selbst wenn spielen sie nur eine deutlich untergeordnete Rolle beim Ranking. Setzt man dazu das Verhältnis der Marktanteile Googles zu anderen Suchmaschinen ins Verhältnis, so spielen die Meta Keywords vom Aufwand-Nutzen her keine positive Rolle für uns.
Manche Content Management Systeme können Meta Keywords automatisch einsetzen. So werden die Schlagworte in WordPress (in Kombination mit einem SEO-Plugin) automatisch als Meta Keywords hinterlegt. Effektiv machen sie zwar keinen Unterschied, aber schaden tun sie dann auch nicht.
Einen marginalen Vorteil liefern Meta Keywords aber trotzdem. Legt der Nutzer die Seite als Bookmark an, speichert der Browser auch die Meta Keywords. Man kann also als Nutzer gegebenfalls leichter nach Bookmarks suchen, wenn man davon eine Menge anlegt.
Meta Keywords werden bei Suchmaschinen in der Regel visuell nicht dargestellt.
Meta Keywords werden so eingebaut:
<meta name="keywords" content="KEYWORD 1, KEYWORD 2, KEYWORD 3" />
Die Anzahl der SEO Meta Keywords ist im Prinzip unbeschränkt, sollten sich jedoch auf die 3-5 wichtigsten Begriffe fokussieren. Sie werden per Komma getrennt. Dabei sollten immer nur Einzel-Keywords hinterlegt werden, keine Keyword-Kombinationen. Das bläht den Quellcode nur unnötig auf.
Meta Robots – Google und Bots steuern
Der Meta Robots Tag ist speziell für Suchmaschinen gedacht und wird von den großen Suchmaschinen Google und Bing auch umgesetzt. Mit diesem Meta Tag lässt sich steuern:
- ob eine Seite in den Suchergebnissen ausgegeben werden darf oder nicht
- ob Links Pagerank übertragen oder nicht
- ob Suchergebnisse die Beschreibung aus ganz speziellen Verzeichnissen verwenden dürfen oder nicht (very Oldschool)
Der Robots Meta Tag sieht so aus:
<meta name="robots" content="INHALT DES ROBOTS META TAGS" />
Wichtig hier ist noch zu wissen, dass der Inhalt (Content) des Robots Meta Tags nur ganz spezielle Inhalte enthalten darf, auf die wir gleich eingehen. Es dürfen sich aber mehrere dieser speziellen Inhalte darin befinden, wenn sie durch Komma getrennt sind.
Meta Robots: Noindex
Mit dem Inhalt „noindex“ teilen wir Suchmaschinen mit, dass sie den Inhalt zwar lesen dürfen, aber dass der Inhalt nicht in den Suchergebnissen ausgegeben werden soll. Daran halten sich in der Regel alle Suchmaschinen immer. Um also die Loginseite, Warenkorbseite oder die Suchergebnisseiten aus dem Google Index auszuschließen, kann man diesen Meta Tag hervorragend auf diesen Seiten einbauen:
<meta name="robots" content="noindex" />
Notiz: Man muss nicht speziell einen Meta Robots Tag hinzufügen, um die Aufnahme in den Index von Suchmaschinen zu erlauben, denn das tun Google & Co. ganz automatisch.
Hinweis #2: Der noindex bedeutet erst mal nicht, dass Google den Links nicht folgt. Dafür ist die folgende Anweisung "nofollow" zuständig. Trotzdem hat Google bestätigt, dass sie nach einiger Zeit eine Noindex-Seite so behandeln, als hätte sie gleichzeitig einen nofollow aktiviert. Der Einsatz von Noindex sollte also gut geprüft werden, bevor man ihn einsetzt.
Meta Robots: Nofollow
Möchte man auf einer Seite sicherstellen, dass auf gar keinen Fall Linkpower an alle Links weitergegeben wird und Suchmaschinen allen Links grundsätzlich nicht folgen sollen, so kann man auch "nofollow" in das Meta Tag schreiben.
Natürlich sagt man dem Bot damit gleichzeitig, dass keine Linkpower (Linkjuice) an die eigenen verlinkten Seiten weitergegeben werden darf, wie etwa der Link über das Logo im Kopfbereich einer Website oder den vielen Links in der Hauptnavigation. Der Einsatz vom Nofollow im Meta Tag Robots ist also in fast allen Fällen abzuraten. Mögliche Einsatzgebiete sind aber Login-Seiten oder Backend-Seiten.
<meta name="robots" content="nofollow" />
Meta Robots: NOODP und NODIR
OK, diese Inhalte des Robots Meta Tags sind extrem Oldschool, aber es gibt sie immer noch.
Früher in den 90ern gab es zwei große Webverzeichnisse, das Open Directory Project (kurz: ODP, auch als → DMOZ bekannt) und das Yahoo!-Directory (RiP since 2014). In der Anfangszeit wurden Beschreibungstexte, wie heute die Meta Descriptions, teilweise aus diesen beiden Verzeichnissen gezogen. Da es beide Verzeichnisse nicht mehr gibt, ist diese Anweisung überflüssig.
<meta name="robots" content="noodp, nodir" />
NEU: max-snippet:[Anzahl]
Die Meta Robots Anweisung "max-snippet:[Anzahl]" weist Google darauf hin, wie viele Zeichen im Suchergebnis angezeigt werden sollen. Im folgenden Beispiel zu max-snippet wird der schwarze Beschreibungstext im Suchergebnis-Snippet also auf 80 Zeichen begrenzt:
<meta name="robots" content="max-snippet:[80]" />
NEU: max-video-preview:[Sekunden]
Diese neue robots Anweisung sagt bei Suchergebnissen, in denen eine Video-Vorschau mit angezeigt wird, wie die Länge in Sekunden des Vorschau-Videos in den Google Suchergebnissen angezeigt werden soll. Im Beispiel soll eine Video-Vorschau auf 30 Sekunden reduziert werden:
<meta name="robots" content="max-video-preview:[30]" />
NEU: max-image-preview:[Einstellung]
Für Suchergebnisse, die Vorschaubilder mit ausliefern - das ist besonders auf mobile der Fall - können zukünftig Einstellungen für dieses Vorschaubild vorgenommen werden. Die robots-Anweisung "max-image-preview[Einstellung] gibt die Anweisung, ob ein Bild nicht, oder normal, oder in groß geladen/angezeigt werden soll. Diese werden im max-image-preview mit "none" für kein Vorschaubild, "standard" für ein normales Vorschaubild oder "large" für großes Vorschaubild angegeben. Ob sich damit auch die Darstellung der Suchergebnisse anpassen wird, ist abzuwarten. Im Beispiel setzen wir das Vorschaubild auf large:
<meta name="robots" content="max-image-preview:[large]" />
Wann treten die neuen Meta Robots Anweisungen in Kraft?
max-snippet, max-video-preview und max-image-preview sind neue Meta Robots Anweisungen, die Google am 24. September 2019 angekündigt hat. Sie werden laut Google Webmaster Central Blog etwa Mitte bis Ende Oktober 2019 in Kraft treten und anwendbar sein.
Da es sich bei max-snippet, max-video-preview und max-image-preview um neue und von Google veröffentlichte Meta Tags handelt, ist aktuell noch fraglich, wie andere Suchmaschinen wie Bing oder Yandex damit umgehen werden.
Kombinationen im Robots Meta Tag
Der Robots Meta Tag erlaubt auch die Mehrfachverwendung von Anweisungen. So kann eine Seite gleichzeitig auf Noindex und auf Nofollow gesetzt werden, was zum Beispiel für Login-Seiten interessant ist.
Beispiel:
<meta name="robots" content="noindex, nofollow" />
Oder auch kombinierte Anweisungen aus den neuen robots Meta Tags, wie hier komma-separiert kombiniert, in dem wir anweisen dass 120 Zeichen mitttels max-snippet und ein großes Vorschaubild mittels max-image-preview dargestellt werden soll:
<meta name="robots" content="index, follow, max-snippet:[120], max-image-preview:[large]" />
Was passiert ganz ohne Meta Robots Tag?
Ist der Robots Meta Tag nicht vorhanden, verhalten sich Suchmaschinen, als ob der Inhalt indexierbar und followbar wäre. Im übertragenen Sinne also wie:
<meta name="robots" content="index, follow" />
Facebook Meta Tags: Die OG Tags
Facebook bietet mit den Open Graph Tags (korrekt: Open Graph Protocol, abgekürzt auch gerne OG Tags oder OG Meta Tags) eine breite Palette an Möglichkeiten an, um eine URL beim Sharen auf Facebook anspruchsvoll zu gestalten.
Das Open Graph Protocol wird übrigens mittlerweile nicht nur von Facebook genutzt. Auch andere Plattformen wie XING, Linkedin und Reddit greifen beim Teilen von Webinhalten auf den OGP zurück.
Die wichtigsten OG Tags für Facebook sind die folgenden:
og:title
Der og:title bildet die Überschrift eines Posts ab, der gerade geshared wird. Der og:title kann durchaus abweichen vom eigentlichen Webseiten-Title, um z. B. aktionsorientierter oder clickbaitiger zu wirken. Code Beispiel für den og:title Tag:
<meta property="og:title" content="SEO Wiki: Die wichtigsten Meta Tags für dich als Suchmaschinenoptimierer" />
og:image
Im og:image Tag wird eine Bild-URL übermittelt, die als Vorschaubild in einem auf Facebook geteilten Post angezeigt werden soll. Somit haben wir die Möglichkeit direkt auf das wichtigste Element in einem Facebook Share Post zuzugreifen - dem eigentlichen Bild.
Das von Facebook empfohlene Bildformat für den og:image Tag beträgt 1,91:1. Die enpfohlene Mindestgröße beträgt 600x314 Pixel. Wir empfehlen aber, das Bild in doppelter oder sogar dreifacher Größe zu übermitteln, um für Retina Displays (etwa Smartphones) extra scharf aussehen zu können. Also die Größen 1200x628 Pixel oder sogar 1800x942 Pixel.
<meta property="og:image" content="https://www.vioma.de/media/60540/meta-description-beispiel-1924214.png" />
og:type
Übermittelt den Inhaltstyp einer Unterseite. Üblicherweise wird im og:type der Wert "website" übermittelt. Für speziellere Typen gibt es hier eine Auflistung an möglichen Objekten: https://ogp.me/#types
<meta property="og:type" content="website" />
og:url
Übermittelt die exakte URL für diese Seite. Typischerweise sollte der Inhalt der og:url die gleiche URL beinhalten wie die Seite, die man eigentlich verlinken möchte. Überlegenswert kann aber sein, die URL abzuändern, um etwa bei Duplicate Content auf jene Seite zu zeigen, die per Canonical korrekt ausgestattet wird.
Die og:url hilft Facebook auch, die Inhalte zu speichern, sodass sie nicht jedes mal aufs Neue unsere Seite überprüfen müssen. Verlinkt jemand in Facebook diese URL, werden die Daten automatisch von Facebook und nicht von unserer Seite ausgelesen. Das spart Traffic ein – für Facebook als auch für uns.
<meta property="og:url" content="https://www.vioma.de/de/wiki/online-marketing/seo/meta-tags/" />
og:site_name
Der og:site_name übermittelt beim Sharen den Namen der Website - also üblicherweise den Markennamen.
<meta property="og:site_name" content="vioma GmbH" />
og:description
Der og:description Tag bildet quasi das Äquivalent zum Meta Description Tag für die Google Suchergebnisse dar. Es ist eine zusammengefasste Kurzbeschreibung der Seite, die im geteilten Post dargestellt wird. Der Inhalt kann von der eigentlichen Meta Description abweichen, um etwa eine klickstärkere Beschreibung zu hinterlegen.
<meta property=“og:description“ content="KURZE BESCHREIBUNG DES INHALTS" />
Twitter Meta Tags
Twitter bietet für seine Plattform eigene Meta Tags an, die eine getweetete Webseite sauber in seinen sogenannten Twitter Cards aussehen lassen. Sie sind dabei ähnlich aufgebaut zum Open Graph Protokoll aber trotzdem etwas spezieller. Die wichtigsten Twitter Meta Tags schauen wir uns jetzt an.
twitter:card
Der Meta Tag twitter:card übermittelt Twitter, um welche Art von Inhalt es sich bei dieser Unterseite bzw. diesem Link handelt. Für Websites wählt man üblicherweise den Wert "summary" oder besser, "summary_large_image". Speziell für Apps oder Videos kann auch "app" oder "player" gewählt werden. Die twitter:card ist nicht optional.
<meta name="twitter:card" content="summary_large_image" />
twitter:title
Der twitter:title Meta Tag beinhaltet die Überschrift der Seite, die geteilt werden soll. Es ist quasi das Äquivalent zum og:title Tag von Facebook. Der twitter:title enthält üblicherweise den Title Tag der jeweiligen Seite, kann aber für klickstärkere Effekte angepasst werden.
<meta name="twitter:title" content="SEO Wiki: Die wichtigsten Meta Tags für Suchmaschinenoptimierer - vioma GmbH" />
twitter:description
Äquivalent zur Meta Description oder zur og:description überliefert die twitter:description eine Kurzbeschreibung zu einer Unterseite. Sie kann sich wieder von den beiden unterscheiden, etwa wenn man klickstärkere Beschreibungen erreichen möchte.
<meta name="twitter:description" content="vioma: Don't follow, create! Ihr 360° Dienstleister für Vermarktung, Websites und Systeme für die Hotellerie, Tourismusbranche und Industrie. ➨ Jetzt mehr erfahren" />
twitter:image
Das twitter:image übermittelt eine URL zu einem Bild, das innerhalb der Twitter Card im Tweet verwendet werden soll. Das ist sehr mächtig und löst die Aufmerksamkeit deutlich.
twitter:image Bilder sollten mindestens eine Größe von 144x144 Pixel aufweisen und nicht größer als 4096x4096 Pixel sein. Die Dateigröße des Bildes darf 5 MB nicht übersteigen.
Für die optimale Darstellung mit der twitter:card "summary_large_image" wird entweder eine Größe von 800x419 Pixel bzw. 1600x838 Pixel empfohlen (Ratio: 1,91:1).
<meta name="twitter:image" content="https://www.vioma.de/media/60540/meta-description-beispiel-1924214.png" />
twitter:site
Mit dem twitter:site kannst du dein Twitter Profil hinterlegen. Somit weiß Twitter, zu welchem Twitter-Profil die getweetete Seite gehört.
<meta name="twitter:site" content="@viomaGmbH" />
twitter:creator
Der twitter:creator ist angelehnt an twitter:site. Hier wird aber anstelle des - beispielhaft - Firmentaccounts der Account des urhebers bzw. des Mitarbeiters hinterlegt.
<meta name="twitter:creator" content="@geraldsandu" />