Tabs

Retningslinjer

Tabs består av TabPanel (innholdet), og TabHeader. Plasser dem inntil hverandre, så sammenhengen kommer tydelig fram.

Det viktigste innholdet bør være i tab-en lengst til venstre.
Bruk korte navn på tab-ene for å sikre at flest mulig er synlige til enhver tid.

Innhold som er veldig viktig bør ikke plasseres i tabs.

Varianter

Tabs kan implementeres på to ulike måter: NavTabs som er lenker, eller Tabs som er knapper.

Dersom du ønsker å bruke Tabs øverst på en side, for å kontrollere nærmest hele skjermbildet er det mest sannsynlig lenkevarianten som er riktig.

NavTabs

Fordeler

Kan lenkes til direkte
Beholder den valgte fanen gjennom økta på en forutsigbar måte

Ulemper

Krever implementering av navigasjon
Kan gjøre at venstre tab ikke lenger er den første som vises, dersom brukeren har bokmerket siden med en annen tab åpen

For å unngå at brukeren må vente lenge på at innholdet laster ved navigering kan det være en god ide å prefetche innholdet før de navigerer.

Tabs

Fordeler

Krever ikke implementering av navigasjon

Ulemper

Kan ikke lenkes til direkte
For å beholde den aktive tab-en mellom sesjoner må du mellomlagre staten i nettleseren

Tabs som knapp eller SegmentedControl?

SegmentedControl kan oppleves som overlappende med Tabs. Den største forskjellen er brukerforventningen knyttet til komponentene. SegmentedControl veksler mellom tilstander av innhold, mens Tabs veksler mellom faktisk innhold. Det er altså ingen forventning til at innholdet i én tab og en annen er direkte relatert.

Relaterte komponenter

Segmented Control