Webseiten und Usability

Usability steht für die Ergonomie bzw. Alltagstauglichkeit / Bedienerfreundlichkeit einer Homepage, Anwendung oder Software.

Die sogenannten "Gestaltgesetze der Wahrnehmung", die sich wie viele weitere Gestaltpsychologierichtungen aus der Arbeit des Philosophen Christian von Ehrenfels von 1890 ableiten, spielen dabei eine große Rolle. Diese Gesetze dürften vielen noch aus dem Kunstunterricht ein Begriff sein. Dieser Artikel beinhaltet diese und noch ein paar hinzugefügte unverzichtbare Regeln für den Bau einer Homepage.

Das Wahrnehmungsgesetz der Nähe

Dinge, die räumlich nahe beieinander liegen, werden von unserer Wahrnehmung gruppiert, also als zusammengehörig erkannt. Dinge, die weit entfernt von einander liegen, werden als getrennt und unabhängig voneinander wahrgenommen.

Beim Layout ist es sehr wichtig, dieses Gesetz zu beachten, "Verstöße" dagegen können eine verheerende Wirkung haben. Dies betrifft Texte und Grafiken gleichermaßen wie Buttons und Links.

Das Gesetz der Ähnlichkeit

Dinge, die sich ähnlich sind, werden von unserer Wahrnehmung als zusammengehörig angesehen. Umgekehrt werden Dinge, die sich voneinander entscheiden, als voneinander getrennt wahrgenommen. Dabei kann es sich um Ähnlichkeiten bei der Größe, Farbe, Schriftart, Helligkeit, Geschwindigkeit oder Bewegung handeln.

Gestaltet man die Elemente einer Website ähnlich, werden sie schnell in Zusammenhang miteinander gebracht, auch wenn sie weit voneinander entfernt platziert sind.

Das Gesetz der Geschlossenheit

Elemente, die unter gleichen Bedingungen  gruppiert  sind, werden zuerst als geschlossene Einheit betrachtet. Fehlende Informationen ergänzt das menschliche Gehirn durch gesammelte Erfahrungswerte . In der Gestaltung werden komplexe Designs mit Hilfe dieses Gesetzes vereinfacht.

Das Gesetz der Prägnanz

Unter gleichen Objekten einer Gruppe erfasst das menschliche Gehirn jenes Objekt, welches sich durch ein bestimmtes Merkmal von den anderen Objekten abhebt. Bei der Gestaltung einer Seite kann mit Hilfe dieses Gesetzes das Auge des Users bewusst auf ein bestimmtes Objekt gelenkt werden (z. B. Störer)

Das Gesetz der guten Fortsetzung

Wir setzen Dinge nach räumlicher und zeitlicher Einfachheit, Gesetzmäßigkeit und Harmonie fort. Dabei stellen wir uns sogar Fortsetzungen vor, wo in Wirklichkeit gar keine sind. Kreuzen sich zwei Linien, sehen wir eine Linie immer als eine durchgehende, die nach der bisherigen Linienrichtung in eine Richtung verläuft. Wir setzen sie fort. Deshalb wird auch sehr oft vom "Gesetz der fortgesetzt durchgehenden Linie" gesprochen. Befinden sich mehrere Elemente auf einer Linie, nehmen wir sie als zusammengehörig wahr.

Das Gesetz der Symmetrie

Wir nehmen Elemente, die ohne erkennbare Struktur angeordnet wurden, wesentlich schlechter wahr, als solche, die einander symmetrisch zugeordnet wurden. Objekte auf einer Homepage sollten also nach Möglichkeit als symmetrische Form abgebildet, bzw. in einer solchen angeordnet werden.

Das Gesetz der Erfahrung

Das menschliche Gehirn versucht bei der Betrachtung von Objekten ständig bereits erkannte Objekte, Bilder und Eindrücke abzurufen und darzustellen. Deshalb sind wir dazu in der Lage, fehlende Bildteile zu ersetzen und angedeutet dargestellte Bilder komplett zu erkennen.

Im Webdesign kann dieses Gesetz bei der Gestaltung von Bildern und Logos genutzt werden. Dadurch kann die Spannung deutlich gesteigert werden.

Schrift

Die verwendeten Schriften sollten klar, gut erkennbar und nicht zu klein gewählt werden. Wichtig ist auch, nicht zu viele Schriften zu mischen. Erlaubt sind zwei unterschiedliche Schriftarten, natürlich sollten auch nur bestimmte Schriftarten zum Einsatz kommen. Der Kontrast zwischen Schrift und Hintergrund sollte ausreichend sein.

Text

Der Text sollte passend formatiert sein, Blocksatz ist für das Internet nicht geeignet. Die Sätze sollten kurz und knackig formuliert sein, im Idealfall höchstens ein Komma enthalte und schnell auf den Punkt kommen.

Links

Links sollten sich vom Rest des Textes abheben, sie sollten klar als solche erkennbar sein.

Suche

Jede Homepage sollte eine vernünftige, gut funktionierende, auf einen Blick zu erkennende Suchfunktion beinhalten.

Feedback

Der User sollte über alles, das während der Zeit, die er auf einer Seite verbringt informiert werden ("Sie werden weitergeleitet.", "Sollten Sie nicht weitergeleitet werden, …", "Sie erhalten von uns umgehende eine E-Mail als Bestätigung.").

Sound

Soundeinspielungen sind auf einer Homepage nicht nur tunlichst zu vermeiden, sondern verboten. Sie lenken den User vom Wesentlichen ab, können sogar störend wirken und die Verweildauer wesentlich verkürzen.

Formulare

Bei durch den User auszufüllenden Formularen sollte man sich auf jeden Fall auf das Wesentliche beschränken. Felder, für die eine Ausfüllpflicht besteht, sollten durch ein Sternchen gekennzeichnet sein, um dem User ein erneutes Ausfüllen zu ersparen. Außerdem sollte das Weiterspringen von Feld zu Feld mit der Tab-Taste möglich sein. Sollte es zu Fehleingaben kommen, sollte der User durch sinnvolle Fehlermeldungen informiert werden. Nach dem Ausfüllen eines Formulars sollte der User auf jeden Fall die Möglichkeit einer Bestätigung über die Formularinhalte per E-Mail haben.

Navigation

Größenanpassung

Das Layout einer Seite sollte sich der Größe des Browserfensters des Users anpassen. Daher auf jeden Fall vor dem Onlinestellen für verschiedene Bildschirmgrößen und Browserarten testen. Im Idealfall sollte die Seite natürlich auch für mobile Geräte wie Tablets oder Mobiltelefone optimiert sein.

Bilder

(Produkt-) Bilder sollten durch Anklicken vergrößerbar sein.

Kontrolle

Viel Spaß beim Basteln!

Vielen Dank an Fabian Ziegler, Dipl.-Designer (FH) von Webmasterpro für die Grafiken!