Webdesign-Standards

Beim Webdesign bedeutet Standardkonformität, dass sich die Seiten einer Website, die mit einem Browser betrachtet werden sollen, an die Standards des W3C (World Wide Web Consortium) hält.

Die Mehrheit der auf dem Markt befindlichen Browser versteht diese Standards und stellt sie korrekt dar. Für den Betreiber einer Website/Homepage hat also die Einhaltung der Webdesign-Standards den Vorteil, dass seine Seiten einem großen Besucherkreis zugänglich sind. Wird im Gegensatz dazu eine Seite nur für einen bestimmten Browser geschrieben (browseroptimiert), ist die Wahrscheinlichkeit hoch, dass Teile des Inhaltes Besuchern, die einen anderen Browser verwenden, der diese browserspezifischen Angaben nicht versteht, unzugänglich bleiben. Im besten Fall zeigt dieser Browser dann den größten Teil der Seite mit einigen kleineren "Schönheitsfehlern" (verrutschte Textrahmen, schlecht anklickbare Links etc.) an. Im schlimmsten Fall jedoch ist die gesamte Seite unleserlich und damit für den Benutzer unbrauchbar. Was wiederum auf Dauer zu verärgerten Kunden führen kann, die sich gar nicht erst mehr die Mühe machen, auf einer Homepage vorbei zuschauen.

Außerdem kann es bei browseroptimierten Seiten auch passieren, dass diese plötzlich auf einer neueren Version des entsprechenden Browsers, nicht mehr funktionieren. Grund: diese speziellen "Features" des Browsers können in einer neueren Version jederzeit entfallen, oft zugunsten der Standardkonformität. Ein Problem, dass bei Einhaltung der Webdesign-Standards nicht auftritt. Denn in jeder standardkonformen Webseite befindet sich die Angabe des verwendeten Standards und seiner Version. Dadurch kann sich der Browser die zur korrekten Umsetzung des Dokumentinhaltes benötigten Regeln dynamisch über das WWW laden. Die Seiten bleiben also in dem verwendeten Standard immer valide sprich gültig,

Standardkonformes Webdesign ist auch ein wesentlicher Aspekt bei der Suchmaschinenoptimierung (SEO). Schließlich sind Suchmaschinen (wie z.B. Google™) nichts anderes als "Roboter", die, im Gegensatz zu einem Menschen, nicht dazu in der Lage sind Seitenstrukturen und Informationen aus dem Kontext oder aus Bildern, Audioaufnahmen usw. zu erschließen. Eine standardkonforme Homepage hilf ihnen dabei. In den Richtlinien mancher Suchmaschinen wird sogar explizit darauf hingewiesen, dass Sites, die sich nicht an Standards halten, im Ranking (Positionierung innerhalb der Suchergebnisse) abgestraft werden.

Ein weiterer großer Vorteil der Einhaltung der Webdesign-Standards ist die Vorhersehbarkeit des Aussehens der Seiten auf Browsern, die ihrerseits den Standard unterstützten (alle neuen, sowie viele ältere Browser). Ausgenommen sind einige Einstellungen wie Schrifttyp, Linkfarben etc., die vom Benutzer bei vielen Browsern selbst festgelegt werden können und so die Angaben der Seite überschreiben. Hinzu kommen kleinere Freiheiten, die der Standard den Browserherstellern bei der Umsetzung in einigen Punkten lässt, wie z.B. ob eine Überschrift kursiv oder nicht-kursiv ist. Diese kleinen "Unzulänglichkeiten" dienen aber u.a. der Barrierefreiheit und Benutzerfreundlichkeit.

Ferner verringert Standardkonformität die Kosten beim Webdesign und bei der Verwaltung, da nicht verschiedene Versionen der Website (angepasst auf die unterschiedlichen Browser) erstellt, vorgehalten und evtl. später aktualisiert werden müssen.

zum Seitenanfang 

Geschichtliches

Seit seiner Entstehung im Jahre 1989 hat sich das WWW (World Wide Web) rasant entwickelt.

Seine Grundlage bilden HTML-Dokumente. Der damalige HTML-Standard konnte jedoch noch nicht allzu viel und die Browserhersteller wollten nicht bis zur Fertigstellung des nächsten Standards warten, sondern entwickelten ihre eigenen Versionen von HTML. Ihr Beweggrund dabei war, diejenigen, die damals mit dem Entwickeln von Webseiten zu experimentieren begannen, an sich zu binden und so den Markt zu erobern. Ein professionelles Webdesign im heutigen Sinne existierte noch nicht. Viele, die damit anfingen eine Homepage zu erstellen, waren wild auf alles Neue. Zum Teil, um einfach alle Möglichkeiten auszunutzen, die sich ihnen boten. Zum Teil, um zeigen zu können, was sie alles "drauf haben".
Dies führte dazu, dass jeder Browser HTML anders darstellte: manche konnten dies, andere das, aber dafür jenes nicht...

