
Mit den sogenannten GUIs (Graphical User Interfaces = Grafische Benutzeroberflächen) sollte der Computer viel einfacher, besser und vor allem intuitiver zu bedienen sein - gegenüber dem guten alten DOS-Prompt. Damit sich alle Anwendungen in Sachen Interface an die gleichen Regeln hielten entwickelten Apple und Microsoft für ihre Betriebssysteme fest Richtlinien für das jeweilige Look & Feel. Schaltflächen müssen so aussehen, Listen wiederum so.
Doch im wilden weiten Web gibt es kaum Regeln, wie eine Website zu bedienen sein soll oder welche Funktionen dem armen Surfer zur Verfügung stehen müssen. Statt fester Regeln setzen sich immer mehr Erfahrungswerte als ‘best practice’ durch. Dazu gehören auch die sogenannten ‘Reiter’ …
Ansich sind die Reiter keine Computererfindung, jeder Aktenschrank oder Ablagesystem kennt die kleinen hervorstehenden Registerreiter, die das Auffinden von Sektionen oder Vorgängen einfacher macht.

Information at your Fingertips … old school …
Natürlich boten sich die Reiter auch zur Unterteilung von Dialogfenstern an. Während Apple hier ursprünglich nur eine Reiterreihe pro Fensterchen erlaubte, ging Microsoft gleich in die Vollen. Hier ein Screenshot von Microsoft Word.

Eine wilde Reiterei versucht die Optionsmania in Zaun zu halten.
Web-Designer kamen eigentlich erst sehr spät auf die Reiterei zurück. Als Standardnavigation verwendeten - und verwenden auch heute noch - viele Sites links- oder rechtsbündige Menüleisten für die erste Navigationsebene (oder auch Primärnavigation). Ein generelles Problem bei der Navigationsgestaltung von komplexen Websites ist die Aufteilung der vielen Navigationsebenen und Funktionen in ein übersichtliches und verständliches Konzept.
Anstatt alle Seiten / Links in ein Godzilla-Menü zu packen, gliedert man die Seiten in Kategorien und Navigationsebenen ein - durch die sich der Benutzer via Maus ‘hangeln’ kann. Generell sollten aber die oberste Ebene - die Primärnavigation oder Primärkategorien - immer zu sehen sein.
Angesichts der Tatsache, daß der Computermonitor proportional immer breiter als hoch ist, macht es natürlich mehr Sinn, die Gesamtbreite für die Navigation auszunutzen - die Primärnavi schwebend über den restlichen Inhalt und Funktionen.
Die erste Mainstream-Website die davon ausführlich Gebrauch machte war Apple.com.

Die Apfelreiter - einer der ersten seiner Art.
Ebenso ein Vorreiter (no pun intended) war Amazon.com. Auch hier werden die wichtigsten Kategorien oben aufgelistet. Die Unterkategorien werden aber hauptsächlich durch Listen am linken Rand ‘erledigt’.

Kaufen! Kaufen! Kaufen!
Inzwischen hat Amazon.com soviele Kategorien, dass nicht mehr alle auf einer normalen Bildschirmbreite aufzureihen wären. Dies zeigt einen der Nachteile der Reiter: je nach Länge der Menünamen lässt sich nur eine mehr oder minder kurze Anzahl an primären Navigationpunkten auf einer Reiterleiste aufreihen. Im Schnitt kommt man über 10 bis 15 Punkte nicht hinaus.

Die neue US-Version - mit dem Pop.
Daher hat sich die amerikanische Site sich zu einer sehr hässlichen und unübersichlichen Popup-Liste für die primären Produktkategorien entschieden. Der Vorteil: mehr Kategorien sind hier möglich. Der Nachteil: man sieht nicht auf einen Blick was es alles gibt - stattdessen muss der Kunde das Menü erst einmal ‘finden’ und klicken. Sowas kann sich nur eine etablierte Site erlauben.

T-Online - nicht nur Magenta ist erlaubt.
Das schöne an Reitern ist auch, dass der Benutzer immer gleich sieht in welcher Kategorie er / sie steckt. Dies wird beim oberen T-Reiter durch die Farbgebung der Sektion unter dem Reiter klar verdeutlicht. Generell ist es sehr verlockend und praktisch Kategoriefarben für die Reiter und die Unternavigation beizubehalten.

Yahoo goes AJAX - dynamische Navigationselemente dank Java.
Yahoo zeigt in seiner neuesten Portalversion sehr schön, wie sich das Reiter-Konzept durch AJAX interaktiv erweitern lässt. Der Benutzer kann seine Suche schon vorab mit den Reitern im oberen Reiterfeld präzisieren. Anstatt eines Seitenrefreshs - wie bei alten Webseiten üblich - ändert sich die Dialogbox interaktiv, wie bei einer normalen Desktop-Applikation. Je nach Suchkategorie ändert sich die Farbgebung des Reiterfeldes wie auch die dazugehörigen Funktionen.
Sie sehen, die Idee der Reiter lässt sich zu sehr praktischen und komplexen Anwendungen ausbauen.
Sie können die Antworten zu diesem Beitrag via folgenden RSS 2.0-Feed verfolgen.
Bitte hinterlassen Sie einen Kommentar oder senden Sie einen Trackback-Ping von Ihrem eigenen Blog.
Ein Kommentar zu 'Hoppe, hoppe, Reiter!'
Apple sei Dank reiten wir heute auch gemütlich durchs Internet. Die einzig wirklich bedeutende Site, die schon vor Apple Reiter im Webdesign einsetzte war Amazon.com. Komischerweise gibts immernoch Leute, die laut Usability-Studien auch heute mit Reitern nichts anzfangen wissen. Nun denn - wer das nicht schnallt, soll erst mal lernen den PC anzumachen
Ihr Kommentar bitte?
Bitte keine Fakes oder Beleidigungen. Danke!