Einführung in HTML Testbericht

VORAB: Da YOPI mich keine benutzen lässt sind alle * ersetzt worden!!

Es begab sich vor vielen Tagen, also vor langer Zeit begab es sich in einem fernen, sehr fernen östlichen, quasi fernöstlichen Land, zur Mittagsstunde im Frühling, zur Zeit als die Kirschblüte ihre volle Pracht entfaltete, dass der Meister mit seinem Schüler spazieren ging.
Doch trotz des schönen Wetters und der vielen Lehre seines Meisters schien der Schüler unglücklich zu sein, oder besser gesagt abwesend...

Meister: „Grüner Frosch, du bist zu mir gekommen um die Kunst lernen...“
Grüner Frosch: „Ja, Sensai (Meister).“
Meister: „Aber muss nicht auch die Raupe lange kriechen und sich ihres Lebens erwähren bevor sie ein Schmetterling wird? Muss nicht auch ein Kind lernen zu gehen bevor es rennen kann? Oder muss nicht das Eichhörnchen lange im voraus seine Nüsse sammeln bevor der Winter kommt?“
Grüner Frosch: „Ja, Sensai.“

So erzählte der Meister seinem Schüler die Geschichte von dem Eichhörnchen und Grashüpfer...

Meister: „... . Deshalb ist es von großer Bedeutung, dass du die grundlegenden Lektionen der Kunst erlernst bevor du fortschreiten kannst. So soll dann auch dein erstes Kapitel des Lernens überschrieben werden mit der Kunst der HyperTextMarkupLanguage.“
Grüner Frosch: „Cool HTML!“
Meister (sichtlich irritiert): „Nun gut, nun lass mich dir die grundlegende Struktur der Kunst erklären...

*html* beginnt das HTML Dokument

*head* Kopfelement
*title* Titel der Seite *title*
*/head*

*body* Rumpfelement
*!--Kommentare werden hier zwischen geschrieben--*
*/body*

*/html*

Dies kannst du ganz einfach in deinen grundlegenden Texteditor schreiben und schon hast du dein erste HTML Seite. Beachte vor allem die Symmetrie der abgeschlossenen Elemente (html - head - title - /title - /head – body - /body - /html).“
Grüner Frosch: „Aber Meister ich kann ja noch gar nichts sehen!“
Meister (kopfschüttelnd): „Oh du Holzsuchender im Wald. Schreibe deinen Text doch einfach in den body-Tag...“
Grüner Frosch: „Meister, was ist ein Tag?“
Meister: „Ein Tag besteht aus einer sich öffnenden eckigen Klammer ‚*’ in der die magischen Worte, die Befehle der Kunst stehen, und einer sich schließenden eckigen Klammer ‚*’. Deinen Hintergrund, die Schrift und die Farbe deiner Links änderst du so...
*
body
bgcolor=“#ffffff“
text=“#000000“
alink=“#000000“
vlink=”#000000”
link=”#000000”
*
Nur zur Erklärung habe ich dieses eine Mal die oberste Regeln unserer Kunst verletzt, denn es steht geschrieben ‚Schreibe einen Tag immer in eine Zeile.’ ... So lerne diese Worte zu verstehen, Grüner Frosch.“

Und Zeit ging in die Welt und es kam der Sommer und auf den Sommer kam der Herbst und der Grüne Frosch lernte...

Grüner Frosch: „Meister, ich habe verstanden. Die Farben werden über eine 6stellige Hexadezimalziffer eingeleitet durch das # Zeichen aktiviert so allen Elementen zu gewiesen. So weißt bgcolor die Hintergrung(BackGround) Farbe(Color) zu, text genau diesem und alink dem aktiven (active) Link, sowie vlink dem besuchten (visited) Link ihre Farbe zu.“

Meister: „Sehr gut, Grüner Frosch. So erkläre mir doch was ist eine Hexadezimalzahl.“
Grüner Frosch: „Eine Hexadezimalzahl ist eine Zahl entsprechend einem 16 Zahlen System, in dem die Zahlen 10, 11, 12, 13, 14, 15 durch die Buchstaben a, b, c, d, e, f dargestellt werden.“

