|
Die meisten 'Anfänger-Guides' sind etwa so aussagekräftig wie eine Windows Fehlermeldung (Access Violation in Module 007-08/15-4711 - Aha, da hab ich jetzt was davon).
Meistens wird nicht einmal beschrieben, wo man die verdammten HTML-Befehle überhaupt reinschreiben soll (ich wollte sie zuerst in Word (!) schreiben).
Also: HTML ist nichts anderes als reiner Text, d.h. am Besten verwendet ihr den stinknormalen Windows - Editor (ja, genau den in der Zubehör-Gruppe mit dem Notizblock Symbol).
Dort werden alle Befehle hineingeschrieben und anschließend als Datei mit der Endung .html oder .htm abgespeichert. Das ist wichtig, da aus der Endung der Browser (Netscape, Microsoft Explorer) erkennt, daß es sich um ein Internet-File handelt.
Tip: Notepad (also der Editor) hat keine Voreinstellung um HTML Files einzuspeichern. Ihr müßt also wirklich bei 'speichern unter' den Namen 'datei.html' eingeben und darauf achten, daß der Dateityp auf 'all files' steht. Sonst hängt euch der Editor nämlich die Endung '.txt' an, wodurch die Datei wieder nicht als HTML File erkannt wird!
Und noch etwas: Alles in Kleinschreibung abspeichern! Das erspart euch später viel Mühe, glaubt mir.
Hier nun das Grundgerüst für jede Internet-Datei:
<html>
<head>
<title>DER TITEL DER SEITE</title>
</head>
<body bgcolor="#000000" text="#ffffff" link="#ff0000" vlink="#00ff00">
HIER STEHT NUN DEIN INHALT!!!!
</body>
</html>
Versucht nun, dieses Grundgerüst (von <html> bis </html>) zu kopieren, in den Editor einzufügen und als HTML Datei abzuspeichern (s.o.).
Mit einem Browser könnt ihr nun die Datei ansehen (file, open file, [pfad]datei.html).
Na, war doch gar nicht so schwer, oder??
Nun zur Erklärung, was das alles bedeutet:
HTML ist sehr logisch aufgebaut. Die Befehle (auch Tags genannt [ausgesprochen: Täks, Tex, Teeegsch - je nach Englischkenntnis und Dialekt]) werden immer in spitze Klammern geschrieben (<>) und gelten genau für den Bereich zwischen öffnen (z.B. <body>) und schließen (z.B. </body>) desselben.
Die einzelnen Befehle im Grundgerüst:
<html> sagt dem Browser, daß es sich um eine HTML Datei handelt.
<head> ist der Bereich der Zusatzinformation. Hier können Informationen über Autor, Entstehungsdatum oder Suchmaschineninfos stehen. Diese Infos sind für den Besucher normalerweise nicht sichtbar (!). Am Anfang werdet ihr wohl nur den
<title> verwenden. Wie der Name schon sagt, ist dies der Titel der Seite (in meinem Fall also "Axl's Black Hole"). Der Titel wird in der obersten Zeile des Browsers angezeigt.
Mit <body> beginnt der eigentlich sichtbare Teil, also der Inhalt der Seite. Alles was unterhalb von <body> steht ist sichtbar!
Aber da steht ja nicht nur <body>, da steht ja noch was in der Klammer. Diese Sachen (bgcolor, ...) nennt man Attribute, also Zusatzinformation zu einem Befehl. Sie sind optional, können also weggelassen werden. Je mehr Attribute allerdings verwendet werden, desto genauer weiß der Browser, wie er die Seite darzustellen hat.
Die Attribute des - Tags:
- bgcolor: steht für backgroundcolor, also die Hintergrundfarbe.
Was bedeuten diese kryptischen Nullen und F's? Nun, wir wollen dem Browser mitteilen, welchen Farbe wir wünschen. Dies geschieht mittels hexadezimalem RGB - System. Das hört sich toll an und man kann damit sicher die Mutter der Freundin beeindrucken ("Ich arbeite als hexadezimales RGB - System" - "Und wieviel verdient man da?").
Übersetzt heiß das ROT - GRÜN - BLAU (damit kann man nicht mehr so gut angeben), in den Bereichen von 00 (gar nicht) bis ff (volle Pulle).
Beispiel: "#000000" ist Schwarz (keine der drei Farben), "#ffffff" ist Weiß (alle Farben voll), "#ff0000" ist Rot (R hat ff, die anderen 0), usw.
Hexadezimales System wird wie folgt gezählt: 0-9, dann a, b, c, d, e, f. Ihr könnt also auch folgenden Farbcode verwenden: "#86a39a".Tip: Immer darauf achten, daß der Farbcode 6 - Stellen zählt! "#0000" zählt also nicht. Auch wenn man nur Grün will, müssen auch die Nullen für Rot und Blau angegeben werden ("#00ff00").Nachdem wir das Farbsystem kennen, sind die anderen Attribute keine große Schwierigkeit mehr!
- text: Definiert die Textfarbe. Gleiches System wie Hintergrundfarbe. Achtet nur darauf, daß Text und Hintergrund nicht gleich sind (Schwarz auf Schwarz wirkt zwar existentialistisch, sieht man aber im Allgemeinen schlecht!)
- link: steht für die Farbe der Verknüpfungen bevor sie angelickt wurden, vlink (visited links) für schon besuchte Links.
Gut, daß war alles, was man über das grundsätzliche Erstellen einer stinknormalen HTML Datei wissen muß.
Tip: Am meisten lernt man immer noch, wenn man sich den HTML-Code von anderen Seiten anschaut. Dies könnt ihr bei Netscape mittels 'View - Pagesource' (bzw. ab Version 4 rechte Maustaste drücken und 'view page / frame source').
Genauso beim MS Internet Explorer mit 'View - Source' bzw. rechter Maustaste.
Bist Du noch da??
Wenn ja, dann gehen wir jetzt zu Schritt 2 und bechäftigen uns mit den wichtigsten Befehlen, um eine Seite auch mit Inhalten füllen zu können.