#PrzemoPatterns: Tab

🤔 Co to jest?

Tab (zakładka) to element nawigacyjny, który umożliwia użytkownikom łatwy dostęp do różnych treści na pojedynczej stronie. Taby wizualnie przypominają przegrody z zakładkami w szafce na dokumenty. I jak to tradycyjnie bywa w świecie UX/UI, warto pamiętać o podstawowych zasadach przy użyciu danego elementu.

Nie przeciągam - lecimy z tematem!

ℹ️ Wskazówki

• Użyj tabów, aby przełączać się między widokami w tym samym kontekście, a nie nawigować do różnych obszarów systemu
• Podziel logicznie zawartość między zakładkami, aby użytkownicy mogli łatwo przewidzieć, co znajdą po wybraniu danego taba
• Używaj zakładek tylko wtedy, gdy użytkownicy nie muszą porównywać treści z wielu tabów jednocześnie. W innym przypadku przełączanie się między różnymi tabami obciąży ich pamięć krótkotrwałą oraz obniży przyjemność korzystania z systemu
• Podświetl aktualnie wybraną zakładkę. Upewnij się, że wyróżnienie jest wystarczająco widoczne, aby ludzie mogli stwierdzić, która zakładka jest wybrana
• Pisz krótkie etykiety na tabach i używaj prostego języka. Etykiety zakładek powinny zwykle zawierać 1-2 słowa. Krótkie etykiety są łatwiejsze do zeskanowania; jeśli potrzebujesz dłuższych etykiet to z reguły znak, że labele są zbyt skomplikowane
• Trzymaj się tylko jednego rzędu zakładek. Wiele wierszy tworzy przeskakujące elementy interfejsu użytkownika co burzy pamięć przestrzenną, a tym samym uniemożliwia użytkownikom zapamiętanie, które zakładki już odwiedzili
• Umieść rząd zakładek na górze panelu — nie po bokach ani na dole, gdzie użytkownicy często je przeoczają
• Wszystkie zakładki powinny wyglądać i działać tak samo. Spójność jest ważna w projektowaniu sterowania GUI, ponieważ buduje poczucie panowania użytkownika nad systemem