Meister: „Sehr gut, Grüner Frosch. Ich glaube du beist gereift für die zweite Lektion. Wenn du deine wissenswerten Informationen individuell formatieren möchtest benutze den *font* Tag, natürlich abgeschlossen mit */font*. In diesem Tag kannst du folgende wichtige Eigenschaften ansprechen: color, face, size. Hier ein Beispiel *font color=“#00ff00“ face=“Arial“ size=“4“*Mein knallig grüner Arial Text Size 4*/font*. Diese magischen Worte erzeugen einen knallig grünen Arial Text in Schriftgröße 4.“
Grüner Frosch: „Ich verstehe, Meister.“

Und die Blätter fielen von den Bäumen und der Winter brach ein, so dass es viel Zeit zum Schnee schaufeln und für Schneeballschlachten gab – und natürlich fiel Zeit zum Lernen...

Meister: „So will ich dir noch schnell einiges zu den magischen Textelementen verraten mit denen du vorsichtig und verantwortungsvoll herum experimentieren kannst:...“
*b**/b* bold – fett gedruckt
*i**/i* italic – schräg gedruckt
*u**/u* underline - unterstrichen

*strike**/strike* durchgestrichen
*sup**/sup* hochgestellt
*sub**/sub* tiefgestellt

*hr**/hr* horizontal Ruler – horizontale Linie

[Über das style-Tag sind alle bekannten Word Formationen möglich. Eine Empfehlung zum nachlesen erfolgt am Ende dieses Berichtes.]

Meister: „Heute, mein Schüler, will ich dir die macht zu Teil werden lassen wie du mit Verweisen, sogenannten Hyperlinks, verantwortlich um gehst. Dazu ist folgender Tag nötig.“
*a href=“URL“*Hier steht der Verweistext der immer so lustig unterstrichen blau ist. (Standardfall)*/a*
*a href=“mailto: [email protected]“*Mail me!*/a*

[An dieser Stelle sei auf ein Urteil hingewiesen, das besagt mit dem einbinden eines Hyperlinks auf eure Seite verweisend auf eine andere im Netz, seid ihr mitverantwortlich für dessen Inhalt. Es sei denn man distanziert sich von allen Links explizit, z.B. „Hiermit distanziere ich mich von jeglicher inhaltlicher Verantwortung aller gesetzten Links.“]

Grüner Frosch: „Danke Meister, ich weiß diese Ehre zu würdigen und die Verantwortung zu tragen.“
Meister: „Ich weiß, denn vor langer Zeit habe ich dein Herz geschaut und das Gute in dir schlummern sehen. Deshalb soll dir auch das große magische Geheimnis aller Bilder und Laufschriften zu Teil werden, das unsere Schule seid Generationen von Meister auf Schüler weiter gegeben wird.“

*img src="URL/bild.jpg" width=”x” height=”x” border=“x“*

*marquee direction=“right“ scrollamount=“x“ scrolldelay=“x“*Laufschriftinhalt*/marquee*

[Hier repräsentiert x eine Zahl, die die entsprechenden Eigenschaften ändert, um jedoch den großen Rahmen dieses Textes zu sprengen, sei nur darauf hingewiesen.]

Meister: „So Grüner Frosch, nun hast du also deine Studien in den Grundlagen der Kunst abgeschlossen dennoch möchte ich dir ein Buch zum tieferen Studium empfehlen, in diesem wirst du die Weisheiten, die geschrieben und von der weisen Hand unseres großen Lehrers Stefan Münz erklärt wurden, finden. http://www.teamone.de/selfhtml/. Auch will ich dir nicht verschweigen das dein Studium der Kunst gerade erst begonnen hat, den unsere Schule weiß über viele Geheimnisse bescheid. So wird dir noch die JavaScript Lehre zu teil werden und du wirst erfahren was CascadingStyleSheets sind. Auch sei die geheimnisvolle Lehre der DHTML nicht verschmiegen oder gar die mysteriöse Kunst des CGI. Ist es nicht all das was du lernen wolltest? Nun hast du ja den ersten einfachen Schritt hinter dir...“

So verlassen wir hier unseren Lehrer und Denker, den großen Meister, der noch viele Schüler unterrichten sollte...

Konfuzius sagt: Auch der längste Weg beginnt mit einem ersten Schritt.

In diesem Sinne,

MaxTech