Noch größer wurde das Chaos als zusätzlich zu HTML noch CSS (Cascading Style Sheets) entwickelt wurde. CSS dient zur näheren Formatierung der mit HTML strukturierten Dokumentinhalte und wird ebenso wie HTML vom W3C (World Wide Web) betreut. Auch hier blühten die Eigenentwicklungen für eine Vielzahl nicht miteinander kompatibler Browser. Das Ergebnis des ganzen: HTML-Seiten die auf manchen Browsern gar nicht oder nur teilweise darstellbar sind - maximal mit dem freundlichen Hinweis: "Optimiert für ...", so oder so ähnlich.

Inzwischen hatte sich ein Berufszweig herausgebildet, der sich nach den anfänglichen Spielereien mit "ernsthaftem" Webdesign beschäftige. Hier wurden die Probleme, die das ganze Chaos verursachte immer mehr sichtbar. Es hagelte massive Proteste von einem Großteil der Webdesigner, die von den Browserherstellern verlangten, dass diese sich wieder an die Standards des W3C halten, um überflüssige Zeit bei der Erstellung von Websites und damit verbundene Kosten zu vermeiden und HTML-Dokumente schreiben zu können, deren Darstellung auf den unterschiedlichen Browsern einheitlich sind. Angeführt wurde diese Bewegung vom Web Standards Project, dass das W3C bei der Weiterentwicklung und Umsetzung seiner Standards unterstützte.

zum Seitenanfang 

Was ist das W3C?

W3C ist die Abkürzung für World Wide Web Consortium, dem Gremium für Webdesign-Standards.

Ziel des Konsortiums ist es, einheitliche technische Grundlagen und Standards für das World Wide Web (WWW) zu schaffen und dessen Weiterentwicklung zu fördern. Durch diese Standards soll erreicht werden, dass Informationen, die über das World Wide Web zur Verfügung gestellt werden, auf jedem Browser problemlos abgerufen und angezeigt werden können. Zu diesen Standards gehören u.a.:

  • PNG - Dateiformat für Grafiken
  • WCAG - Richtlinien zur Gestaltung eines barrierefreien Angebots
und das wohl bekannteste
  • HTML - Sprache für Webseiten

Gegründet wurde das W3C am Massachusetts Institute of Technology 1994 von Tim Berners-Lee (siehe Was ist HTML) mit Unterstützung der Defense Advanced Research Projects Agency (DARPA), den Entwicklern des ARPANET, aus dem das heutige Internet hervorgegangen ist, und der Europäischen Kommission. Das Konsortium setzt sich zusammen aus Firmen, gemeinnützigen Organisationen, Universitäten und Regierungsorganisationen.

zum Seitenanfang 

Was ist HTML?

HTML (Hypertext Markup Language) ist eine Sprache zur Erstellung von HTML-Dokumenten: also Seiten einer Website, die von einem Browser angezeigt werden können, so wie diese hier. Es ist die bedeutendste Sprache beim Webdesign.

HTML beschreibt die semantische (logische) Darstellung der anzuzeigenden Seiteninhalte, dh. deren Bedeutung innerhalb der Seite: Überschrift, einfacher Absatz, tabellarische Daten, Zitat, Bild usw. Angaben zur gesamten Seite, z.B. Papierformat, Seitenränder, sind mit HTML nicht möglich. Zusätzlich dazu wurden in den ersten Versionen von HTML Sprach-Elemente mit aufgenommen, mit denen auch das Aussehen der Daten beeinflusst werden kann, so z.B. für die zu verwendende Schriftart und -farbe. Dies geschah, da es zu dem damaligen Zeitpunkt keine andere Möglichkeit gab, entsprechende Formatierungen in einem HTML-Dokument vorzunehmen, die Anwender aber danach verlangten. In der aktuellen Version 5 sind diese Elemente zugunsten von CSS wieder entfallen, um eine klare Trennung zwischen der Strukturierung und der Formatierung in den Seiten einer Website zu erhalten. Einen Übergang stellen hier die Varianten Transitional und Strict der noch weit verbreiteten Vorgängerversion 4 dar. In Strict fehlen diese Elemente bereits während sie in Transitional noch enthalten sind.

Neben der reinen Anzeige von Daten können in einem HTML-Dokument seit HTML 4.0 auch andere Medien in eine Seite eingebunden werden, z.B. Audio-Dateien, Filmsequenzen. Diese Medien können bis einschließlich HTML 4.01 von den Browsern nur angezeigt werden, wenn diese ein entsprechendes Plugin - zusätzliche Software, die am Browser "eingestöpselt" (engl. pluged-in) wird - für diesen Medientyp installiert haben. Seit Version 5 gibt es einige Formate, die auch vom Browser ohne die Verwendung von Plugins abgespielt werden können, sofern dieser die neuen Elemente bereits unterstützt.

