Definition & Grundlagen | Warum Usability? | GUI & Anpassung ans Web | Web-Design | Testen & Ausblick | Links & Quellen
Web Design

Aus der Anpassung der Richtlinien für grafische Benutzeroberflächen an die Bedürfnisse des Internets ergeben sich also folgende Designgrundlagen:

Ausrichtung auf den Nutzer
Das Design der Seite muß sich nach dem Nutzer richten, denn der Nutzer wird sich nicht nach dem Design richten. Dabei kann das Design je nach Zielgruppe unterschiedlich ausfallen. Wer eine große internationale Kundenbasis hat, sollte entsprechende in Landessprache verfaßte Seiten anbieten. Entsprechend der Zielgruppe unterschiedlich gestaltete Seiten haben zum Beispiel die ARD (www.ard.de) mit einem recht nüchternen Layout und dezenten Farben oder RTL (www.rtlworld.de) mit vielen Farben und Animationen. Ein gutes Beispiel für eine Seite für internationales Publikum ist FORIX (Formula One Results and Information Explorer, www.forix.com).

Plattformunabhängigkeit
Wie gesagt wird zur Anzeige der Webseiten die unterschiedlichste Hard- & Software genutzt. Entsprechend unabhängig muß das Design sein. Nichts ist ärgerlicher, als auf eine Seite zu kommen, auf der steht "Zur Anzeige brauchen sie Software XYZ". Normalerweise kann man auf solche Software verzichten und massenkompatibler zu bleiben. Ein Beispiel für eine solche Seite wäre die Seite der Beatles (www.beatles.com/top.html), die Flash erfordert, nur um einen Eingangsbildschirm anzuzeigen, und die aber auch sonst unter Usability-Gesichtspunkten schlecht abschneidet (Farbwahl, Navigation). Falls die Flash-Seite nicht korrekt angezeigt wird, gibt es auch eine Seite ohne Flash (www.beatles.com/html/index.html)

Inhalt vor Design
In erster Linie sucht der Nutzer im Internet Informationen. Diese will er möglichst schnell auf dem Bildschirm präsentiert haben. Darum ist ein schönes buntes Design sekundär, wenn der Inhalt nicht dem gesuchten entspricht, wird sich der Nutzer auch das Design nicht anschauen. Eine Ausnahme bilden natürlich die Seiten, bei denen es um bestimmte Designfragen oder Plug-Ins oder ähnliches geht. Ein gewisses Maß an Designelementen ist in jedem Fall unabdingbar, sonst enden die Seiten als reine Textwüsten, die sich der Nutzer genausowenig anschauen wird. Eine gesunde Mischung ist also anzustreben.

Erwartungen erfüllen & Verwendung von Metaphern
Unter diesen Punkt fällt einheitliches Design, das den Nutzer nicht verwirrt, denn mit Besuch einer Seite und dem Design der ersten Seite hat der Nutzer bestimmte Erwartungen an das Aussehen der weiteren Seiten, die er über die Links erreichen kann. Entsprechend sollten die Links auch aussagekräftig sein und dem Nutzer sagen, was ihn auf der Seite erwartet, ein einfaches "Click Here" ist also völlig verkehrt. Gleiches gilt für die Verwendung von Metaphern: Wenn sie allgemein bekannt sind, ist es ein gutes Mittel die Navigation zu erleichtern, ansonsten ist Vorsicht geboten. Als allgemein bekannt voraussetzen kann man zum Beispiel den Warenkorb, den es in fast allen Webshops gibt, oder das Fragezeichen als Link zur Hilfe. Ähnliches gilt für Pfeile nach links und rechts zu den vorhergehenden und nachfolgenden Seiten. Auf der Seite von WOM (www.wom.de) werden Metaphern verwendet, allerdings sind die beiden Icons mit den Kopfhörern und der Videokamera nicht eindeutig. Man könnte darunter eine Möglichkeit verstehen, in bestimmte Artikel probeweise hineinzuhören bzw. zu sehen, tatsächlich ist es eine Art Radio- & Videoclip-Programm.

Transparenz der Vorgänge
Man kann davon ausgehen, daß die Nutzer nicht länger als 10 Sekunden auf den Aufbau einer Seite warten, darum sollte alles, was länger dauert, mit einem Fortschrittsbalken gekennzeichnet werden, der anzeigt, wie weit der Download ist, so daß der Nutzer sieht, das etwas passiert. Selbstverständlich muß die Anzeige dann auch so gestaltet sein, daß der Nutzer erkennt, was eigentlich abläuft. Langes Warten ohne irgendeine Rückmeldung an den Nutzer wird dazu führen, daß die Nutzer den Download abbrechen, ohne die Seite jemals gesehen zu haben.

Beispiel für Mystery Meat Navigation Funktionierende Navigation
Die Navigation im Internet ist zugleich seine Stärke und seine Schwäche. Die Stärke liegt in der freien Verknüpfung zahlreicher Seiten über Links, die Schwäche besteht darin, daß diese Links in vielen Fällen zum totalen Chaos führen, weil der Nutzer nicht mehr erkennt, wo er ist oder wohin er gehen kann. Aus diesem Grund ist genau darauf zu achten, daß die Navigation innerhalb der einzelnen Seiten einer Website konsistent ist, also an einer festen Stelle auf der Seite (meist oben oder am linken Rand), und dem Nutzer verdeutlicht, wo er ist und wohin er gehen kann. Entsprechende Sorgfalt ist daher bei der Bezeichnung der Links notwendig, ebenso ist darauf zu achten, daß bereits besuchte Links farblich markiert sind. In diesem Zusammenhang ist die Verwendung von Grafiken als Links besonders problematisch, da hier eine farbliche Markierung nicht möglich ist.
Eine besonders schlechte Form der Navigation ist die sogenannte "Mystery Meat Navigation". In diesem Fall muß man erst mit der Maus über die einzelnen Elemente fahren, um zu sehen, was sich darunter verbirgt. Ein entsprechendes Beispiel sieht man hier mit dem Straßenschild: Erst wenn man mit der Maus darüberfährt, erkennt man, was drauf steht. Im Straßenverkehr würde das heißen, man erkennt das Schild erst, wenn man dran vorbeigefahren ist, was natürlich zu spät ist.

Definition & Grundlagen | Warum Usability? | GUI & Anpassung ans Web | Web-Design | Testen & Ausblick | Links & Quellen
Letzte Änderung 05.06.2001
Uwe Domaratius (Uwe.Domaratius@s2000.tu-chemnitz.de)