Separatori di categoria nel menu: linee, spazio bianco o blocchi di colore?

Un meze house da 26 tavoli a Cesme separava le categorie con sottili linee grigie. Sostituendole con 24 pixel di spazio bianco, il tempo sulla pagina e cresciuto del 22 per cento e lo scroll e diventato piu fluido. La scelta del separatore pesa sui ricavi.

Tre tipi di separatore e la loro psicologia

La linea sembra minimale ma il cervello la legge come barriera e produce una micro-pausa. Lo spazio bianco aiuta la lettura e raggruppa per prossimita. Il blocco di colore e il segnale piu forte e va usato con parsimonia.

Material Design 3 riserva le linee a tabelle dense; per i menu, lo standard dovrebbe essere 16-32 px di spazio bianco.

Quale separatore per quale categoria?

Con una sola cucina basta lo spazio bianco. Con piu cucine o piu livelli aiutano i blocchi di colore — massimo tre tonalita.

• Spazio 24-32 px: tra item della stessa categoria.
• Linea 1 px opacita 0.1: per sottogruppi.
• Blocco di colore: solo per categorie principali.

Dati A/B e pattern di scroll

Il test di quattro settimane ha mostrato 18 per cento di profondita di scroll in piu con lo spazio bianco; la durata media e passata da 52 a 64 secondi, con un +9 per cento sugli add-to-cart.

Un cafe a Karakoy ha ridotto il bounce del 14 per cento con blocchi di colore tematici discreti. Con misura, il blocco rende.

FAQ

Posso combinarli tutti? Si, con gerarchia: blocco in alto, spazio al centro, linea al livello piu profondo.

In dark mode? Mantieni l opacita della linea tra 0.08 e 0.12.

E l accessibilita? Contrasto WCAG AA 4.5:1 e un segnale non cromatico aggiuntivo.

Ti è stato utile? Condividilo.