#PrzemoPatterns: Tab
1 min czytania

#PrzemoPatterns: Tab

#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

Je艣li jeszcze nie ma Ci臋 na li艣cie 馃

Wysy艂amy jeden email tygodniowo, w ka偶dy pi膮tek, o godz. 12:00.
Warto艣ciowa wiedza o UI/UX dla developera mo偶e wyl膮dowa膰 do Twojej skrzynki.