Webdesign - Webseiten planen, gestalten - Free-Hack Library

Interfacedesign
dass ihr Erscheinungsbild durch kaskadierende Einrückungen und
vorangestellte Navigationsgrafiken nicht zu unruhig wirkt.
Falls dies nicht schon im Interaktionsdesign geprüft wurde, ist
an dieser Stelle darauf zu achten, dass die bekannte 7 (+/- 2)
Anzahl der Navigationsbegriffe einer Ebene nicht überschritten
wird. Sollte das dennoch der Fall sein, prüfen Sie, ob Sie sinnvolle
Obergruppen bilden oder einzelne Navigationsbegriffe doch auf
eine untergeordnete Ebene verlagern können.
Grundsätzlich ist bei Navigationsmenüs zu unterscheiden zwischen
solchen, die als HTML-Text mit CSS-Formatierung erstellt werden,
solchen die eine Kombination aus Text und Naviagtionsgrafik
bilden und solchen, denen ausschließlich Grafiken (Bildtypografie
und Icons) zugrunde liegen (Abb. 6.7.5c).
Bildtypografie bietet bekanntlich eine größere Varietät der gestalterischen
Möglichkeiten, ist jedoch unter dem Aspekt der
Barrierefreiheit schlechter geeignet. Auch mit CSS lassen sich
viele gut aussehende Navigationsmenüs gestalten, einschließlich
interessanter Ausführungen für Mouseovers bzw. Anzeigen anderer
Aktivierungszustände.
Achten Sie beim Design unterschiedlicher Aktivierungszustände
darauf, dass die optische Veränderung deutlich und eindeutig ist,
andererseits aber nicht zu viel Unruhe in die Navigation bringt.
Veränderungen von Regular- zu Bold-Schriftschnitten und Schriftgrößenveränderungen
bewirken ein Springen der Schrift und
überschreiten dadurch manchmal den dafür vorgesehenen Platz
im Navigationsbereich. Unterstreichungen beim Mouseover sind
zwar hochkonventionell, aber auch langweilig und erschweren
bei geringem Zeilenabstand die Lesbarkeit. Besser geeignet sind
deutliche Farbveränderungen, Hinterlegungen, Farbwechsel von
Hintergründen und/oder das zusätzliche Einblenden von Navigationsgrafiken.
Kästen, Rahmen und Linien können über CSS definiert
werden, sonst sind Bildsymbole einzufügen (Abb. 6.7.5d).
Unter dem Aspekt des barrierefreien Webdesigns ist eine Farbänderung
allein nicht ausreichend. Es muss ein weiteres Unterscheidungsmerkmal
wie eine Unterstreichung oder eine zusätzlich
erscheinende Navigationsgrafik vorgesehen werden.
DESIGNENTWURF 6
Abb. 6.7.5c: Navigationsgrafiken aus einfachen
geometrischen Formen
Abb. 6.7.5d: Navigationsgrafiken zur Anzeige
eines Aktivierungszustandes
(http://www.ldi.nrw.de, http://.hammer.
informatik.fh-gelsenkirchen.de, http://www.
hebammenhilfe.de)
223