Menudesign til Mørke Restauranter: 7:1 Kontrastreglen

En whiskeybar med 18 borde i Istanbuls Etiler-kvarter så gæster tænde telefonens lommelygte for at læse menukortet ved levende lys. Løsningen var ikke kraftigere belysning, men at hæve menuens kontrast fra 4.5:1 til 7:1.

WCAG 2.2 AA vs AAA Anbefaling

WCAG 2.2 AA kræver 4.5:1 kontrast for brødtekst, men er valideret ved 200-500 lux kontorbelysning. Aftenrestauranter ligger på 20-50 lux.

For aftenlokaler start fra AAA-niveau 7:1. Rent hvid på rent sort giver 21:1, men skaber haloer; idealet er #F5F5F5 på #0A0A0A (~18:1).

Typografi og Skriftvægt

Tynde vægte (100-300) forsvinder i svagt lys. Brug Inter, Manrope eller Geist i vægt 500-600 og mindst 16px.

• Brødtekst: 17-18px, vægt 500
• Retnavn: 19-20px, vægt 600
• Pris: 16px, tabulariske cifre

Automatisk Mørk Tilstand

Moderne QR-menuer læser prefers-color-scheme for at overtage systemtemaet. iOS skifter automatisk ved solnedgang.

Data fra Etiler: efter mørk tilstand + 7:1 kontrast faldt "ulæselig"-klager med 82%, og aftensalget af drikkevarer steg 19%.

FAQ

Hvordan måler jeg 7:1? WebAIM Contrast Checker eller Chrome Lighthouse beregner automatisk.

Ødelægger farvede kategorier kontrasten? Ja — brug brandfarver kun dekorativt og hold menuteksten rent hvid.

Har vi brug for en manuel mørk tilstand-knap? Nej, at respektere systemtemaet er nok.

Var dette nyttigt? Del det.