1. Grundlegendes
Zur Erstellung einer HTML-Seite benötigt man lediglich einen Text-Editor.
Programmierkenntnisse sind für einfache Seiten keinesfalls vonnöten.
» selfhtml (Profi HTML-Anleitung)
» ActivePerl Anleitung
2. Minimaler Aufbau einer HTML Seite
Folgene 8 Zeilen stellen das Grundgerüst jeder HTML Seite dar,
das man immer benötigt. Abgespeichert in einem Textfile mit
der Endung ".htm" läßt sich diese einfache Seite schon anzeigen.
<HTML>
<HEAD>
<TITLE>Text der Titelzeile</TITLE>
</HEAD>
<BODY>
Hier kommt der Text auf der Seite<BR>
</BODY>
</HTML>
3. Texteingabe
Text, der mit einfachen ENTER Umbrüchen
in dem HTML-File steht, wird erst umgebrochen,
wenn auch der Befehl dazu gegeben wird.
<BR> = Zeilenumbruch
<P> = Absatz
Leerzeichen am Anfang der Zeile werden ignoriert.
Groß- und Kleinschreibung ist bei "Tags" egal. Ein "TAG" ist eine
Steuersequenz, die den Web Browser anweist etwas mit dem Text zu tun,
der zwischen <"Anfang Befehl"> und < /"Ende Befehl"> steht. Umbrüche benötigen kein Ende Zeichen.
4. Einfache Textformatierungen
<B> = bold = fett
<I> = italic = kursiv
<U> = underline = unterstrichen
<FONT FACE="Verdana" SIZE="1" COLOR="#FF0000"> = Schriftart = Beispiel
Und zum Selberausprobieren wäre da noch <S>.
Es ist nötig, nach der Hervorhebung die Wirkung wieder
aufzuheben. Das geht mit dem </S> Tag. Sonst
wirkt die Formatierung auf den ganzen nachfolgenden Text!
Ebenso
</B> </I> </U> </FONT>
5. Überschriften
h1 groß,
h2 mittel,
h3 klein.
Erzeugt werden Überschriften mit den h1 bis h3 Tags:
<h1>Überschrift groß</h1>
<h2>Überschrift mittel</h2>
<h3>Überschrift klein</h3>
Als Beispiele sind die Überschriftsgrößen in dieser Überschrift enthalten.
Ein
<BR>
für den Zeilenumbruch ist hinter den Überschriften nicht nötig.
6. Wie baue ich nun eine HTML-Seite?
Man öffnet einen Texteditor und kopiert die 8 Zeilen unter
Punkt 2 in ein leeres Textfile. Dieses File wird dann mit
'speichern unter' auf die Festplatte gebannt und der File geschlossen.
Die Endung des Files ist im allgemeinen ".txt" für einen Textfile.
Dieser File wird dann mit der Endung ".htm" versehen und kann dann,
falls der Internet Explorer oder der Netscape installiert ist,
mit einem Doppelklick auf das File angeschaut werden.
Nun bemüht man wieder den Texteditor um eigene Texte zu schreiben
und dem Ganzen einen richtigen Inhalt zu geben.
Noch ein Tipp am Rande:
Statt <BODY> sollte man besser <BODY BGCOLOR="FFFFFF"> schreiben,
damit die traurige Hintergrundfarbe von grau auf weiß wechselt.
Die besten Tipps bekommt man natürlich von existierenden Seiten, die
man sich mit "Ansicht" "Quelltext" anschauen kann. Es öffnet sich ein
Editorfenster, in dem Sie sehen, wie die aktuelle Seite geschrieben wurde.
Probieren Sie es gleich mal mit dieser Seite aus, viel Spaß!
7. Ein Bild einfügen
Um ein Bild in eine html-Seite einzufügen, benötigt man das Image-Tag .
Zusätzlich muss der Browser noch wissen, welches Bild er laden soll.
Dies geschieht mit dem Zusatz SRC für 'source' innerhalb des Image-Tags. Der Pfad
wird dann in Anführungszeichen dahintergeschrieben.
<IMG SRC="./images/laeufer.gif">
<IMG SRC="./Pfad/Bild.jpg">
Dieses Zeichen bedeutet, dass der Browser an der angegebenen Stelle kein Bild gefunden hat.
7. Einen Link einfügen
Ein Link ist ein Querverweis auf eine andere Seite. Erkennbar ist er am Unterstrich
und an der anderen Farbe. Wenn der Benutzer einem Link folgt und danach wieder
zu der Anfangsseite zurückkehrt, ändert sich die Farbe des Links.
<a href="http://www.coschki.de"> CoschKi.de </a>
8. Tabelle
| 1. Zeile - 1. Spalte | 1. Zeile - 2. Spalte | 1. Zeile - 3. Spalte | ||
| 2. Zeile - 1. Spalte | 2. Zeile - 2. Spalte | 2. Zeile - 3. Spalte |
<TABLE>
<TR>
<TD>1. Zeile - 1. Spalte</TD>
<TD>1. Zeile - 2. Spalte</TD>
<TD>1. Zeile - 3. Spalte</TD>
</TR>
<TR>
<TD>2. Zeile - 1. Spalte</TD>
<TD>2. Zeile - 2. Spalte</TD>
<TD>2. Zeile - 3. Spalte</TD>
</TR>
</TABLE>