Z-Mönster Visuell Hierarki: Så Leder du Gästens Blick genom Menyn

En regional restaurang med 30 bord nära Mevlana-helgedomen i Konya ökade sin "se meny → beställ"-funnel med 18% bara genom att justera den digitala menyn till Z-mönstret. Ingen ny teknik — bara hierarki som följer blicken.

Z-Mönster vs F-Mönster

Nielsen Normans eye-tracking-studier identifierar två läsmönster. F-mönster på textrika sidor. Z-mönster på visuella landningar och digitala menyer.

Z-rutt: överst-vänster (hero) → överst-höger (tagline) → diagonal till nederst-vänster (beskrivning) → nederst-höger (CTA "Beställ"). Trigger vid Z:s slut möter ett öga redo för handling.

Implementering i Konya

Fyra Z-ankare på kategorisidan:

1) Överst-vänster: etli ekmek-foto + "Konya-kök". 2) Överst-höger: kategori-chips. 3) Mitten-vänster: 2-meningars arvtext. 4) Nederst-höger: sticky CTA. Tid till beställning sjönk 22 sekunder; konvertering +18%.

Tre Gratis Tester

Kisa-test (fyra block synliga?), 5-sekunders test (vad minns du?), Microsoft Clarity heatmap (följer blicken verkligen Z?). Om diagonalen saknas är kontrast eller storlek i mitten för svag.

FAQ

Fungerar Z-mönster på mobil? Mindre — vertikal scroll dominerar, F-mönster passar bättre. Z är optimalt på surfplatta/dator där hela Z får plats i en viewport.

Vad med RTL-språk som arabiska? Z speglas: börjar överst-höger, slutar nederst-vänster. thMenu tillämpar dir="rtl" automatiskt.

CTA nederst-vänster istället för höger? Nej — det är döda zonen. Klick faller 30–40% eftersom ögat redan har "stängt" Z till höger.

Var detta hjälpsamt? Dela det.