Concevoir des Menus pour Restaurants Tamisés : Le Contraste 7:1

Un bar à whisky de 18 tables à Etiler, Istanbul, voyait ses clients allumer la lampe de leur téléphone pour lire la carte à la lueur des bougies. La solution n'était pas plus de lumière mais un contraste de menu poussé de 4.5:1 à 7:1.

WCAG 2.2 AA vs Recommandation AAA

WCAG 2.2 AA exige 4.5:1 pour le texte courant, mais ce standard a été validé à 200-500 lux d'éclairage de bureau. Un restaurant du soir tourne autour de 20-50 lux, soit un dixième.

Pour les lieux du soir, partez du ratio AAA 7:1. Le #FFFFFF pur sur #000000 donne 21:1 mais crée du halo ; l'idéal est #F5F5F5 sur #0A0A0A (~18:1).

Typographie & Graisses

Les graisses fines (100-300) disparaissent en faible lumière. Utilisez Inter, Manrope ou Geist en graisse 500-600, taille 16px minimum.

• Corps : 17-18px, graisse 500
• Nom du plat : 19-20px, graisse 600
• Prix : 16px, chiffres tabulaires

Mode Sombre Automatique

Les menus QR modernes lisent prefers-color-scheme pour adopter le thème système du téléphone. iOS bascule au coucher du soleil, aucun bouton nécessaire.

Résultats à Etiler : après le mode sombre et le contraste 7:1, les plaintes "illisible" ont chuté de 82% et les ventes de boissons du soir ont augmenté de 19%.

FAQ

Comment mesurer le 7:1 ? WebAIM Contrast Checker ou Lighthouse Chrome le calculent automatiquement.

Les titres colorés réduisent-ils le contraste ? Oui — gardez les couleurs de marque pour la décoration, mettez le texte du menu en blanc pur.

Faut-il un bouton manuel de mode sombre ? Non, respecter le thème système suffit.

Cet article vous a été utile ? Partagez-le.