3. Januar 2011

Tabs, tabs, Tabs

Image: javascriptly.com

Ach, das ist doch ein herrlicher, kleiner Artikel: Designing Tab Navigation the Right Way. Ich bin immer wieder erstaunt, wie viele Leute Tabs "falsch" machen - sprich: irgendwie die Kombination aus Tab und Tab-Inhalt verhunzen.

Color con­trast plays an impor­tant role in design aes­thet­ics. But for tab nav­i­ga­tion, color con­trast plays an impor­tant role in design usabil­ity. Tab nav­i­ga­tion is a metaphor­i­cal way users can nav­i­gate through con­tent. Because a tab nav­i­ga­tion func­tions and behaves like tabs, it should also look and feel like real tabs. When your tab nav­i­ga­tion looks and feels like real tabs, your users will be able to effort­lessly point out which tab is show­ing con­tent and which tabs are hid­ing con­tent. The key to achiev­ing this effect is color contrast.

Damit Tabs die Kartei-Reiter Metapher auch korrekt transportieren können, müssen sie eine bestimmte Gestalt haben. Vor allem auf die Kombination Tab-Farbe und Tab-Content Hintergrundfarbe kommt es an. Ebenso darauf, ob nicht ausgewählte Hintergrundtabs mehr hervorstechen als das eigentlich aktive Tab. Und so weiter ...

Guter Beitrag, der einen Blick lohnt.