[html5.wirlernen.at] [Aufgaben zur Lektion] [Video zur Lektion]

Lektion 18: Kopfdaten in den head einfügen

Daten die man innerhalb der <head></head> - Tags einfügt werden als so genannte Kopfdaten bezeichnet. Diese Daten werden z.B. vom jeweiligen Webbrowser und den Webcrawlern (auch Spider, Searchbots, Robot genannt) der Suchmaschinen genutzt - mehr Infos zu Webcrawlern bei Wikipedia.

<title></title> - Tag

Mit dem <title></title> - Tag wird der Titel der Webseite in den head eingetragen. Dieser Titel wird z.B. von Suchmaschinen als Überschrift von Suchergebnissen verwendet.
Hier ein Beispiel der Verwendung des <title></title> - Tags:
<title>Einführung in HTML5</title>

Meta - Angaben

Mit den so genannten Metaangaben können zahlreiche Angaben wie z.B. verwendete Zeichenkodierung und dem Autor der Webseite in den head eingetragen werden. Diese Informationen werden u.a. von Suchmaschinen ausgewertet.
Hier eine (unvollständige) Reihe von Beispielen von Meta - Angaben:
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> - es wird angeben dass die Zeichenkodierung UTF-8 verwendet wird.

<meta name="author" content="Markus Oppitz"> - es wird angeben wer der Autor der Webseite ist.

<meta name="robots" content="noindex, nofollow"> - es wird angeben dass >Webcrawlern (für Infos siehe oben) diese Webseite und alle Unterseiten NICHT in ihr Verzeichnis aufnehmen sollen.

<meta name="description" content="Es handelt sich hier um eine Einführung im HTML5 und einige dazu gehörende Tags." /> - es wird angeben dass Webcrawler (für Infos siehe oben) diese Beschreibung der Webseite in ihre Suchergebnisse aufnehmen sollen.

<meta name="keywords" content="HTML, tags, Einführung, Tutorial" /> - es wird angeben dass Webcrawler (für Infos siehe oben) diese Schlüsselwörter zur Webseite in ihre Suchergebnisse aufnehmen sollen.

<meta http-equiv="refresh" content="60" /> - es wird angeben dass die Webseite alle 60 Sekunden - beachte den Wert für content - neu geladen wird.

Hier unten siehst du ein Beispiel für Kopfdaten im Quelltext:
Der Code:
<!DOCTYPE html>
<html>
<head>
    <title>Einführung in HTML5</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta name="author" content="Markus Oppitz">
    <meta name="robots" content="noindex, nofollow">
    <meta name="description" content="Es handelt sich hier um eine Einführung im HTML5 und einige dazu gehörende Tags." />
    <meta name="keywords" content="HTML, tags, Einführung, Tutorial" />
    <meta http-equiv="refresh" content="5" />
</head>

<body>
Im head - Bereich der Webseite befinden sich zahlreiche Kopfdaten...
</body>
</html>

[Beispiel zur Lektion]


Für mehr Infos klicke hier OBEN auf der Seite auf das Video - Symbol...
Augabenstellung:
1. Erkläre was der so genannte <title></title> - Tag bewirkt!
2. Erkläre mit eigenen Worten (also nicht irgendwo abschreiben :-)) wozu man Meta - Angaben in eine Webseite einfügt! In welchen Bereich des Listings werden Meta - Angaben eingefügt?
3. Erzeuge in einem Editor ein HTML5 - Grundgerüst! Füge dort im Grundgerüst an der richtigen Stelle durch copy und paste aus dem Internet ein Gedicht deiner Wahl ein! Wähle für diese Webseite mit dem entsprechenden Tag einen aussagekräftigen Titel! Füge mit sinnvollen Angaben (z.B. zum Gedicht passend) zumindest 5 Meta - Angaben an der richtigen Stelle in deinen Quelltext ein! Speichere diese Datei als 018.html.