Metadaten
Einleitung
Der Inhalt einer Webseite alleine genügt nicht, um sie im Browser richtig darzustellen oder sie für Suchmaschinen indexierbar zu machen. Man benötigt zusätzliche Metainformationen, welche den Inhalt beschreiben. Dazu gehören Informationen wie:
- Sprache
- Zeichensatz
- Titel
- Kurzbeschreibung
- Stichworte
- Autor
Diese Informationen werden in Form von <meta>
-Tags im Header der HTML-Seite mitgeschickt. Browser, Proxy-Server, Suchmaschinenroboter oder assistive Technologien interpretieren diese Daten und nutzen sie, um die Inhalte unterschiedlich zu behandeln.
Seitentitel
Der Seitentitel ist ein besonders wichtiges Element einer Webseite. Er soll 40-100 Zeichen lang sein und möglichst präzise den Inhalt der Seite beschreiben. Verwenden Sie dafür möglichst treffende Schlüsselwörter. Der Titel wird für verschiedene Zwecke verwendet:
- Titelzeile des Browserfensters
- Bezeichnung von Lesezeichen
- Überschrift in Suchresultaten
<title>Barrierefreiheit im Internet - Seitenaufbau</title>
Meta Tags
Folgende Meta-Tags sollten im Header jeder HTML-Seite enthalten sein. Der title
die description
und die keywords
sind vorallem für Suchmaschinen besonders wichtig.
<head> <!-- Zeichensatz --> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <!-- Sprache des Inhalts --> <meta name="content-language" content="de" /> <!-- Titel --> <meta name="title" content="Barrierefreiheit im Internet" /> <!-- Prägnante Schlüsselwörter --> <meta name="keywords" content="Barrierefreiheit,Accessibility,..." /> <!-- Kurzbeschreibung --> <meta name="description" content="Alles über Barrierefreiheit" /> <!-- Autor --> <meta name="author" content="Hans Muster" /> <!-- Publiziert durch --> <meta name="publisher" content="Hans Muster" /> <!-- Copyright --> <meta name="copyright" content="Hans Muster" /> </head>
Anweisungen für Suchmaschinen-Roboter
Das robots
Meta-Tag gibt den Suchrobotern Hinweise, ob der Inhalt dieser Webseite indexiert werden soll, oder nicht. Zudem kann mit follow
bestimmt werden, ob Links dieser Seite auch mit indexiert werden sollen.
Mit dem revisit-after
Meta-Tag kann man die Aktualität der Daten beschreiben.
<!-- Indexierung dieser Seite: index oder no-index --> <!-- Links ebenfalls indexieren: follow oder no-follow --> <meta name="robots" content="index,follow" /> <!-- Wiederbesuchszeit in days, weeks oder months --> <meta name="revisit-after" content="2 days" />
Dokumentsprache
Damit ein Werkzeug, den textuellen Inhalt mit der richtigen Sprache interpretiert, muss diese im Dokumentenkopf angegeben werden.
<html lang="de" xml:lang="de"> ... </html>
Wenn in einem Text Wörter einer anderen Sprache vorkommen, sollten diese mit einem <span>
-Tag umschlossen werden, bei dem die Sprache für dieses Wort angegeben wird.
Dies ist beispielsweise für einen Screenreader wichtig, da das Wort sonst in der falschen Sprache vorgelesen wird.
<p>So funktioniert ein <span lang="en" xml:lang="en">Screenreader</span></p>