Das head-Element in HTML ist ein Container für Metadaten und anderen Angaben und wird eingefügt zwischen dem
<html> Tag und dem <body> Tag. Metadaten sind Informationen über das Dokument. Metadaten werden vom Browser nicht angezeigt.
Die folgenden Angaben werden im <head>Bereich eingefügt: <title>, <style>,<meta>,<link>,<script>,<base>
usw.
Das <title> Element:
Das<title>Element definiert den Titel eines Dokumentes.
Das<title>Element wird im Browser-Tab angezeigt.
Das<title>Element definiert den Titel der Webseite wenn er unter Favoriten gespeichert wird.
Das <title> Element wird im Browser-Verlauf gespeichert.
Suchmaschinen verwenden das <title> Element als Eintrag für die SERP(Search Engine Result Page)
und ist ein wichtiger Rankingfaktor.
Zeichenkodierung:
Das<meta charset="UTF-8">Element verhindert das Umlaute fehlerhaft dargestellt werden.
Die "8" bedeutet, dass 8-Bit-Blöcke verwendet werden zur Darstellung eines Zeichens. Die zur Darstellung eines
Zeichens benötigten Blöcke variiert zwischen 1 und 4. Wenn ein Zeichen binär (alle Daten werden mit 1en und 0en dargestellt) mit nur 1 Byte gespeichert
werden kann, werden keine weiteren Bytes verwendet, wodurch die Größe des Dokuments nicht unnötig aufgebläht wird. Die ersten 128 englischen Zeichen
in UTF-8 sind die gleichen wie die von ASCII, was es abwärtskompatibel macht.
Meta-Tags
Description(Seitenbeschreibung)
Die Description dient der Kurzbeschreibung des Webseiten-Inhalts und eine prägnante Zusammenfassung.
Die Zusammenfassung sollte nicht länger als ca. 160 Zeichen sein.
Auch dieser Meta-Tag wird von Suchmaschinen im SERP(Search Engine Result Page) als Eintrag aufgelistet.
Wirkt sich nicht aufs Ranking aus , kann wenn sie gut gestaltet ist, die Klickrate erhöhen.
Das <link> Element verweist auf ein externes Stylesheet:
<!DOCTYPE html>
<html lang="de">
<head>
<link rel="stylesheet" href="mystyle.css">
</head>
<body>
<h1>jetzt HTML lernen mit CSS</h1>
</body>
</html>
Das HTML <script> Element
Das <script> Element verweist auf ein externes Skript:
<!DOCTYPE html>
<html>
<head>
<title>Page</title>
<script src="dateiname.js"></script>
</head>
<body>
<h2>Javascript im head</h2>
</body>
</html>
Das HTML <base> Element
Mithilfe des base-Elements können Sie die Basis für relative Verweise festlegen.
Es darf nur ein base-Element im Kopf eines HTML-Dokuments geben.
Wenn nun in der Datei beispielsweise folgende relative Grafikreferenz steht:
<img src="Bilder/Logo12.png">
… so ermittelt der Browser die Quelle dieser Grafik als
<img src="http://strassencoder.ch/Bilder/Logo12.png">
und öffnet mit target="_blank" in einem neuen Tab.