Einleitung

Im ersten Kapitel des Kurses erstellst du ein einfaches Grundgerüst. Es besteht lediglich aus den wichtigsten Elementen einer Seite wie dem Kopfteil, dem Titel und einem Textteil, welcher aus einer Überschrift und einem kleinen Textblock zusammengesetzt wird.

 

Quelltext

Im Folgenden siehst du den Quellcode.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/transitional.dtd">

<html>>
<head>>
<title>> Meine erste Seite </title>>
</head>>

<body text="yellow" bgcolor="black"
link="red" vlink="violett" alink="orange">>

<h1>> Herzlich Willkommen </h1>>

<p>>
Ich begr&uuml;&szlig;e Sie herzlichst auf meiner Seite.
</p>>

</body>>
</html>>

 

Erklärung

Nun beschreibe ich die einzelnen Elemente und ihre Auswirkungen näher.

HTML Befehle heißen TAGs und sie werden meißt in kleiner als und größer als eingeschlossen. Viele Tags müssen mit einem / wieder beendet werden. Um in HTML Dokumenten Umlaute so zu verwenden, das sie jeder Browser versteht gibt es bestimmte Codes (Maskierung) die zum einen manuell eingegeben werden können und zum anderen von HTML Editoren automatisch eingefügt werden - ich empfehle Variante 2.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/transitional.dtd">
Mit diesen Zeilen wird der Type des Dokuments festgelegt. In dem Fall HTML 4.01.

<html>
Hier beginnt der eigentliche Teil des HTML-Dokumentes.

<head>
Hier beginnt der Kopfteil. Innerhalb dieses Bereiches können auch andere Angaben wie z. B. Meta Daten angegeben werden.

<title> Meine erste Seite </title>
Dies ist der Titel - er wird im Kopfteil des Browsers angezeigt.

</head>
Ende des Kopfteils.

<body text="yellow" bgcolor="black"
link="red" vlink="violett" alink="orange">
Hier beginnt die Webseite und somit auch die eigentlichen Informationen. Auch die Farben der Seite werden hier festgelegt: text = Textfarbe, bgcolor = Hintergrundfarbe, link = Linkfarbe, vlink = Farbe der besuchten Links, alink = Farbe des aktiven Links.

<h1> Herzlich Willkommen </h1>
Text, welcher in <h1> </h1> eingeschlossen ist, wird als Überschrift definiert. Es gibt insgesammt 6 Ebenen der Überschrift (h1 bis h6).

<p>
Ich begr&uuml;&szlig;e Sie herzlichst auf meiner Seite.
</p>
Komplette Absätze schließt man in <p> </p> ein. Solche Absätze sind gleichzusetzen mit Absätzen in der Textverarbeitung (Leerzeile über und unter dem Text, doppelte Zeilenschaltung).

</body>
Ende des Teils einer Webseite die am Bildschirm sichtbar ist.

</html>
Ende des HTML Dokumentes.

 

Ergebnis

Und so sollte die Seite am Ende aussehen.

Beginn des eingebetteten Rahmens

Ende des eingebetteten Rahmens