[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.

⇑<html lang="de"></html> - Tag

Innerhalb des <html lang="de"></html> - Tags werden alle HTML - Anweisungen eingefügt, von denen du schon einige kennengelernt hast.
"lang" steht für das englische Wort language - also Sprache. Wenn man den Wert "de" verwendet gibt man an, dass die Webseite deutschsprachige Informationen beinhaltet. Für beinahe jede Sprache gibt es einen eigenen Sprachcode wie z.B. "en" für Englisch oder "it" für Italienisch.

⇑<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 charset="UTF-8"> - es wird angeben dass die Zeichenkodierung UTF-8 verwendet wird - mehr dazu hast du bereits im Kapitel 5 erfahren.

Hier unten siehst du ein Beispiel für Kopfdaten im Quelltext:
Der Code:

<!DOCTYPE html>
<html lang="de">
<head>
    <title>Einführung in HTML5</title>
    <meta 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.