Kategoriskillere i menyen: linjer, hvitt rom eller fargeblokker?

Et meze hus med 26 bord i tyrkiske Cesme skilte de digitale menykategoriene med tynne graa linjer. Etter at de byttet dem ut med 24 piksler hvitt rom, okte tid paa side med 22 prosent og scrolloppforselen ble merkbart roligere. Skillerens valg paavirker gjennomsnittsregningen direkte.

Tre skillertyper og psykologien

Linjer ser minimalistiske ut men hjernen leser dem som barriere, og det utloser en mikropause. Hvitt rom gir pust og grupperer via Gestalt-nearhet. Fargeblokk er sterkeste signal og maa brukes sparsomt.

Material Design 3 reserverer linjer for tette datatabeller; i menyer boer 16 til 32 piksler hvitt rom vaere standard.

Hvilken skiller for hvilken kategori?

Med ett kjokken holder hvitt rom. Med flere kjokken eller hierarki hjelper fargeblokker — maks tre toner.

• Hvitt rom 24-32 px: mellom retter i samme kategori.
• Haarlinje 1 px opasitet 0.1: for undergrupper.
• Fargeblokk: bare for hovedkategorier.

A/B-data og scrollmonstre

Den fire uker lange A/B-testen viste 18 prosent mer scrolldybde paa hvitt-rom-varianten; sesjonstid 52 -> 64 sekunder, add-to-cart opp 9 prosent.

En cafe i Karakoy senket bounce med 14 prosent med diskrete tematiske fargeblokker.

FAQ

Kan jeg blande alle tre? Ja, med hierarki: blokk overst, hvitt rom i midten, linje paa dypeste niva.

Og dark mode? Hold linje-opasitet i 0.08-0.12.

Og tilgjengelighet? WCAG AA 4.5:1 kontrast og en ikke-farge-hint i tillegg.

Var dette nyttig? Del det.