Der Dateikopf (Header)

Kein Beitragsbild

Ein Blick in den Quellcode einer HTML-Seite offenbart mitunter unverständliche Zeichen und Definitionen. Viele dieser Elemente tauchen immer wieder auf, ohne sie funktioniert nichts.

Schauen wir uns zunächst ein typisches Beispiel an:

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0
Transitional//EN">
 <html>
 <head>
 <meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
 <meta http-equiv="PICS-Label"
content="">
 <meta name="generator" content="Adobe
GoLive 4">
 <link rel="STYLESHEET" href="style.css"
type="text/css">
 <title>Der Titel dieser Seite</title>

</head>
 <body>
 </body>
 </html>

Dokumententyp
Jedes Dokument beginnt oder sollte beginnen mit einer sogenannten Doctype-Deklaration (DTD). Sie gibt an welcher HTML-Standard im Folgenden verwendet wird. In unserem Beispiel wäre das HTML 4.0. Dort können aber auch HTML 3.2 oder HTML 2.0 zu finden sein. Transitional bedeutet, das diese Seite Stylesheets verwendet. Das dahinterstehende //EN bezieht sich auf die Sprache der HTML-Tags, die immer Englisch ist, egal in welcher Landessprache ein Dokument geschrieben wird.

Dreamweaver fügt diese Einleitung nicht selbständig hinzu. In der Online-Hilfe kommt der Begriff nicht einmal vor. Was kein Beinbruch ist, denn die Seiten werden trotzdem immer korrekt dargestellt. Nur entsprechen sie leider nicht korrektem HTML. Da man nicht weiß , was uns noch alles erwartet, fügt man die DTD besser hinzu.

Folgende Möglichkeiten stehen Ihnen zur Verfügung:

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD
HTML 2.0//EN">
 HTML 2.0 
      <!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 3.2//EN">
 HTML 3.2
      <!DOCTYPE
HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
 HTML 4.0
      <!DOCTYPE
HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 HTML 4.0
und CSS
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0
Frameset//EN">
 HTML 4.0 und Frames

Der <html>-Tag
Leitet ein Dokument ein. Er ist unverzichtbar und wird ganz am Ende einer Seite wieder geschlossen. Übersieht man ihn, löscht man diesen Tag versehentlich oder verschiebt ihn, kann es passieren, dass die Seite in manchen Browsern nicht mehr dargestellt wird.

Der <head>-Tag
Er leitet die Definition des Seitenkopfes, im Englischen “Header” genannt, ein. Ein ebenso unverzichtbarer Bestandteil jeder Seite. Hier finden sich alle Angaben, die sich an den Browser oder an Suchmaschinen richten, jedoch nicht optisch dargestellt werden sollen. Eine Zwischenstufe nimmt der Seitentitel ein.

Es gibt weitere Tags innerhalb des Headers. Dabei handelt es sich um sogenannten Meta-Tags, die sich überwiegend an Suchmaschinen richten oder der Systematik dienen. Der Zeichensatz. Eine verdächtig unverständlich aussehende Zeile folgt:

E-Book Effektives Online Marketing von Andreas Hecht

E-Book: Effektives Online Marketing

Entdecke die Power des perfekten Online-Marketings für deine Website. Du erfährst neue Techniken, die deine Website automatisch besser ranken lassen und die dir nach und nach einen Expertenstatus verleihen werden. [...]

      <meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">

Diese Angabe liefert dem Browser Informationen darüber, welchen Zeichensatz es verwenden soll. Davon gäbe es viele. Hier ist es der Standard ISO 8859-1. Für den westeuropäischen Sprachraum, also auch für deutschsprachige Seiten, ist dies der übliche Zeichensatz. Dreamweaver fügt ihn automatisch in jede neu angelegte Seite ein.

Die Klassifizierung
Sie können über einen unabhängigen Service Ihre Seiten klassifizieren lassen, um Sie beispielsweise Kindern unzugänglich zu machen. PICS steht für “Platform for Internet Content Selection”. Dabei handelt es sich um eine Art freiwillige Selbstkontrolle. Die Klassifizierung von Dr. Web sieht zum Beispiel so aus:

      <META http-equiv="PICS-Label" content='(PICS-1.1
"http://www.rsac.org/ratingsv01.html" l gen true comment "RSACi
North America Server" for "http://www.ideenreich.com" on "1999.03.19T08:34-0800"
r (n 0 s 0 v 0 l 0))'>

Damit wird ausgesagt, dass es sich um unbedenkliches Material handelt. Mehr Informationen darüber erhalten Sie bei der RSAC.

Der Generator
Der Generator ist so viel wie der Erzeuger einer Seite. Das klingt komplizierter als es ist.

      <meta name="generator"
content="Adobe GoLive 4">

An dieser Stelle verewigen sich viele HTML-Editoren mit ihrem Namen. In unserem Beispiel ist es GoLive von Adobe. Einen Nutzen hat das nicht, es sei denn neugierige Besucher erforschen Ihren Quellcode. Dreamweaver setzt keine Marke. Verwenden Sie einen anderen Editor, können Sie diese Zeile ohne weiteres löschen.

Externe Stylesheets
Mit diesem Befehl innerhalb des Headers wird ein Dokument mit einem externen Stylesheet verbunden

      <link rel="STYLESHEET" href="style.css"
type="text/css">

Der Seitentitel
Nicht Fisch und nicht Fleisch. Nicht zur eigentlichen, im Browser dargestellten Seite gehört ser sehr wichtige Seitentitel, wird aber auch nicht unterdrückt. Er ist in der ganz oberen Browserzeile zu sehen. Unverzichtbar ist der Seitentitel für Lesezeichen (Bookmarks), abgespeicherte Seiten und Suchmaschinen, die mit den Informationen in dieser Zeile ihre Suchausgabe garnieren. Bei einem aussagekräftigen Seitentitel wird man besser gefunden und bietet seinen Besucher mehr Orientierung.

      <title>Der
Titel dieser Seite</title>

Der <body>-Tag
Die eigentliche Seite leitet er ein, nämlich was hinterher auf dem Monitor zu sehen ist. Er wird am Ende der Seite wieder geschlossen und zwar vor dem </html>-Tag.