Und jetzt?...

Um was geht es auf unserer Seite?

Unsere Seite dreht sich voll und ganz um einen gewissen Herrn Rainer Hasse-Seitenbacher. Dieser Herr stellt sich auf seiner Website www.hasse-seitenbacher.de allen interessierten vor. Auch bei Eurem zukünftigen Projekt ist es sehr wichtig sich vorher Gedanken zum Inhalt der Seite zu machen. Der Informationswert der Seite ist das wichtigste überhaupt. Oder schaut Ihr Euch Webseiten an, nur weil sie hübsch gemacht sind? Und falls doch, haltet Ihr Euch bestimmt nicht sonderlich lange darauf auf.
Wir öffnen also wie bereits gelernt die Datei index.html mit dem Text-Editor und schreiben erst Mal ohne uns um das Design der Seite zu kümmern folgenden Inhalt hinein:

Quellcode:

Willkommen auf meiner Homepage!

Wer bin ich?

Ich bin der erste und einzige Sohn von Rainer und Renate Hasse-Seitenbacher.
Am 29.09.1967 wurde ich in Much bei Siegburg mit einer Zange auf die Welt befördert. Mein Vater Rainer war damals gefragter Rosinen-Verkoster, was uns jede Menge Wohnortwechsel während meiner Kindheit einbrachte. Nach vielen Umzügen quer durch Europa verschlug es uns schließlich wieder zurück an den Ort meiner Geburt.

Schulbildung

Meine Mutter kümmerte sich um den Haushalt und meine Ausbildung. Als durchaus fähiger Schüler bestand ich schließlich nach 15 Jahren Heimunterricht, am 10.05.1989 das Abitur in der heimischen Küche.

Studium

Trotz anfänglicher Schwierigkeiten gelang mir, als einzigem Anwärter, im Oktober 1992 die Aufnahme an der Fachhochschule Much. Der Studiengang "Bachelor of Rosin-Science" (ehem. Diplom-Rosinologe) beansprucht seit dem den größten Teil meiner Zeit. Durch die enge und effiziente Zusammenarbeit mit meinem Vater Prof. Dr. Hasse-Seitenbacher wird es mir aller voraussicht nach innerhalb der nächsten 3-4 Semster gelingen den Abschluss Bachelor of Rosin Science zu erreichen.

Hobbies

Inspiriert von meinem Professor interessiere ich mich auch in meiner knapp bemessenen Freizeit für alles was mit Rosinen zu tun hat. Währen der letzten Jahre verlagerte sich der Schwerpunkt auf Frühstückszerialien und Müsli. Meine private Sammlung zählt mittlerweile zu den Umfangreichsten Müsli-Archiven Europas.

Ausserdem interessiere ich mich für:

Downhillbungee
Drachenversteigerungen und
Briefmarken-Weitwurf in der 55ct-Klasse

Mein Motto

Für jede Lösung gibt es auch ein Problem

Speichert die Datei so ab indem Ihr auf "Datei" und dann auf "Speichern" klickt. Nun öffnet die Index.html mit dem Internet Explorer. (Habt Ihr die index.html bereits als Favoriten gespeichert?)

Beim Webdesign gilt der Grundsatz "Inhalt kommt vor Layout". Schreibt zunächst den kompletten Inhalt Eurer Website hin, Strukturiert im Textesditor den Inhalt in sinnvolle Absätze und kümmert Euch dann erst um das Aussehen der Seite!

Was jetzt kommt, dürfte auch bei Euch etwa so aussehen.
Was ist denn da bloß passiert?Der Text, den wir gerade noch mit der "Enter"-Taste in inhaltlich sinnvolle Absätze unterteilt haben, ist einfach nur Wort für Wort von links oben nach rechts unten "hingeklatscht". Ihr erinnert Euch sicher noch daran, daß ich erzählte Euer Browser liest den in der Webseiteitendatei entahltenen Code aus und baut die Seite nach dieser Anleitung zusammen? Hat er hier auch bloß gemacht.

Der Browser hat alle im Dokument enthaltenen Informationen ausgelesen. Er hat dabei nur reinen Fließtext vorgefunden - keine weiteren Formatierungsvorschriften. Und er hat das Beste daraus gemacht. Da er außer dem Text keine Informationen zur Verfügung hat, stellt er ihn gemäß seinen Grundeinstellungen zur Darstellung eines Tesxtes dar.

Er nutzt dabei die volle Breite des gerade geöffneten Browserfensters aus. Wenn Ihr Euch die selbe Deite z.B. mit dem Mozilla Firefox anschaut, werdet ihr wahrscheinlich feststellen, dass die Darstellung etwas von der im Internet Explorer abweicht. Dieser Browser hat eben etwas andere "Vorstellungen" davon wie so ein Text dargestellt werden muss.

Und genau hier fangen unsere "Probleme" an. Nicht nur, dass sie Seite an sich schon sehr langweilig aussieht, von verschiedenen Browsern unterschiedlich dargestellt wird, sie entspricht auch noch keiner der gültigen Normen des W3C. Also machen wir uns am besten umgehend an die

Formatierung der Inhalte

Möchte man in HTML Inhalte formatieren, packt man diese in so genannte "TAGS". Um diese dreht sich alles bei der HTML-Formatierung. Möchte man also eine bestimmte Textpassage fett darstellen, umschließt man diese Passage mit den -Tags. Hier direkt ein Beispiel:

Quellcode:

Dies ist ein fett geschriebenes Wort.

Browservorschau:

Dies ist ein fett geschriebenes Wort.

Die Tags umschließen ein Inhalts-Element. (in diesem Beispiel Text). Sie haben also ein öffnendes Tag (hier ) und ein Schließendes Tag (hier ). Wie Ihr seht hat das schließende Tag immer ein "Slash vor der Elements-Bezeichnung.

Quellcode:

Die Formatierungsanweisungen eines Elements werden so lange angewendet, bis das entsprechende schließende Tag vorkommt.

Browservorschau:

Die Formatierungsanweisungen eines Elements werden so lange angewendet, bis das entsprechende schließende Tag vorkommt.

Es gibt natürlich nicht nur Tags, die die Schrift fett aussehen lassen, sondern auch eine Vielzahl anderer. Experimentiert einfach Mal ein Bisschen herum:

Quellcode:

Hier ein paar Beispiele: Ein oder mehrere Worte kann man fett darstellen. Es geht aber auch kursiv oder auch beides, wenn man möchte Unterstrichener Text geht ebenfalls. Vergesst niemals das schließende Tag!.

Browservorschau:

Hier ein paar Beispiele: Ein oder mehrere Worte kann man fett darstellen. Es geht aber auch kursiv oder auch beides, wenn man möchte Unterstrichener Text geht ebenfalls. Vergesst niemals das schließende Tag!.

<<< zurück II weiter >>>