Eine Einführung in HTML und CSS

Hypertext Markup Language (HTML)

HTML wurde 1989 von Programmierern des Forschungslabors CERN in der Schweiz entwickelt, eine Computersprache die von sogenannten Browsern interpretiert (übersetzt) wird. HTML steht für Hypertext Markup Language (sinngemäß übersetz: Hypertext-Auszeichnungssprache oder Hypertext Markierungssprache). HTML gilt als eher leichte Programmiersprache, die nicht nur ausgebildeten Informatikern zugänglich ist. Sie besteht aus einer recht überschaubaren Anzahl von Befehlen und Eigenschaften, den sogenannten „Tags“, deren Aufbau immer gleich ist. Ein HTML-Tag besteht immer aus einem zugewiesenem Namen und falls notwendig, weiteren Bestimmungsparametern. Sie dienen in erster Linie nicht dazu das Aussehen der Seite zu gestalten, sondern ihren strukturellen Aufbau zu beschreiben. Allerdings können mit zusätzlichen Parametern grundlegende Formatierungen, zum Beispiel bei Texten die Schriftart, -größe und -farbe, direkt zugewiesen werden. Ein kompletter Tag beginnt immer mit dem sogenannten Start-Tag „“ und endet mit dem Ende-Tag „“. Zwischen Start- und Ende-Tag befinden sich die zur Darstellung gewünschten Informationen, wie z.B. ein Text. Aber natürlich können über HTML-Seiten nicht nur Texte kommuniziert werden. Tabellen, Grafiken, Bilder, Ton- und Video-Sequenzen können dem Besucher ebenso zur Verfügung gestellt werden.

Der grundlegende Aufbau einer HTML Seite beginnt immer mit dem HTML-Tag „. Er besagt das es sich bei dem Folgenden Dokument um eine HTML-Seite handelt. Danach folgt der sogenannte „Kopfteil“ der Seite, der mit dem Tag „“ deklariert wird. In diesem Kopfteil befinden sich rein Administrative Informationen wie der Titel der HTML-Seite, Schlüsselwörter nach denen Suchmaschinen das Dokument indizieren sollen oder Informationen zum Autor der Seite. Abgeschlossen wird dieser Kopfteil mit dem zugehörigen Ende-Tag „
Nun kommt der Hauptteil der Seite, in den alle Informationen kommen, die kommuniziert werden möchten. Dieser startet mit dem Tag „“ und endet wie gewohnt mit dem „“. In diesen Hauptteil kommen nun beispielweise Texte, Tabellen, Bilder, deren Strukturierung wieder eigene Tags zugewiesen sind.
Nicht zu vergessen ist das Dokument ganz am Ende mit dem Ende-Tag „“ zu schließen.

Cascading Style Sheets (CSS)

CSS ist eine direkte Ergänzung zu HTML, mit der sich die Formateigenschaften bestimmter HTML-Befehle genauer definieren lassen. Dies ist mit HTML-Befehlen und ihrem Parametern nur sehr eingeschränkt möglich.
Mit Style-Sheets kann man beispielweise Texten eine ganz bestimmte Schriftgröße oder Schriftfarbe zuweisen. Dies lässt sich dann auch gerne auch noch Absatzweise unterscheiden. So kann man festlegen das die Schrift im ersten Absatz eine Größe von 12 Pixeln und die Farbe blau haben soll und im zweiten Absatz eine Größe von 11 Pixeln und die Farbe grün.
Die gewünschten Stil-Definitionen können im oben angesprochenen Kopfteil der HTML Seite angegeben werden und gelten damit für die gesamte Seite. Dies spart eine Menge Arbeit und schafft mehr Struktur und Übersicht.

Der größte Vorteil von CSS ist wohl aber die „externe bzw. zentrale Stylesheet-Datei“, eine css-Dokument in dem alle gewünschten Formatzuweisen genau angegeben sind und die ganz einfach im Kopfteil jeder HTML-Seite eingebunden werden kann. So gelten die hier deklarierten Formateigenschaften nicht nur seitenweise, sondern Projektweit. Man kann sich vorstellen welchen Vorteil dies bei einem Projekt schafft, welches weit mehr als zehn HTML-Seiten einschließt und dem man über eine zentrale Stylesheet-Datei ein komplettes, einheitliches Design zuweisen kann.

Comments are closed.