Einführung
Die Navigation ist wohl eines der wichtigsten Elemente einer Website um deren Bedienbarkeit zu gewährleisten. Eine gut strukturierte und klar gestaltete Navigation hilft dem Benutzer sich zu orientieren und gibt ihm im besten Fall die Sicherheit, immer zu wissen wo auf der Website man sich befindet.
Problem
Einen entschiedenden Fehler in der Gestaltung ist bei dem folgenden Beispiel zu sehen. Die Navigation besteht aus Drop-Down Elementen, was bereits eine höhere Komplexität darstellt als eine eindimensionale Liste. Dies stellt jedoch für den Benutzer noch keine Herausforderung dar. Das eigentliche Problem liegt im :hover Status der Hyperlinks. Wenn der Benutzer mit der Maus über den zu-klickenden Link fährt, verschwindet die Schrift und die umfassende Box färbt sich schwarz. Im CSS sehen wir, dass die Schriftfarbe genauso wie die Hintergrundfarbe des Elementes zu schwarz wechseln.
Lösung
Mit dem Weglassen der Zeile color: #000 wäre diese Problem sofort gelöst und die Ratespiel in der Navigation hätte ein Ende.