Entwickelt wurde HTML 1989 von Tim Berners-Lee und wird seit 1994 vom von Tim Berners-Lee gegründeten World Wide Web Consortium (W3C) weiterentwickelt und standardisiert.

Aktuelle Fassung ist HTML5.

zum Seitenanfang 

Was ist XHTML?

XHTML (Extensible Hypertext Markup Language) ist ebenso wie HTML eine Sprache zur Erstellung von Dokumenten, die von einem Browser angezeigt werden können.

XHTML 1.0 wurde 2000 vom W3C (World Wide Web) als Alternative zu HTML 4.01 entwickelt, da dieses als zu "verunreinigt" galt (siehe Was ist HTML). In der Folge sollte die Weiterentwicklung von HTML zugunsten von XHTML eingestellt werden. Aufgrund heftiger Proteste von Webdesignern wurde stattdessen die Weiterentwicklung von XHTML zugunsten der neuen HTML5 Version eingestellt.

Bisher enthält XHTML im Vergleich zu HTML keine Neuerungen, was die Darstellungsmöglichkeiten angeht und spielt im Vergleich zu HTML beim Webdesign eine eher untergeordnete Rolle. Primärer Unterschied sind die strengeren Regeln der Sprache. Das bedeutet, ein HTML 4.01 Dokument lässt sich 1:1 in ein XHTML 1.0 Dokument umsetzen. Ferner fallen in der neuesten Version (XHTML 1.1) Formatierungsangaben, die in HTML vorhanden sind (z.B. zur Ausgabe von fett gedrucktem Text), weg und können nur noch mit Hilfe von CSS umgesetzt werden.

Hauptsächlicher Vorteil von XHTML gegenüber HTML für das Webdesign ist, dass in einem XHTML-Dokument Abschnitte, die in Sprachen verfasst sind, die von der gleichen Ursprungssprache wie XHTML abstammen, direkt eingebettet werden können. So z.B. MathML, welches zur Darstellung mathematisch/naturwissenschaftlicher Formeln dient. Zur Anzeige dieser Abschnitte muss der Browser allerdings über entsprechende Plugins verfügen.

Nachteilig für das Webdesign ist, dass nur die wenige der neueren Browser-Versionen XHTML verstehen und anzeigen können. Einige Browser interpretieren XHTML-Dokumente meist einfach als HTML-Dokumente, was in der Darstellung keine größeren Unterschiede macht. Andere können XHTML-Dokumente gar nicht anzeigen. Stattdessen erscheint im Browserfenster der XHTML-Quellcode.

Aktuelle Fassung ist XHTML 1.1. Die Weiterentwicklung wurde eingestellt.

zum Seitenanfang 

Was ist CSS?

CSS (Cascading Style Sheets) ist eine Sprache, die das Aussehen und die optische Darstellung der Inhalte in einem Dokument beschreibt - ein wesentlicher Aspekt beim Webdesign.

Die Seiten einer Website selbst werden nicht in CSS geschrieben, sondern meist in HTML. CSS wird dann ergänzend zu der eigentlichen Dokumentsprache verwendet. So bietet CSS bei der Homepage-Erstellung die Möglichkeit die Farbe eines Textes oder eines einzelnen Wortes zu bestimmen, Textabschnitte zu positionieren, Hintergrundbilder in Tabellen zu setzen, Abstände zu Rahmen oder anderen Textbereichen zu bestimmen etc.
Alle diese Angaben können zentral und für mehrere Seiten einer Website oder auch für mehrere Abschnitte, Überschriften usw. eingetragen werden. Dies stellt einen erheblichen Vorteil beim Webdesign und für den Betreiber einer Website dar:

  • gleiche Elemente auf verschiedenen Seiten innerhalb einer Website werden gleich dargestellt
  • Änderungen, die mehrere Seitenelemente betreffen, müssen nur an einer Stelle vorgenommen werden
  • die Zeit und damit die Kosten beim Webdesign bzw. bei einer späteren Überarbeitung verringern sich

Zusätzlich kann man mit CSS die Darstellung abhängig vom verwendeten Ausgabemedium auf Benutzerseite (Bildschirm, Drucker, Braille-Gerät usw.) gestalten ohne das Dokument neu schreiben zu müssen.

Der Vorläufer von CSS (CHSS) wurde 1994 von Håkon Wium Lie entwickelt. In späterer Zusammenarbeit mit Bert Bos entstand daraus CSS. 1996 wurde dies vom W3C (World Wide Web) als Standard aufgenommen und veröffentlicht. Seitdem hat seine Bedeutung beim Webdesign aufgrund der o.g. Gründe immer weiter zugenommen und wird heute bei vielen Websites angewendet.

