Ihre erste Webseite
Um unsere erste Webseite zu erstellen, benötigen wir zu erst die dazu gehörende Software “Texteditor”.
Wie beim ersten Teil dieser Tutorial-Reihe schon erwähnt, können Sie auch einen WYSIWYG-Editor verwenden. Es gibt kostenslose, wie Notepad++, sowie auch kostenpflichtige Softwares wie Adobe Dreamweaver (aktuelle Version CS5.5).
Ich persönlich bevorzuge Notepad++, weil es nicht so viel “schnick-schnack” hat wie Dreamweaver. Ich stehe mehr auf das schlichte und einfache. Aber das soll nicht heissen, dass Dreamweaver schlecht ist. Damit habe ich auch gute Erfahrungen gemacht.
Dieser vorinstallierte Texteditor ist bei Windows Rechnern unter Start -> Alle Programme -> Zubehör -> Editor zu finden.
Das Grundgerüst
Der Browser liest HTML genau wie wir: von links nach rechts und von oben nach unten. Ein HTML-Dokument beginnt mit dem, was am Anfang auf der Seite dargestellt werden soll und endet mit dem, was am Ende kommen soll.
Als allererstes teilen wir dem Browser mit, in welcher Sprache wir die Webseite schreiben. In unserem Fall ist es HTML und dies geschieht mit dem Tag <html>. Es ist wichtig, dass dieser Tag in der ersten Zeile unseres Dokumentes steht.
Wie Sie vom zweiten Teil dieser Tutorial-Reihe wissen, ist <html> ein Start-Tag, der mit einem End-Tag geschlossen werden muss, wenn das HTML-Dokument beendet ist. Deshalb schreiben wir nach ein paar Leerzeichen “</html>“.
Als nächstes braucht unser HTML-Dokument ein Kopf (head) und einen Körper (body). Der Head-Bereich enthält Informationen über unser Dokument und im Body-Bereich steht der Inhalt des Dokuments.
Logischerweise steht der Kopf (<head> und </head>) über dem Körper (<body> und </body>).
Zur Zeit sollte es bei Ihnen wie folgt aussehen:
Wie Sie bestimmt bemerkt haben, ist mein Dokument strukturierter und übersichtlicher als Ihres. Ich habe neue Zeilen eingefügt (ENTER-Taste) und die Tags eingerückt (Tabulator-Taste).
Eigentlich spielt es keine Rolle, wie Sie Ihren Dokument strukturieren. Aber um Ihnen und anderen zu helfen, Ihren Quellcode zu lesen und den Überblick zu behalten, ist es empfehlenswert, Ihre Dokumente mit Zeilenumbrüchen und Einrückungen zu strukturieren.
Inhalte
Wie vorhin erwähnt, besteht unser HTML-Dokument aus zwei Teilen: dem Kopf und dem Körper. Im Kopfteil (head-Bereich) schreiben Sie Informationen über Ihre Seite, während im Körperteil (body-Bereich) die Inhalte zu stehen kommen, die dann im Browser angezeigt werden sollen.
Wenn Sie Ihrer Seite z.B. einen Titel geben möchten, der am oberen Rand des Browsers stehen soll, muss dies im Kopfteil (head-Bereich) geschehen. Dafür benötigen wir das Element “title”. Den Titel Ihrer Seite schreiben Sie zwischen den Start-Tag <title> und den End-Tag </title>:
<title>Meine erste Webseite</title>
Dieser Titel wird nicht auf der Seite selber zu sehen sein. Alles was auf der Seite zu sehen sein soll, müssen zwischen den <body> und </body>-Tags stehen.
Nun kommen wir zum eigentlichen Inhalt, der auf unserer Webseite zu sehen sein soll.
Wir wollen, dass auf unserer Webseite “Herzlich Willkommen!” stehen soll. Dazu benötigen wir die <p>-Tags. Schreiben Sie die folgende Zeile zwischen den zwei body-Tags:
<p>Herzlich Willkommen!</p>
Der Buchstabe “p” steht für “paragraph”, was auf Deutsch “Absatz” bedeutet.
Ihr HTML-Dokument sollte inzwischen wie folgt aussehen:
Nun haben Sie Ihre erste Webseite erfolgreich erstellt. Glückwunsch! 
Jetzt müssen Sie nur noch Ihr HTML-Dokument abspeichern und in Ihrem Browser öffnen:
- Zum abspeichern Ihres Dokumentes wählen Sie im Editor im Menü “Datei” den Punkt “Speichern unter…“.
- Wählen Sie “Alle Dateien” im Auswahlfeld “Dateityp”. Dies ist sehr wichtig. Denn sonst speichern Sie Ihre Datei als normale Textdatei und nicht als HTML-Dokument.
- Jetzt speichern Sie Ihr Dokument unter dem Namen “seite1.html” ab.
Nun wechseln Sie zu Ihrem Browser (die Angaben basieren auf Mozilla Firefox):
- Wählen Sie im Menü “Datei” den Punkt “Datei öffnen…” (CTRL+O).
- Suchen Sie jetzt nach Ihrem HTML-Dokument, markieren diese und klicken anschliessend auf “Öffnen“.
Nun sollte es bei Ihnen wie folgt aussehen:
Sie müssen jetzt unbedingt geduldig sein und munter weiter lesen. Denn der Spass hat erst jetzt begonnen. 
