Site internet pour un restaurant de cuisine maison à Voglans : L'Entre Deux
Un restaurant du midi où tout se fait sur place et où l'ardoise change chaque jour. On a gardé son orange, sa crème et son encre, posé l'ardoise du jour en tête de la carte, et donné à Morgane un moyen de la remplir en prenant une photo depuis son téléphone.Voir lentredeux-voglans.fr
Le client : un restaurant du midi où tout se fait sur place
L'Entre Deux est un restaurant traditionnel de Voglans, rue de la Françon, entre Chambéry et le lac du Bourget. Il ouvre le midi, du lundi au vendredi. Tout se fait sur place : les sauces, les frites, les cordons bleus. L'ardoise change chaque midi au gré du marché, et la carte suit les saisons.
- Aux fourneaux, Morgane. Son burger bistronomique, le Blanq'Brest, s'est classé parmi les 100 meilleurs de la Coupe de France du Burger, et elle en a disputé trois fois la finale à Paris, en 2019, 2021 et 2024. Ici, un burger est une assiette de chef, et le site devait le laisser comprendre sans le crier.
- Les produits viennent d'à côté, surtout du massif de la Chartreuse : la fromagerie de Saint-Pierre-d'Entremont, la boulangerie d'Entremont-le-Vieux, La Frite des Alpes, Saveurs Campagnardes, L'Escargot de Droisette. Le restaurant le dit lui-même : « Nous venons du massif de la Chartreuse, et nous aimons travailler les produits de chez nous. »
- Le midi, on décide vite : qu'est-ce qu'il y a aujourd'hui, combien ça coûte, est-ce qu'il reste une table. Le site a quelques secondes pour répondre à ces trois questions, sur un téléphone.
- Le restaurant fait aussi traiteur : plats à emporter, buffets livrés, privatisation le soir pour les groupes. C'est un autre client, qui prépare un événement plutôt qu'un déjeuner, et qui a besoin d'une page à lui.
La direction artistique : un bistrot chaleureux, lisible au premier coup d'oeil
L'Entre Deux avait déjà une identité : un logo rond au nom écrit à la main, un orange vif, des photos d'assiettes très colorées. On n'a rien inventé par-dessus. On a mesuré l'orange sur le logo, posé autour un fond crème et une encre brun très foncé, et réservé l'écriture à la main aux seuls endroits où le restaurant parle comme sur son ardoise.
Trois couleurs, et l'orange du logo réservé au bouton de réservation
- Ce qu'on voit
- Un fond crème qui rappelle le papier d'un menu, une encre brun espresso presque noire pour le texte, et l'orange exact du logo comme unique accent. Cet orange est trop clair pour du texte : sur les boutons, les lettres sont donc à l'encre, et les liens prennent une version plus foncée du même orange. L'ardoise du jour a son gris anthracite à elle, et un mot par titre passe en vert.
- Pourquoi ça lui va
- Sur une page crème et brune, l'orange plein ne sert qu'à ce sur quoi on appuie. Un client qui ouvre le site entre deux rendez-vous trouve le bouton « Réserver une table » sans le chercher. Et chaque teinte de texte est réglée pour un contraste suffisant sur les fonds crème, pour se lire sur un téléphone en plein jour.
- #fcf6ecCrèmefond principal, papier chaud
- #f7ecd9Crème densesections alternées et cartes
- #211910Encretitres, texte, et lettres posées sur le bouton orange
- #ec7a04Orange du logofond des boutons de réservation, et rien d'autre
- #994a08Orange foncéliens, icônes et étoiles des avis
- #3a4145Ardoisele tableau du menu du jour
- #577511Vert saladele mot écrit à la main dans chaque titre
La palette du site, relevée sur les pages en ligne. Une grotesque franche pour les titres, une écriture de craie pour l'ardoise
- Ce qu'on voit
- Les titres sont en Familjen Grotesk, une sans serif aux formes un peu irrégulières, chaleureuse sans être fantaisiste. Le texte courant est en DM Sans, ronde et très lisible en petit. Dans chaque titre, un seul mot passe en Caveat, une écriture à la main : maison, table, producteurs, place. Et l'ardoise du jour est écrite en Fredericka the Great, une lettre de craie.
- Pourquoi ça lui va
- Le texte doit se lire vite, donc il reste sobre. L'écriture à la main reprend celle du nom sur le logo, et ne sert qu'à un mot par titre, celui qui porte l'intention du restaurant, comme le mot qu'on souligne sur un tableau. Et l'ardoise du site ressemble à celle de la salle : le client qui connaît le restaurant la reconnaît, celui qui ne le connaît pas comprend tout de suite que le menu change chaque jour.
Familjen Grotesk
titres
Une table de quartier
DM Sans
texte courant
Ici, tout se fait sur place : les sauces, les frites, les cordons bleus.
Caveat
un seul mot par titre
maison
Fredericka the Great
l'ardoise du jour, à la craie
Menu du jour
Spécimen composé dans la police du site, réglages compris. Selon ta machine, le navigateur peut lui substituer la police de repli prévue. Le mot écrit à la main prend la couleur que la patronne a choisie
- Ce qu'on voit
- La couleur du mot manuscrit n'est pas figée dans le code. Quatre teintes ont été relevées sur les photos du restaurant : le vert d'une salade, le rouge d'une tomate, le rose d'une viande, le violet d'une fleur posée sur l'assiette. La patronne choisit la sienne depuis son espace d'administration, et tout le site suit. Aujourd'hui, c'est le vert salade.
- Pourquoi ça lui va
- L'orange appartient au logo et au bouton, il ne bouge pas. Le reste peut ressembler à la saison et à la personne qui tient le restaurant. Les quatre teintes sont réglées pour rester lisibles sur les deux fonds crème, donc aucun choix ne peut abîmer la lecture.
- #577511Saladele choix en ligne aujourd'hui
- #c52012Tomaterelevé sur les tomates des assiettes
- #bb3f58Vianderelevé sur une pièce de viande
- #7d50a8Fleurrelevé sur une fleur de l'assiette
La palette du site, relevée sur les pages en ligne. Uniquement les photos du restaurant, et la meilleure en premier
- Ce qu'on voit
- Toutes les images du site sont celles du restaurant : ses assiettes, son burger primé, ses buffets de traiteur. Le hero ouvre sur une assiette de burrata aux tomates, la section sur la maison sur le Blanq'Brest. Sur téléphone, la photo passe au-dessus du titre, pour que le premier écran soit une assiette.
- Pourquoi ça lui va
- Pour un restaurant, une photo de banque d'images se repère tout de suite et fait douter du reste. Les assiettes de Morgane sont colorées et dressées avec soin : elles vendent mieux que n'importe quelle phrase. On a donc donné la place aux photos et réduit le texte autour.
L'assiette du hero
La première image que voit un visiteur.
Le burger de concours
Le Blanq'Brest, classé parmi les 100 meilleurs de France.
Un seul arrondi pour tout, et un en-tête qui s'efface
- Ce qu'on voit
- Les photos et les boutons ont tous le même arrondi de 14 pixels. L'en-tête se retire quand on descend la page et revient dès qu'on remonte. La pilule « Réserver » reste en bas de l'écran pendant toute la visite.
- Pourquoi ça lui va
- Un même angle partout rend la page calme et cohérente, comme une salle bien rangée. L'en-tête qui s'efface laisse toute la hauteur du téléphone aux assiettes et à la carte, et le bouton de réservation reste à portée de pouce.
lentredeux-voglans.fr/#maison
Ouvrir lentredeux-voglans.fr/#maison
Pourquoi ce projet existe
Avant ce site, L'Entre Deux vivait sur Instagram et sur une page générique fournie par son outil de réservation. Cette page affichait d'abord un grand bandeau de cookies, puis neuf onglets en majuscules : accès, horaires, moyens de paiement, galerie, événements, services, commentaires, contact, réservation. Aucun ne menait au menu du jour.
- L'information que cherche un client du midi, ce qu'il y a à manger aujourd'hui, n'avait pas d'adresse fixe en ligne : il fallait la chercher dans les publications Instagram, ou venir lire l'ardoise sur place.
- Le travail de Morgane, ses finales de la Coupe de France du Burger, ses producteurs de la Chartreuse, n'avait pas de page où être raconté. C'est pourtant ce qui distingue L'Entre Deux d'une cantine de passage.
- Le traiteur et la privatisation tenaient en une phrase, sans formules, sans photos de buffets, sans moyen de demander un devis en ligne. Un client qui organise un repas d'entreprise devait appeler pendant le service pour poser ses questions.
- Tenir un site à jour ne devait pas prendre de temps à la patronne. Si l'ardoise du site demande dix minutes d'ordinateur chaque matin, elle ne sera pas remplie. Il fallait que ce soit plus rapide que de l'écrire à la craie.
Les détails qui font la différence
Voici les 9 touches qu'un modèle de site acheté sur étagère n'aurait jamais produites pour L'Entre Deux, parce qu'elles ne se déduisent pas d'un secteur d'activité : elles se déduisent d'une conversation avec quelqu'un qui connaît son métier.
Avant : la moitié de l'écran pour des cookies. Maintenant : une assiette et un bouton
Sur la page qui tenait lieu de site, le visiteur arrivait sur un bandeau de cookies qui occupait la moitié haute de l'écran, puis sur un menu de neuf entrées en majuscules. Sur le nouveau site, le premier écran montre une phrase, une photo d'assiette et un seul bouton : « Réserver une table ». Juste en dessous, l'ardoise du jour. Les horaires, l'adresse et les avis viennent après, pour qui les cherche.
Avant : la page eatbu
Après : le nouveau site
Ouvrir lentredeux-voglans.fr L'ardoise du jour est la première chose de la carte
Le menu du jour s'affiche sur un tableau d'ardoise, avec sa date, l'entrée, le plat, le dessert et le burger du moment, puis le prix des formules : 17 € le plat, 20 € pour deux, 24 € le menu complet. Sur téléphone, il arrive en haut de la carte ; sur ordinateur, en tête de la première colonne. Un client qui hésite entre deux restaurants à 11 h 50 a sa réponse avant même de chercher les horaires.
lentredeux-voglans.fr/#carte
Ouvrir lentredeux-voglans.fr/#carte Remplir l'ardoise en prenant une photo, ou en la dictant
Dans son espace d'administration, Morgane prend en photo l'ardoise qu'elle vient d'écrire, ou dicte le menu à voix haute. Le site lit la photo ou le message, préremplit les champs du jour, et elle n'a plus qu'à relire et publier. Un calendrier montre les quatorze prochains jours, et les jours déjà remplis passent au vert. Si à 10 h, du lundi au vendredi, le menu du jour n'est toujours pas saisi, son téléphone reçoit un rappel. L'espace s'installe sur l'écran d'accueil comme une application, et la connexion tient trois mois.
Une photo ou la voix
Morgane photographie son ardoise, ou dicte le menu depuis son téléphone.
Les champs se remplissent
Entrée, plat, dessert, burger du moment et son prix sont préremplis. Elle relit et corrige si besoin.
L'ardoise est en ligne
Le menu du jour s'affiche en tête de la carte, avec la date du jour.
Le rappel de 10 h
Un jour où rien n'est saisi, une notification le rappelle avant le coup de feu.
Réserver sans quitter le site, ou appeler
Le restaurant utilisait déjà un calendrier de réservation en ligne. On l'a gardé, et intégré dans la page : chaque bouton « Réserver » du site ouvre ce calendrier dans une fenêtre, sans envoyer le client vers une autre adresse. Juste dessous, le numéro du restaurant, pour ceux qui préfèrent appeler. L'espace d'administration propose aussi un agenda par table, avec une alerte sur le téléphone trente minutes avant chaque service : le jour où la patronne voudra changer d'outil, c'est un réglage, pas un nouveau site.
lentredeux-voglans.fr/#reserver
Ouvrir lentredeux-voglans.fr/#reserver Les producteurs sur une carte, reliés au restaurant par un trait
La section « Nos producteurs d'à côté » pose chaque fournisseur sur une carte de la région. On touche un point : un trait le relie à L'Entre Deux, et sa fiche s'affiche à côté, avec ce qu'il apporte. La carte est figée : sur téléphone, le doigt fait défiler la page au lieu de déplacer la carte, et les points restent cliquables. Le circuit court devient visible en un coup d'oeil, au lieu d'être une promesse dans un paragraphe.
lentredeux-voglans.fr/#producteurs
Ouvrir lentredeux-voglans.fr/#producteurs Une page traiteur avec son propre bouton
La page traiteur s'ouvre sur une photo de buffet en terrasse, face à la montagne, et un titre : « Vous recevez, on cuisine pour vous. » Elle présente trois formules et un formulaire de demande de devis. Sur cette page, la pilule flottante ne dit plus « Réserver » mais « Demander un devis » : le client qui prépare un événement n'a pas besoin d'une table ce midi. Les demandes arrivent dans l'espace d'administration, avec une notification sur le téléphone, comme les réservations.
lentredeux-voglans.fr/traiteur
Ouvrir lentredeux-voglans.fr/traiteur Ouvert ou fermé, et une adresse qui se copie d'un geste
La section infos indique si le restaurant est ouvert en ce moment. L'adresse se copie d'un clic, pour la coller dans un GPS ou l'envoyer à un collègue. Les horaires tiennent sur deux lignes : du lundi au vendredi de 8 h 30 à 14 h 30, fermé le week-end.
lentredeux-voglans.fr/#infos
Ouvrir lentredeux-voglans.fr/#infos Les avis Google en direct, avec une sélection de secours
Les derniers avis Google du restaurant s'affichent dans la page, mis à jour automatiquement. Si le service de Google ne répond pas, une sélection d'avis réels déjà enregistrés prend le relais : une panne chez un tiers ne laisse jamais de trou dans la page.
lentredeux-voglans.fr/#avis
Ouvrir lentredeux-voglans.fr/#avis Sur téléphone, l'assiette d'abord
La version mobile n'est pas la version ordinateur rétrécie. La photo passe au-dessus du titre, le bouton de réservation est centré sous le texte, la galerie devient un carrousel qu'on fait glisser du pouce, et un clic sur une photo l'ouvre en grand. C'est sur téléphone que se décide un déjeuner.
La galerie au pouce
Une photo touchée
Ouvrir lentredeux-voglans.fr/#galerie
Ce qu'on a adoré sur ce projet
Ce projet nous a appris à quel point un site de restaurant se joue sur ce qui change chaque jour.
Faire entrer l'ardoise de la salle dans le téléphone
Le meilleur contenu du restaurant était écrit à la craie tous les matins, et effacé le soir. Trouver une façon de le publier en une photo, sans demander une minute d'ordinateur à Morgane, c'est le genre de problème qu'on adore résoudre.
Raconter un burger de concours sans en faire trop
Trois finales de la Coupe de France du Burger, c'est un vrai palmarès. On l'a posé dans un paragraphe, avec la photo du Blanq'Brest et sa légende, plutôt que dans un bandeau clignotant. Les assiettes parlent assez fort.
Dessiner la Chartreuse autour du restaurant
Poser chaque producteur sur la carte et le relier au restaurant d'un trait a rendu visible une chose que les habitués savaient déjà : presque tout ce qui arrive dans l'assiette vient d'à côté.
Laisser la patronne choisir sa couleur
Relever quatre teintes sur les photos de ses assiettes, puis lui laisser le dernier mot depuis son téléphone, c'est une petite chose. Elle fait que le site est le sien, et pas seulement le nôtre.
Ce qu'on n'a pas fait, et pourquoi
Un site se juge autant à ce qu'il refuse qu'à ce qu'il contient. Chaque fonctionnalité en plus est une chose de plus à comprendre pour le visiteur, et une promesse de plus à tenir pour L'Entre Deux. Voici ce qu'on a écarté, et ce qui nous ferait changer d'avis.
Pas de commande ni de paiement en ligne.
L'Entre Deux est un restaurant du midi où l'on vient s'asseoir. Une boutique en ligne aurait ajouté des commandes à surveiller pendant le service. Le site amène à la table, au téléphone, ou à une demande de devis pour le traiteur.
Pas de changement d'outil de réservation imposé.
Le restaurant avait déjà son calendrier de réservation en ligne. On l'a intégré dans le site plutôt que de le remplacer. L'agenda maison existe, prêt à servir, mais le choix reste celui de la patronne.
Pas de photos de banque d'images.
Chaque image du site vient du restaurant ou de ses producteurs. Une assiette qu'on ne servira jamais n'a rien à faire sur la page d'un restaurant qui revendique le fait maison.
Le site est en ligne
Le meilleur moyen de juger ce travail est de l'ouvrir sur ton téléphone.
lentredeux-voglans.fr