Am Anfang einer HTML-Datei sollte ein Dokumenttyp-Deklaration stehen. Hinter der einleitenden spitzen Klammer
folgt ein Ausrufezeichen, gefolgt von der Angabe DOCTYPE HTML PUBLIC
. Diese gibt an, auf welche
öffentliche HTML-DTD man sich bezieht.
Nun 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">
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">
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.
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:
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
Hier wird dem Browser mitgeteilt, mit welchem Zeichensatz die Seite erstellt wurde.
In Deutschland und andere westlichen Ländern wird ISO-8859-1 benutzt
<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="content-language" content="de">
Hier wird der Suchmaschine mitgeteilt, in welcher Sprache Ihre Seite erstellt wurde. DE steht für deutsch.
<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.
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 PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Meine erste Website</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="description" content="Beschreibung der Seite">
<meta name="keywords" content="Inhalt in Stichworten">
<meta name="content-language" content="de">
<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.