Tutorials
Meta-Tags
Wofür werden Meta-Tags eingesetzt?
Mit Meta-Tags lassen sich spezielle Informationen über ein Dokument festlegen. Diese werden häufig von Suchmaschinen verwendet und erscheinen nicht auf dem Dokument direkt. Beispiele für das Verwenden von Meta-Angaben: Angabe des Autors, Beschreibung des Inhaltes eines Dokumentes oder das Angeben von Schlüsselwörtern.
Wo stehen Meta-Tags?
Meta-Tags findet man immer im head-Tag. Manche müssen auch an einer ganz besonderen Stelle stehen. Ein Beispiel dafür wäre der Meta-Tag, der die Kompatibilitätsansicht des IE regelt. Dazu findest du am Ende der Seite detailierte Informationen.
Attribute und häufig verwendete Meta-Tags
Nachfolgend eine kleine Übersicht der häufigsten Meta-Tags, welche von Suchmaschinen und Browsern abgefragt werden.
content und name
Die meisten Meta-Tags haben mindestens zwei Attribute. Einmal das content Attribut und das name Attribut. Wie der Name schon sagt legt das Attribut content den Wert oder die Bedeutung des Meta-Tags fest. name hingegen ist dafür zuständig den "Typ" des Meta-Tags zu bestimmen. An Hand eines Beispiels wird das vermutlich verständlicher:
<meta name="author" content="Ferenc Zuellich" />
Dieser Meta-Tag beschreibt den Autor des Dokuments. Theoretisch könnte man dem name Attribut unbegrenzt viele verschiedene Werte zuordnen. Allerdings gibt es spezielle Werte nach denen Suchmaschinen häufig suchen.
- author
- Mit diesem Wert kann man also den Autor eines Dokumentes festlegen.
<meta name="author" content="Irgendwer" /> - description
- Mit diesem Wert kann man den Inhalt eines Dokumentes beschreiben. Er wird auch von Suchmaschinen verwendet, z.B. zum anzeigen der Suchergebnisse. Dies muss aber nicht in jedem Fall geschehen. Manche Suchmaschinen generieren auch automatisch Texte, weil sie der Meinung sind, somit dem Suchenden besser helfen zu können.
<meta name="description" content="Diese Seite behandelt Meta-Tags. Wie nutzt man sie und was stellen sie dar?!" /> - keywords
- Mit diesem Wert lassen sich Schlüsselwörter festlegen. Auch er wird von Suchmaschinen genutzt. Allerdings ist man sich nicht ganz sicher, ob das wirklich noch bei allen der Fall ist, da man damit schon recht viel Missbrauch trieb.
<meta name="keywords" content="html, tutorial, meta, tag, tutorial meta-tag" />
Das http-equiv Attribut
Mit dem http-equiv Attribut lassen sich weitere HTTP-Header Informationen angeben. Diesen werden hauptsächlich vom Browser genutzt.
- Content-Type
- Mit diesem Wert lassen sich Art und Kodierung des Dokumentes festlegen. Sollte man einmal Probleme mit Schriftzeichen haben, kann es ratsam sein diese Variante des Meta-Tags zu verwenden! Hier ein Beispiel, die Kodierung erfolgt in UTF-8:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> - Expires
- Mit Expires lässt sich ein Ablaufdatum des Dokuments festlegen. Dies ist zum Beispiel dann nützlich, wenn man den Browser sagen möchte, dass eine neue Version dieses Dokuments verfügbar ist. Bei "aggressivem" Cachen, kann es sein, dass der Browser stets die Seite aus dem Cache lädt, obwohl sie veraltet ist. Diese Variante erwähne ich nur der Vollständigkeit halber, denn die meisten Browser Cachen "soft". ;)
<meta http-equiv="Expires" content="Wed, 19 March 2010 17:00:00 GMT" />Natürlich sollte man beachten, dass der Browser erst eine neue Version des Dokuments herunterlädt, wenn das angegebene Datum überschritten ist! - Refresh
- Sehr weit verbreitet ist auch die Methode einen User mit Hilfe des Refresh Wertes weiterzuleiten. Diese Variante ist nicht die empfehlenswert, da einerseits der User nicht auf den Zurückbutton gehen kann und andererseits Suchmaschinen ihm nicht folgen müssen! Daher empfiehlt es sich die Umleitung z.B. mit dem Apache-Modul mod_rewrite oder mod_alias zu realisieren. Der content Wert setzt sich übrigens aus der Wartezeit in Sekunden und der Zieladresse zusammen. Nach Ablauf der Wartezeit beginnt der Browser mit der Weiterleitung!
<meta http-equiv="Refresh" content="5; url=http://www.example.org/" />
IE Kompatibilitätsansicht
Noch relativ neu und unbekannt ist die Möglichkeit festzulegen, in welcher Ansicht der IE8 Webseiten anzeigen soll. Das kann sinnvoll sein, wenn der IE8 Webseiten nicht in der IE8-Ansicht sondern z.B. IE7-Ansicht darstellt.
- X-UA-Compatible
- Wieder wird das http-equiv Attribut genutzt. Das content Attribut kann dann folgende Werte erhalten:
- IE=5
- IE=7
- IE=8
<meta http-equiv="X-UA-Compatible" content="IE=8" /><meta http-equiv="X-UA-Compatible" content="IE=5; IE=8" />
Diese Angabe muss vor allen anderen Meta-Angaben stehen. Das einzigste Element, welches vor ihm stehen darf ist das title-Element!