Meta-Definitionen

Was sind Meta-Definitionen?

Metadaten (auch Metainformationen) ganz allgemein sind Informationen über die Eigenschaften von Daten oder Dokumenten, wie HTML-Seiten. Mit Metadaten können zusätzliche Informationen zu Webseiten, wie z. B. Autor, Sprache oder Zeichenkodierung, angegeben werden. Die Metainformationen helfen den Webcrawlern der Suchmaschinen eine Seite besser einzuordnen und dadurch u. U. auch besser in der Suchliste zu platzieren. Die Metainformationen sollten dabei für alle Seiten und Unterseiten eines Webauftritts individuell angegeben werden.

Das „meta“-Element

Mit dem „meta“-Element können Metadaten für Webseiten definiert werden. Das „meta“-Element ist ein inhaltsloses Element das im „head“-Bereich von Webseiten verwendet wird:

<head>

<meta ... />

</head>

„name“- und „content“-Attribut

Mit dem „name“-Attribut kann angegeben werden, um welche Art von Metadaten es sich handelt, wie z. B. „author“ (Autor), „description“ (Beschreibung) und „keywords“ (Schlüssel-wörter). Mit dem „content“-Attribut werden dann die eigentlichen Metadaten angegeben:

<meta name=“Art-der-Metadaten“ content=“Metadaten“ />

Die Beschreibung („description“) und die Schlüsselwörter („keywords“) sind dabei besonders wichtig für die Suchmaschinenoptimierung (SEO), d. h. für eine gute Platzierung in den Suchergebnissen. Mit den Attributen „name“ und „content“ können aber auch beliebige eigene Eigenschaften angegeben werden, wie z. B. Koautor, Erstellungsdatum etc. Diese werden dann aber nicht von Webcrawlern für das Suchmaschinen-Ranking ausgewertet.

Mit „robots“ im „name“-Attribut können Anweisungen für Webcrawler definiert werden. Mit „noindex“ im „content“-Attribut kann dann festgelegt werden, dass die Seite nicht in den Index von Suchmaschinen aufgenommen werden soll. Mit „nofollow“ im „content“-Attribut darf der Webcrawler die Seite in den Index aufnehmen, den Hyperlinks der Seite aber nicht folgen:

<meta name=“robots“ content=“noindex,nofollow“ />

Mit „expires“ im „name“-Attribut kann dem Browser angegeben werden, wann eine Seite aktualisiert werden muss, d. h., wann eine Seite im Cache nicht mehr gültig ist und vom Server neu geladen werden muss. Mit „0“ im „content“-Attribut kann der Browser angewiesen werden, eine Seite immer neu vom Server zu laden und nie aus dem Cache.

<meta name="expires" content="0" />

Mit „language“ im „name“-Attribut kann Webcrawlern die Sprache der Seite mitgeteilt werden, was z. B. bei „.com“-Adressen von Vorteil sein kann. Beim „content“-Attribut wird dann die Sprache ausgeschrieben („deutsch“), in Kurzform („de“) oder beides („deutsch,de“) angegeben:

<meta name="language" content="de" />

Mit „viewport“ im „name“-Attribut kann der Viewport angepasst werden. Der Viewport ist der Bereich im Browser, in dem die Webseite dargestellt wird, ohne Rand, Tabs, Menü-, Status- und Favoritenleiste. Im „content“-Attribut können für den Viewport verschiedene Parameter angegeben werden. Mit „width=device-width“ kann die Breite des Viewports an die darstellbare Breite des entsprechenden Geräts angepasst werden. Das hat den Vorteil, das eine breite Webseite nicht komplett auf dem Bildschirm von mobilen Geräten dargestellt wird, wodurch der Inhalt kaum noch zu erkennen wäre, sonder nur ein Ausschnitt der Seite. Mit „initial-scale=1.0“ wird der Inhalt einer Webseite 1:1 skaliert, d. h. nicht entsprechend der Größe des Viewports gestaucht oder gedehnt. Mit „user-scalable=yes/no“ kann festgelegt werden, ob der Anwender auf der Seite zoomen darf oder nicht:

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />

Beispiel 1 – Ohne Viewport-Anpassung

HTML-Datei:

Ergebnis im Browser:

Ergebnis auf dem Smartphone:

Beispiel 2 – Mit „width=device-width“

HTML-Datei:

Ergebnis auf dem Smartphone:

Beispiel 3 – Mit „initial-scale=1.0“

HTML-Datei:

Ergebnis auf dem Smartphone:

„http-equiv“-Attribut

Mit dem „http-equiv“-Attribut können Metadaten in die Kopfzeile der HTTP-Antwort des Servers integriert werden. Das hat den Vorteil, dass die so definierten Metainformationen vom Browser ausgewertet werden können, bevor die eigentliche Seite aufgebaut wird.

Mit der folgenden Meta-Definition kann der MIME-Typ und die Zeichenkodierung einer Seite angegeben werden:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

Mit „refresh“ im „http-equiv“-Attribut kann eine Weiterleitung eingerichtet werden. Dazu wird im „content“-Attribut die Zeit in Sekunden angegeben nach der bei einem Seitenaufruf die Weiterleitung stattfinden soll sowie die URL, zu der weitergeleitet werden soll:

<meta http-equiv="refresh" content="10; URL=url.htm" />

Beispiel 4

HTML-Datei:

Ergebnis im Browser:

„charset“-Attribut

In der Datenverarbeitung werden alle Zeichen für die Verarbeitung und Speicherung mit einem Zahlenwert kodiert. Dabei muss mit einer Zeichenkodierung eindeutig festgelegt werden, welche Zahlen welche Schriftzeichen und Symbole repräsentieren. Es gibt viele verschiedene Zeichenkodierungen. Eine sehr einfache aber kaum noch verwendetet ist die Zeichenkodierung „ASCII“, die keine Umlaute wie „ä“, „ö“ oder „ü“ kodieren kann. Werden Umlaute in den Texten auf Webseiten verwendet, sollte für die Webseite eine Zeichenkodierung festgelegt werden, die Umlaute darstellen kann. Mit dem „charset“-Attribut kann die Zeichenkodierung für eine Webseite definiert werden:

<meta charset="Zeichensatz" />