Das Grundgerüst
Am Anfang einer HTML-Datei sollte ein Dokumenttyp-Deklaration stehen. Hier wird angegeben, auf welche
öffentliche HTML-DTD man sich bezieht. Unter HTML 5 sieht es so aus
<!DOCTYPE HTML>
Unter HTML 4.01 und XHTML sieht es etwas komplizierter aus. Diese sind veraltet, und sollten nicht mehr verwendet werden!
Hier wird in Anführungszeichen der Herausgeber der DTD, in diesem Fall das W3-Konsortium, sowie den
Dokumententyp "HTML", die Sprachversion 4.01 und deren Variante Transitional. Zum Schluss noch die
Sprache, in diesem Fall Englisch EN. Hierbei ist nicht die Sprache des Inhalts deiner Website
gemeint, sondern die Tagsprache, mit der Elemente und Attribute definiert werden. Benutzen Sie daher immer
EN.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Wenn Sie nur die reine HTML-Sprache verwenden wollen, benutzen Sie diese Angabe. Auch die Befehle, die als
deprecat gekennzeichnet sind, sind (noch) mit dieser Deklaration möglich. Ferner
kann noch die Web-Adresse der Dokument-Definition mit angegeben werden, die jedoch nicht zwingend erforderlich ist.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Wollen Sie sich strickt an das W3-Konsortium halten, und CCS-Stylesheets verwenden, so benutzen Sie den
folgenden Code. In diesem Fall sollten Sie auf alle Befehle, die als deprecat
gekennzeichnet sind, verzichten.
Alle nicht erlaubten Elemente und Attribute in der Strict-Variante finden Sie du in dieser
Tabelle
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Wenn Sie Framesets verwenden möchten, sieht der DocType wie folgt aus:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
Entsprechende Dokumenttyp-Deklarationen für XHTML
Wenn Sie mit XHTML Arbeiten möchten, sehen die Dokumenttyp-Deklarationen etwas anders aus. Diese sollten Sie
jedoch erst anwenden, wenn Sie sich mit HTML gut auskennen.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Zusätzlich gibt es noch die Deklaration für XHTML 1.1. Diese entspricht der Variante strict.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Kopfdaten einer HTML
Nach der Dokumenttyp-Deklaration folgt die Angabe <html> bei HTML-Dateien bzw.
<html xmlns="http://www.w3.org/1999/xhtml"> bei XHTML-Dateien. Der Endtag </html>
wird am Ende der Datei notiert. Dieses Element umschließt also die gesamte Datei.
Die verwendete Sprache wird hier ebenfalls notiert, also <html lang="de">
Nach dem einleitenden <html>-Element folgt das <head>-Element (Kopf).
Innerhalb des <head>...<head> kommen Angaben, die im Browser nicht
dargestellt werden, die aber trotzdem von Bedeutung, z.B. für Suchmaschinen und Browser, sind. So gehört der
Titel der Seite in diesen Bereich. Er wird in der Titelzeile des Browsers angezeigt. Dieses ist eine Pflichtangabe.
<title> Meine schöne neue Website</title>
Weiterhin werden hier sogenannte Meta-Tags, die ebenfalls für Suchmaschinen gedacht sind, angegeben.
Es gibt eine ganze Reihe von unterschiedlichen Meta-Tags, die für verschiedene Suchmaschinen von unterschiedlicher
wichtigkeit sind.
Die wichtigsten habe ich hier aufgeführt:
Den benutzen Zeichensatz teilen sie den Browser mit folgender Zeile bei HTML5 mit:
<meta charset="utf-8">
Bei HTML4 sieht es dann so aus:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
Des weiteren folgt dann:
<meta name="description" content=
"Hier kommt die Beschreibung Ihrer Seite rein">
<meta name="keywords" content="
Hier schreiben Sie in Stichworten rein, welchen Inhalt Ihre Seite hat">
<meta name="robots" content="index, follow">
Hier sagen Sie der Suchmaschine, ob sie die Seite indizieren soll und ob sie eventuellen Links folgen soll.
Dabei bedeutet:
index = Diese Seite soll indiziert werden, das heisst, sie soll von der Suchmaschine
aufgenommen werden.
noindex = Diese Seite soll nicht indiziert werden.
follow = Die Suchmaschinen-Roboter sollen den Links zu folgenden Seiten folgen.
nofollow = Die Suchmaschinen-Roboter sollen den Links zu folgenden Seiten nicht folgen.
Körper einer HTML
Zwischen den <body>...</body>-Elementen kommt dann alles, was der
Browser anzeigen soll. Dazu gehören u.a. Text, Bilder, Sound und Videos.
Die gesamte Grundstruktur einer HTML-Datei sieht dann wie folgt aus:
<!DOCTYPE HTML>
<html lang="de">
<head>
<title>Meine erste Website</title>
<meta charset="utf-8">
<meta name="description" content="Beschreibung der Seite">
<meta name="keywords" content="Inhalt in Stichworten">
<meta name="robots" content="index, follow">
</head>
<body>
Hier kommt der Inhalt rein, der angezeigt werden soll.
</body>
</html>
Am besten wird es sein, diese Grundstruktur zu kopieren, ihren Bedürfnissen anpassen und dann diese mit
den Inhalt deiner Homepage zu füllen.
