Webseiten mit Webstandards

"Die Entscheidung: CSS-basiertes Layout"

Eine Website muss einwandfrei funktionieren, damit Sie mit ihr erfolgreich sein können. Damit Ihre Website systemunabhängig und suchmaschinenfreundlich ist, müssen aktuelle Webstandards berücksichtigt werden. Standards sind deshalb so wichtig, weil die Nutzer Ihrer Website unterschiedliche Betriebssysteme (wie z.B. von Apple oder Microsoft) und Browser (wie z.B. Internet Explorer oder Firefox in verschiedenen Versionen) benutzen. Außerdem ist auf unterschiedliche Monitorauflösungen zu achten, auf Barrierefreiheit sowie auf neue Empfangsgeräte, wie z.B. Handys.

Die Standards für Architektur und Protokolle des WWW (u.a. HTML) entwickelt das World Wide Web Consortium (W3C).

HyperText Markup Language (HTML) und andere Auszeichnungs- und Formatierungssprachen mit der Websites beschrieben und gestaltet sind, werden leider von Betriebssystemen und Browsern unterschiedlich "verstanden".

Sie wollen aber, dass auf Ihrer Website einfach alles klappt. Sie wünschen, dass Ihre Website gut für Suchmaschinen lesbar ist, dass sich Ihre Website schnell aufbaut. Sie brauchen die Eindeutigkeit von Links und Unabhängigkeit von browserseitigen Scripts und Sie wollen Sicherheitsstandards für Ihre Nutzer einhalten.

Die Entscheidung für CSS-basiertes Layout ist gleichzeitig die Entscheidung für Accessibility und Usability sowie Flexibilität.

Cascading Style Sheets (CSS) trennt das Layout von den Inhalten der Site (wie Navigation, Texte, Bilder). Das Layout wird über ausgelagerte CSS-Dateien gesteuert. Änderungen sind deshalb einfach. Die Trennung von Inhalt und Gestaltung folgt den modernen Richtlinien für eine barrierefreie Website. CSS macht Ihre Website für ein breites Spektrum von Geräten zugänglicher. Durch eine zentrale CSS-Datei wird zudem weniger Quellcode geschrieben. Weniger Code bedeutet Vereinfachung, weniger Fehlerquellen, größere Kontrolle und leichtere Auffindbarkeit. Das sind klare Vorteile gegenüber der Verwendung von Tabellen zum Layouten. Ein optimierter Code sorgt darüber hinaus für Ersparnis der beanspruchten Bandbreite und kürzere Ladezeiten, von denen letztendlich sämtliche Nutzer profitieren.

HTML und CSS haben klar getrennte Aufgaben: "HTML ist der Maurer, CSS ist der Dekorateur". (Nach Peter Müller "little boxes", Band 01, S.9)

Eine der wichtigsten Grundlagen beim Gestalten mit CSS ist das Box-Modell. Ein XHTML-Dokument setzt sich aus mehreren unsichtbaren Boxen zusammen. Es soll hier erwähnt werden, weil es dem weiteren Verständnis für den Aufbau einer Website dient.

Eine schematische Darstellung einer solchen Box finden Sie bei Peter Müller auf little-boxes.de.

"Webseiten bestehen aus rechteckigen Kästchen, die übereinander, nebeneinander und ineinander gestapelt werden." (Peter Müller "little boxes", Band 01, S.9) Jeder Text und jede Grafik liegt in einem unsichtbaren Kästchen, auf Englisch in einer "box". Diese Boxen sind die Grundbausteine von Webseiten und sind nach einem gleichen Schema aufgebaut.

Lesetipp: "little boxes" von Peter Müller
Lesetipp: "Einführung in XHTML, CSS und Webdesign" von Michael Jendryschik

Bevor Sie sich weiter informieren, werden Sie die Frage stellen, warum Sie sich überhaupt mit technischen Details befassen sollten.

Mit diesen Informaionen möchte ich Ihnen die Entscheidung leicht machen, zugunsten einer schlanken, bandbreitensparenden Website auf JavaScript, Flash-Animationen, eingebettete Filme, Spiele und dgl. zu verzichten. Das heißt jedoch nicht, dass auf ästhetische Gesichtspunkte bei der Gestaltung verzichtet werden muss.

Lesen Sie dazu weiter auf der Seite Über diese Site / 5k

Auf der Seite Realisieren werden weitere technische Aufgaben und Möglichkeiten besprochen.

Wenn die Inhalte für eine Website ausgewählt und strukturiert sind, Entscheidungen für das technische Layout gefallen sind, kann nun das Design in Angriff genommen werden.