GUI Design SWT - SW-Ergo - SW-QM
Map, Textlinks s.u.
Web Style Guide

Guidelines für Web Design

Mit zum Erfolg eines Web-Angebots gehört dessen sw-ergonomische Gestaltung. Ein übersichtliches Angebot, in dem man sich gut zurechtfindet, entscheidet darüber, ob der Kunde zurückkommt oder nicht.

Damit unterscheiden sich die Anforderungen grundsätzlich nicht vom herkömmlichen Design von Benutzungsoberflächen. Es liegt also nahe, auf Erfahrungen im GUI Design zurückzugreifen.

Die DIN-EN-ISO 9241, Teil 10 beschreibt die folgenden Grundsätze der

Wie diese Grundsätze in gutes Web-Design umgesetzt werden können, soll exemplarisch anhand folgender Richtlinien und Beispiele erläutert werden. Auf der linken Seite der Tabelle jeweils der Auszug aus der DIN-EN-ISO 9241, Teil 10, rechts dazu jeweils meine Erfahrungen und Hinweise.

Selbstbeschreibungsfähigkeit

 

Der Benutzer sollte über Änderungen des Zustands des Dialogsystems, die für die Arbeitsaufgabe von Bedeutung sind, informiert werden.

Übersicht

Der Benutzer kann die Aktualität der Information anhand des Datums der letzten Änderung ersehen:

  • passiv durch Datum auf jeder Seite
  • aktiv durch Angebot eines Informationsdienstes (Benutzer kann sich per Mail über Änderungen informieren lassen)

Steuerbarkeit

 

Die Geschwindigkeit des Dialogs sollte nicht vom Dialogsystem vorgeschrieben werden. Sie sollte immer unter Kontrolle des Benutzers stehen [...]

Umfangreiche Grafiken nur dort verwenden, wo sie wirklich notwendig sind. Die Geschwindigkeit des Seitenaufbaus ist maßgeblich von der Größe der zu übertragenden Grafiken abhängig. Ist das Laden einer Seite sehr zeitintensiv, sollte der Benutzer geeignet informiert werden.
Beispiel für gut gestaltete Seiten, die ohne Grafik auskommen:

Weitere Tips zu Grafiken

[...] Das Dialogsystem sollte dem Benutzer Kontrolle darüber geben, wie der Dialog fortgesetzt werden soll.

Übersicht

"Wo bin ich und wie komm ich wieder weg?"
Diese Fragen sollten beim Surfen durch das Web-Angebot jederzeit beantwortet werden können. Hilfreich ist es, wenn jederzeit folgende Navigationshilfen zur Verfügung stehen:

  • Rücksprungmöglichkeit nach "Home"
  • Inhaltsverzeichnis
  • weitere Sprunghilfen wie "vor", "zurück" bei sequentiell angeordneter Information (z.B. mehrseitige Fragebögen).

Erwartungskonformität

 

Dialogverhalten und Informationsdarstellung sollten innerhalb eines Dialogsystems einheitlich sein.

Konsistenz bei der Gestaltung der Seiten ermöglicht dem Benutzer einfaches Navigieren sowie eine gute Orientierung und wird ereicht durch:

  • einheitliches Seitendesign
  • einheitlich gestaltete Navigationshilfen
  • Navigationshilfen, die sich immer an der gleichen Stelle auf einet Seite befinden
  • das Logo/der Name, die sich auf jeder Seite und an der gleichen Position befinden

Änderungen des Dialogzustands sollten auf einheitliche Weise herbeigeführt werden.

Übersicht

Zustandsänderungen werden u.a. durch Anwahl von Links verursacht. Beim Hin- und Herblättern zwischen den Seiten gibt die Farbe eines Links Auskunft darüber, ob dieser schon besucht wurde oder nicht. Diese Standardeinstellung sollte nicht verändert und nicht für andere Texte verwendet werden.

Die URL eines Verweises wird standardmäßig in der Statuszeile angezeigt und sollte daher nicht überschrieben werden.

Fehlertoleranz

 

Das Dialogsystem sollte verhindern, daß irgendeine Benutzereingabe zu undefinierten Systemzuständen oder zu Systemabbrüchen führen kann.

Übersicht

"Unsupported Links" vermeiden!

  • regelmäßiges Testen aller Links oder
  • Automatisches Überwachen von Links

"Beliebter Fehler": Links auf die eigene Platte! Hat man kein Tool zum Überprüfen: unbedingt von einem anderen Rechner das Angebot testen.

Jede Menge Links zum Prüfen von HTML und Links

siehe auch Tips zu Grafiken

Individualisierbarkeit

 

Das Dialogsystem sollte dem Benutzer die Möglichkeit bieten, zwischen alternativen Formen der Darstellung nach individuellen Vorlieben oder der Komplexität der zu verarbeitenden Informationen zu wählen.

Übersicht

Durch automatische Ausrichtung läßt sich der Inhalt flexibel an verschiedene Bildschirmgrößen anpassen. Viele Seiten werden aber bisher leider nur für eine Monitorgröße entwickelt!

Die Darstellung sollte unabhängig von der Zahl der Farben und auch in schwarz-weiß gut lesbar sein. Achtung: hier gibt es oft Probleme mit der Hintergrundfarbe, die bei geringerer Farbauflösung meist zu dunkel ausfällt (Testen!).
Das Angebot sollte mit verschiedenen Browsern und Offline-Readern gelesen werden können (Testen!).

 

Weitere links zum Thema Web-Design unter Ausgewähltes weltweit.

Statistische Daten, wie z.B. Monitorgrößen unter Statistiken zur Webnutzung.

Gold HTML Goldene Regeln für schlechtes HTML von Stefan Karzauninkat:
Diese Abhandlung soll allen als Leitfaden zur Seite stehen, die sich um schlechte HTML - Gestaltung verdient machen wollen. Er sei zur Mahnung gedacht all denen, die den rechten Weg noch nicht gefunden haben.

Seitenanfang

Letzte Änderung am

2000© GUI Design – Offenbachstr.18 – 70195 Stuttgart – Astrid_Beck@gui-design.de
(Fon) 0711/695832 – (Fax) 0711/695847