Adatrad-Blog

Jede Menge vernünftiger Content

Eigene Homepage in drei Schritten: HTML-Dateien erstellen

Den ersten Schritt, Domain registrieren und Webspace mieten, haben wir also mit Ach und Krach hinter uns gebracht. Ab jetzt wird es einfacher.

HTML-Dateien erstellen:

Wer 10 Minuten Zeit hat, eignet sich den Umgang mit den nachfolgend beschriebenen wenigen HTML-Befehlen an, die wir für unsere Seite benötigen; wer nur 5 Minuten Zeit hat, lädt das Zip herunter [Link zum Download der Zip-Datei unter dem Artikel], in dem sich ein Ordner mit den 3 untereinander verlinkten HTML-Dateien befindet. Diese mit einem Text-Editor (z. B. MS Notepad) öffnen, den eigenen Text und die eigenen Daten einsetzen, fertig. Ab ins Netz damit.

Wichtig ist, erstmal da zu sein. Was macht man, bevor man sich hinsetzt und ein Theaterstück schreibt? Genau: Den Premierentermin festlegen. Also zuerst die Seite hochladen, dann nach und nach mit Inhalten füllen und dann erst vergrafiken.

Jede HTML-Datei verfügt über einen head-Bereich <head>, der den Title <title> enthält [Anmerkungen zum Title-Tag] und einen body-Bereich <body> mit den sichtbaren Inhalten.

Das Layout unserer Seite basiert auf einer einzeiligen Tabelle mit 2 Spalten. In der linken Spalte mit festgelegter Breite befindet sich die Navigation. In der rechten Spalte, die den Rest des Bildschirmfensters einnimmt, der Text, bestehend aus einer Überschrift ersten Grades <h1> und einem Absatz <p>

Jedes HTML-Element besteht aus einem öffnenden <tag> und einem schließenden </tag>. Wie anhand der Tabelle <table> gut nachvollzogen werden kann, können HTML-Elemente verschachtelt werden, sodass eine hierarchische Struktur entsteht.

Übersetzung persisch

Ein Link besteht aus einem öffnenden Tag <a> und einem schließenden </a> (a = anchor). Das im öffnenden <a> enthaltene Attribut href (href = hyper reference) definiert das Verweisziel. Die Links im Navigationsmenü unserer Seite verweisen auf die Dateien index.html, profil.html und kontakt.html”. Zwischen <a> und </a> steht der sichtbare Linktext:
<a href=”kontakt.html”>Kontakt</a>.

<br /> ist ein Zeilenumbruch.

Suchmaschinen lesen den sichtbaren Text einer Seite aus, ziehen daraus Schlüsse hinsichtlich der Relevanz einer Seite für bestimmte Suchbegriffe. Taucht der Suchbegriff im Titel der Seite auf, gibt das natürlich richtig Punkte, weitere Punkte für den Suchbegriff gibt es, wenn dieser in den Überschriften und Linktexten erscheint, <b>fett</b> und <em>kursiv</em> ausgezeichnet ist.

Die wohl beste und umfassendste deutschsprachige Einführung in HTML ist Selfhtml von Stefan Münz. In der dort zu findenden Kurzreferenz kann man alle HTML-Elemente nachschlagen.

Noch 2 Kleinigkeiten!
In die erste Zeile des Dokuments gehört die Dokumenttyp-Deklaration:
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
Einfach in jede einzelne Seite kopieren und vergessen.

In den head-Bereich gehört die Angabe der verwendeten Zeichenkodierung:
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″>
Einfach in jede einzelne Seite kopieren und vergessen.

Und ab damit ins Netz!

HTML-Dateien erstellen  Download: Beispielseite (Zip 1,5 Kb)

Eigene Webseite in drei Schritten

Teil I: Domain registrieren, Webspace mieten
Punkt Eigene Webseite Teil II: HTML-Dateien erstellen
HTML-Dateien erstellen Pfeil Teil III: Webseite auf den Server laden

Übersetzer-Blog • Veröffentlicht unter Creative Commons BY-NC-SAWP-Theme • CMS: Wordpress • Webdesign: nofactory.eu