HTML ist eigentlich eine ganz einfache Sache. Das was wohl die meisten ein wenig erschrecken wird, ist der enorme Umpfang, an Befehlen. Aber das ist eigentlich kein Problem, denn man muss weder alle auswendig können, noch werden alle benötigt. Für eine einfache html Page, die beepworld-seiten um ein weites schlägt :) benötigt man nur eine Hand voll Befehlen. Auch braucht man dafür keine Teuren Programme. Für den Anfng reicht der Windows Editor vollkommen. Die einzelnen Befehle werden TAGS genannt.
Diese Tags stehen in eckigen klammern <>
Um einen Text FETT zu schreiben nimmt man den Tag <b>(b steht für bold was englisch fett bedeutet). Der Browser würde nun die Komplette Seite fett schreiben. Daher muss man ihm zeigen, wo er aufhören muss. Dies geschieht mit einem zweiten Tag. </b> Es würde also so aussehen:
<b>Hier wird der Text fett geschrieben</b> und hier geht der Text wieder normal weiter.
Das ist das Grundprinzip von HTML. Es ist also wirklich (fast) ein Kinderspiel. Natürlich können die Tags auch verschachtelt werden. Es wird dann mit der Zeit auch sehr unübersichtlich.
Den TEXT schreibt man einfach so hin. Lediglich UMLAUTE UND SONDERZEICHEN müssen umschrieben werden, da die engl. tastatur diese nicht kennt. Diese werden folgendermaßen umschrieben:
ä wird zu ä
ö wird zu ö
ü wird zu ü
Ä wird zu Ä
Ö wird zu Ö
Ü wird zu Ü
ß wird zu ß
Ein Satz würde dann so aussehen:
Auf die Straße mit denm verdammten Köter!
Nun kommen wir zu weiteren Bestandteilen von HTML:
So zeigt man dem Browser, dass es sich um einen Textabsatz handelt:
<p>Hier steht Text</p>
So werden 2 Absätze getrennt voneinander dargestellt:
<p>Hier steht Text</p>
<p>Hier steht noch mehr Text</p>
Eine Seitenüberschrift(sie wird in der obersten Browserleiste angezeigt - also ganz oben) wird folgendermaßen dargestellt:
<title>Wilkommen auf meiner Homepage</title>
Einer der Befehle, detr nicht mit einem zweiten Tag abgeschlossen werden muss, ist die durchgehende Trennlinie:
<hr>
Damit haben wir das Prinzip schon einmal im Griff. Aber der Seite fehlt noch eine Struktur. Diese besteht aus Kopf (head) und Körper (body) In diesen Bereichen findet sich dann der Inhalt wieder.
Und natürlich darf man den Wichtigsten tag nicht vergessen, nahmlich <html> Dieser steht an Anfang und ende der Seite und darf nicht vergessen werden, da sie Seite unter Umständen sonst nicht angezeigt wird.
Die ganze Seite stellt sich dann so dar:
<html>
<head>
<title>Meine erste Seite</title>
</head>
<body>
Hier ist Platz für die eigentlichen Inhalte: Texte und Bilder und natürlich HTML Tags.
</body>
</html>
Um ein Bild einzufügen benötigt man den Tag
<img src="">
Zwischen die ""Zeichen wird der Bildname geschrieben.
Natürlich gibt es allerlei nützlicher Attribute für den <img>Tag. Mit
width="" und height="" kann man die Höhe/Breite des Bildes bestimmen. Das sieht dann so aus:
<img src="bild.gif" width="100" height="100">
Aber damit nicht genug. mit dem Attribut border="" kann man dem Bild noch einen Rand verpassen. Zwischen die "" kommt die Breite des Rahmens. Dies stellt sich so dar:
<img src="bild.gif" width="100" height="100" border="2">
Und als wär das noch nicht genug, kann man dem Bild mit alt="" noch eine Bildbeshcreibung hinzufügen, die Angezeigt wird, wenn das Bild noch lädt, oder wenn man mit dem Cursor darübergeht.
<img src="bild.gif" width="100" height="100" border="2" alt="Meine Bildbeschreibung">
Um den Hintergrund einzufärben benötigt man den Tag
<body bgcolor="">
Zwischen die "" kommt der Farbname, und zwar auf englisch. Um die Seite dann blau einzufärben nimmt man den Tag
<body bgcolor="blue">
Standardfarben hierbei sind aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, und yellow. Es gibt zwar noch andere, die Größtenteils mit Hexadezimalcodes bezeichnet werden, aber diese lassen wir erstmal außen vor.
Wird im <body> Tag nichts angegeben, färbt der Browser die Seite weiß. Einige ältere zeigen ih dann grau.
Wem das nicht genügt, der kann noch ein Bild als Hintergrund verwenden, damit mann dann unendlich viele Möglichkeiten hat. Aber man sollte es nicht übertreiben. Viele Seiten sehen mit Hintergrundbild gar nicht mehr so schön aus. Verwendet diesen Tag:
<body background="bild.gif">
Kommen wir nun zu den Hyperlinks. Um eine Seite zu verlinken benutzt man den Tag
<a href="seite2.html">Hier klicken, um auf die nächste Seite zu kommen</a>
Um einen Link auf eine Fremde Website zu erstellen, muss lediglich der Domainname dazugeschrieben werden:
<a href="http://manta89.de.vu>Hier klicken, um auf die Homepage von Manta zu kommen</a>
Und zu Guter Letzt gibt es noch den guten alten email-Link. Dieser stellt sich so dar:
<a href="mailto:mail@domain.de">schick mir mal was</a>
Der Unterschied besteht also nur in dem mailto, dass vornedran geschrieben wird. Praktischerweise kann man noch die Betreffzeile dazuschreiben:
<a href="mailto:mail@domain.de?subject=hallo">schick mir ma was<a/>
So das wars für den Anfang. Nun solte euch eigentlich nichts mehr im wege stehe, die erste eigene Seite zu gestalten.
MfG