Seit einigen Jahren wird bereits an der nächsten Version CSS 3 gearbeitet. Dieses wird nicht mehr aus einer einzigen riesigen Spezifikation bestehen, sondern ist modular aufgebaut, so dass einzelne Technikmodule unabhängig von den anderen weiterentwickelt werden können. Einige dieser Module haben bereits den Status einer "Recommendation", was bedeutet, dass diese schon soweit ausgearbeitet wurden, dass eine Verwendung bereits vom W3C empfohlen wird.

Aktuelle Fassung ist CSS 2.1.

zum Seitenanfang 

Was ist JavaScript?

JavaScript ist eine sog. Skriptsprache, bei der der JavaScript-Quellcode zusammen mit der angeforderten Webseite an den Browser gesendet und erst dann auf dem Rechner des Seitenbesuchers bei Bedarf ausgeführt wird. Im Gegensatz hierzu wird z.B. PHP, eine andere Skriptsprache, vorab auf dem Server ausgeführt und das Ergebnis wird als Webseite, z.B. in HTML an den Browser übertragen. Der Browser bekommt also gar nicht mit, dass ein PHP-Code ausgeführt wurde. Mit Hilfe von JavaScript können verschiedene Browsereinstellungen, wie Fenstergrösse, beeinflusst werden. Ausserdem kann man - und das ist das eigentliche Anwendungsgebiet beim Webdesign - einer Webseite interaktive Elemente hinzufügen. Eine Möglichkeit die z.B. bei PHP nicht besteht, da hier, wie oben beschrieben, eine fertige und somit statische Seite an den Browser gesendet wird. Ein nachträgliches verändern der angezeigten Seite, also eine Interaktion, durch den Benutzer ist daher nicht möglich.

Mit JavaScript kann man z.B. Formulareingaben vor dem Absenden des Forumlars überprüfen, Rollover-Mauseffekte erzeugen (z.B. um zusätzliche Informationen einzublenden) oder Inhaltsverzeichnisse dynamisch anpassen (Beispiel: Drop-Down-Menü). Aber auch kleinere Applikationen, wie Umrechner oder Kalender, als Teil einer Webseite lassen sich mit JavaScript erstellen.

Wichtig bei der Verwendung von JavaScript ist es, die Webseite so zu gestalten, dass sie auch bei durch den Benutzer abgeschaltetem bzw. fehlendem JavaScript in ihrem wesentlichen Inhalt voll funktionstüchtig bleibt. Ein Drop-Down-Menü, dessen Unterpunkte ohne JavaScript nicht zugänglich sind, ist nicht barrierefrei. Denn weder die Besucher noch die Suchdienste finden so die Seiten aus den Untermenüs und das nutzt weder dem Anwender noch dem Seitenbetreiber. Gleiches gilt für Anwendungen, bei denen mittels JavaScript das Browserfenster auf eine bestimmte, vom Designer gewünschte, Grösse geändert wird. Ist der Anzeigebereich des Monitors des Benutzers wesentlich grösser kann der Browserinhalt möglicherweise nicht mehr gelesen werden, weil zu klein. Ist der Anzeigebereich jedoch kleiner, als die durch den Designer eingestellte Browsergrösse kann der Benutzer die nicht mehr sichtbaren Bereiche der Webseite oder den Navigationsbereich des Browsers bestenfalls noch durch hin- und herscrollen erreichen, schlimmstenfalls aber überhaupt nicht mehr. Mal ganz abgesehen von der Verärgerung des Besuchers einer Homepage, wenn sich die von ihm eingestellte und bevorzugte Fenstergrösse ohne jede Vorwarnung plötzlich verändert.
Dieses und anderer "Missbrauch" (öffnen ungebetener Popups usw.) von JavaScript haben zu seinem zwischenzeitlich schlechten Ruf geführt. Weswegen einige Anwender auch heute noch JavaScript in ihrem Browser deaktivieren, was man bei der Homepage-Erstellung berücksichtigen sollte.

JavaScript wurde ursprünglich von Netscape entwickelt und 1995 erstmals mit dem Netscape Navigator 2.0 veröffentlicht. 1997 entwickelt Netscape zusammen mit der ECMA daraus den Standard ECMA-262 (genannt ECMAScript). Die ECMA ist eine internationale Organisation zur Normung von Informations- und Kommunikationssystemen und Unterhaltungselektronik. Dieser Standard wird 1998 zur ISO-Norm ISO/IEC 16262:1998 Information technology - ECMAScript language specification.

Aktuelle Fassung ist JavaScript 1.8.5 / ECMA-262 5th edition.