Informationen zu meinen HTML Seiten

HTML Standard

Alle diese Seiten entsprechen dem HTML4.1 Standard und der CSS 2.1 Konventionen des World Wide Web Consortium (W3C). Überprüft habe ich die Seiten mit den Browsern

• Mozilla Firefox (Windows, Linux)
• Mozilla Firefox Portable (Windows, USB)
• Safari (Windows, iPhone)
• Konqueror (Linux)
• Microsoft Internet Explorer (Windows)

TAG-Elemente

<FONT>

Wie ich im Internet, u.a. bei SelfHTML.org gelesen habe, gilt der FONT-Tag, so wie wir es in der Schule gelernt haben, seit vielen Jahren als deprecated (abgelehnt vom W3C)
Stattdessen sollen CSS (Cascading StyleSheets) verwendet werden. Diese Formatierungsvorlagen habe ich dann auch im Headerbereich genutzt, was auch zu einer besseren Lesbarkeit des HTML Codes führt. Man spricht auch von der Trennung von Form (CSS) und Inhalt (HTML Body). Das der Font-Tag immer noch funktioniert, liegt Abwärtskompatibilitär der Browser. Ein reiner W3C Browser würde diese Tags ignorieren.

^ nach oben ^

<A HREF>

Die Verlinkungen habe ich mit sogenannten Pseudoklassen versehen, so dass sie sich etwas vom normalen Text abheben. Bsp.

• a.hover - bedeutet, wenn man mit der Maus über den Link geht
• a.focus - wenn man den Link anklickt
• a.visited - zeigt den Zustand einer bereits besuchten Seite u.s.w.

Leider ist der Internetexplorer nicht ganz Standardkonform und interpretiert einige dieser Angaben leider nicht. Aus diesem Grunde habe ich auch den Firefox Mobile auf die CD gebrannt, der sich ohne weitere Installation starten lässt und die Webseiten korrekt anzeigt.

Seiteninterne Verweise setze ich mit dem id-Tag, das sind sogenannte Sprungmarken, die eine leichte Navigation in langen HTML Texten ermöglichen. Das sind die "nach oben" Verweise. Statt einer kompletten HTML Seite gibt man hier nur die Adresse des Anker (dieses id-Tag) an. z.B. man setzt ganz am Anfang seiner Seite ein id="top" und setzt weiter unten im Text dann einen Link <a href="#top">nach oben</a>

^ nach oben ^

<TABLE>

Diese HTML Element brauchte ich, um unsere Messdaten tabellarisch, statt nur einer Grafik, darzustellen. Eine Tabelle besteht aus folgenden logischen Elementen

• table - der gesamte Tabellenkörper sozusagen
• tr - Table Row, also einer Zeile und
• td - Table Data, dem eigentlichen Wert, wobei th zusätzlich als Table Header (Tabellenüberschrift) genutzt werden kann

TH Spalte 1	TH Spalte 2	TH Spalte 3
TD Wert 1 in TR Reihe 1	TD Wert 2 in TR Reihe 1	TD Wert 3 in TR Reihe 1
TD Wert 1 in TR Reihe 2	TD Wert 2 in TR Reihe 2	TD Wert 3 in TR Reihe 2
TD Wert 1 in TR Reihe 3	TD Wert 2 in TR Reihe 3	TD Wert 3 in TR Reihe 3

Bei manuellen Tabellen muss man nur sehr aufpassen, dass die Anzahl der Felder stimmt, sonst kommt es schnell zu unschönen Leerfeldern od. Verschachtelungen. Das table Element wird auch gerne zur Textformatierung missbraucht, wie Menüs, aber man muss auch mal an Menschen mit Sehbehinderunge denken, die finden sich in solchen "Konstrukten" einfach nicht zurecht. Stichwort Barrierefreies Internet (Web Accessibility).

^ nach oben ^

Grafiken

Auf diesen Seiten verwende ich 3 Grafikformate, die im Web üblich sind.

• JPEG (*.jpg) - ein komprimiertes Grafikformat, was seinen Ursprung im Gremium Joint Photographic Experts Group hat
• GIF (*.gif) - ein Format mit guter Verlustfreiheit und Möglichkeit zur Transparenz. Graphics Interchange Format
• PNG (*.png) - ist ein neueres Format und soll das GIF Format ablösen. Das Portable Network Graphics Format beherrscht versch. Farbtiefen und Alphatransparenz. Es verwendet auch verlustfreie Bildkompression.

^ nach oben ^

Transparenz

Um die Lesbarkeit der Textblöcke zu erhöhen, verwende ich eine Grafik mit 1x1px und 50% Farbtransparenz. Leider ist der Internetexplorer auch hier nicht in der Lage das sauber darzustellen.

Einen weiteren Trick verwende ich in der Fusszeile. Um einen pixelgenauen Abstand zwischen zwei Elementen zu erhalten, schiebe ich einfach wieder eine 1x1px kleine GIF-Datei mit 100% Transparenz dazwischen und kann somit prima Abstände erzeugen, wie diese hier |30px>|60px>|120px>|

^ nach oben ^

Mobile Medien

Wenn man sich strikt an den W3C Standard hält und ein wenig an die bereits erwähnte Barrierefreiheit denkt, sind solche Webseiten heutzutage auch auf allen anderen mobilen Medien, wie Blackberry, Handys, iPhone^© u.s.w. gut darstellbar. Hier ein Beweisfoto meiner Webseiten auf einem iPhone^©.