Inhalt

Design im Web 2.0

Dieser Bereich stellt typische Design-Merkmale des Web 2.0 vor. Darüber hinaus wird beschrieben, wie das Design einer Webseite die Zugänglichkeit beeinflussen kann.

Design im Web 2.0

Geschichte des Designs im Internet

Sieht man von der frühesten Verwendung des Internets einmal ab (ausschließlich Information ohne jede gestalterischen Elemente), ist das Internet seit jeher primär optisch orientiert. Web-Entwickler hatten frühzeitig das Bedürfnis, ihre HTML-Seiten individuell zu gestalten. Diesen Forderungen folgte das W3C durch eine Erweiterung der Sprachelemente von HTML um Elemente wie "font" oder "align". Da diese Elemente keine Trennung zwischen der Struktur und der Gestaltung von Inhalten ermöglichen, wurden sie mit der Verabschiedung von HTML 4.01 als "deprecated" bezeichnet und in HTML (strict) komplett aus dem Sprachumfang entfernt. Stattdessen werden heute auf CSS basierende Design-Elemente verwendet.

Typische Design-Elemente im Web 2.0

Fast alle Portale des Web 2.0 orientieren sich in ihrem Design an ähnlichen Farbstilen. Man trifft sehr häufig auf "freundliche", frische und helle Pastell-Farbtöne. Die meisten Portale sind daher allein an ihrer Farbgebung bereits gut erkennbar.

Wet Floor Beispiel mit Wob11-Schriftzug Klassische weitere gestalterische Elemente sind abgerundete Ecken, Farbverläufe in Grafiken, Logos und Bannern und Spiegelungen von Grafiken ("Wet Floor" in englischer Sprache Online-Editor).

Auf technischer Ebene werden dazu Cascading Stylesheets (CSS) für das Design in Kombination mit HTML für die Struktur der Inhalte genutzt. Für manche Design-Effekte, wie z.B. Cover Flow (in englischer Sprache Javascript-Lösung), kommen zusätzlich die Scriptsprache Javascript oder Flash zum Einsatz.

Barrieren durch Web 2.0-Design

Die größten durch Design verursachte Probleme haben Menschen mit Sehbehinderung. Besonders der Einsatz nur schwach kontrastierender Farben ist für sie problematisch, da sie Inhalte (Text, Bilder) nicht vom Hintergrund unterscheiden können. Web-Entwickler sollten daher auf ausreichend hohe Kontraste zwischen den verschiedenen eingesetzten Farben achten.

Badge mit Wob11-Schriftzug Neben mangelnden Kontrasten können auch eine zu kleine Schrift und kleine Formularelemente Barrieren für Sehbehinderte und motorisch eingeschränkte Menschen darstellen. Entwickler sollten darauf achten, relative Schriftgrößen zu verwenden, damit die Anwender, die Schriftgrößen ihren individuellen Bedürfnissen anpassen können. Für viele blinde und sehbehinderte Surfer ist es ärgerlich, wenn Schriftgrafiken verwendet werden. Typisch für Web2.0-Seiten sind Ribbons (in englischer Sprache Ribbon-Editor) und Badges (in englischer Sprache Badge-Editor), grafische Elemente, die primär als Blickfänger auf Seiten fungieren. Oftmals weisen sie aber auch auf Aktualisierungen hin oder transportieren andere Informationen. Damit diese Informationen auch für Besucher, die die Seite nicht visuell sondern z.B. mit einem Screenreader wahrnehmen, zugänglich sind, sollten Entwickler bedenken, einen Alternativtext anzubieten.

Ausblick

Die oben aufgeführten Hinweise stellen Designer im Web 2.0 vor eine Herausforderung: Einerseits sollen sie den gestalterischen Entwicklungen des Web 2.0 Rechnung tragen, andererseits werden sie u.U. in ihren Möglichkeiten z.B. Farben miteinander zu kombinieren eingeschränkt.

Ein barrierefreies und gleichzeitig "Web 2.0-typisches" Design besitzt jedoch auch zwei entscheidende Vorteile: Wie bei allen barrierefrei zugänglichen Web-Diensten gilt auch hier, dass sich durch eine barrierefrei gestaltete Webseite die Anzahl potenzieller Nutzer steigern lässt (benutzbar mit Hilfsmitteln, auf portablen Geräten wie Smartphones etc.).

Darüber hinaus lässt ein barrierefreies Web2-0-Design auch das Know-How des Designers erkennen á la "Das kann nicht jeder!". Im hart umkämpften Markt des Webdesigns ist dies ein nicht zu vernachlässigendes Element, wenn es darum geht, neue Kunden zu gewinnen.