HTML und CSS

Die Hypertext Markup Language (HTML) liefert in Kombination mit Cascading StyleSheets (CSS) Seiten, die alle Browser ordentlich anzeigen. HTML ist dabei der Inhalt der Seite, das Aussehen der Seite steuert die CSS. Auch wenn zahlreiche Web-Editoren optisch arbeiten, erfordern Seiten häufig manuelles „Feintuning“ in den HTML- und CSS-Anweisungen.

HTML und CSS sind Beschreibungssprachen, keine Programmiersprachen. Jedoch kann HTML andere Dateien und Programme einbetten und dadurch Web-Programme ermöglichen. Im Zusammenspiel mit Java beispielsweise sind interaktive Applikationen möglich.

CSS ermöglicht umfangreiche Gestaltungen, die sich dem jeweiligen Medium (Ausdruck, Computermonitor, Mobilgerät) anpassen können. Das W3-Konsortium definiert den HTML- und CSS-Standard, sodass alle Browser theoretisch die gleichen Anweisungen auf gleiche Weise verarbeiten. Mit der anstehenden Version 3 von CSS halten mehr interaktive Elemente Einzug in die Webseitengestaltung.

Das Zusammenspiel funktioniert recht einfach, der Aufwand besteht darin, dass man bei der Planung die gegenseitigen Abhängigkeiten berücksichtigen muss. Ein einfaches Drauflos-Basteln ist nicht möglich.

  • In der CSS-Datei wird die Gestaltung von Elementen definiert.
    • Blöcke, die dann andere Elemente enthalten werden, können Anweisungen zur Platzierung auf der Seite und zur Gestaltung enthalten.
    • Für jedes Element (Text, Überschriften, Bild, Link) können die Standard-Einstellungen angepasst oder weitere definiert werden (z.B. für Lesetext, für Text in der Navigation und für Einleitungstexte).
  • Die HTML-Datei enthält im Head-Bereich einen Verweis auf die CSS-Datei, diese wird dann bei der Darstellung der HTML-Seite berücksichtigt.
    • Sogenannte Div-Bereiche enthalten die Zuweisungen der Blöcke (aus der CSS) und werden gemäß den Anweisungen platziert.
    • Die weiteren Elemente werden ebenfalls gemäß den CSS-Anweisungen eingebunden, oft können sie als Class-Element einfach zugewiesen werden (<p class="text">Blabla</p> statt <p>Blabla</p>).

Zu berücksichtigen ist das Wort „Cascading“ in den Style Sheets. Dies bewirkt, dass die letzte getroffene Einstellung gilt. Habe ich fünf verschiedene Text-Klassen definiert, und enthält die erste Anweisungen für einen Rahmen, so kann es passieren, dass auch die anderen Klassen mit Rahmen angezeigt werden. Eigenschaften werden wie in einer Kaskade weitergereicht, bis sie aufgehoben werden.

Das W3-Konsortium bietet auch einen Online-Check für HTML- und CSS-Code an. Das Bestehen des Testes sagt nichts über die Qualität oder Praxistauglichkeit aus, sondern bestätigt lediglich, dass diese Dateien korrekte Anweisungen und Parameter enthalten. Mitunter ist es aber nötig, „falsche“ Parameter zu setzen, um ein bestimmtes Ergebnis zu erzielen.