Anatomie d’un site restaurant.
Les 6 éléments qui transforment un visiteur en réservation.

TL;DR — Les 6 éléments d’un site resto qui convertit

1. Hero qui donne faim en 3 secondes — une photo plein écran d’un plat phare + bouton « Réserver » visible en moins d’une seconde.
2. Menu en HTML, jamais en PDF — lisible par Google, ChatGPT, mobile, lecteurs d’écran. Avec allergènes structurés.
3. Photos pro, pas flash téléphone — investissement 800-2 000 $, ROI : +40-60 % de réservations.
4. Bouton « Commander directement » — récupère 15-30 % des commandes qui partaient chez Uber Eats.
5. Réservation 1 clic sur mobile — testée vendredi 21h sur 4G. Si ça met plus de 5 secondes, le client va voir ailleurs.
6. SEO local par quartier ET par occasion — pas « sushi Montréal », mais « sushi Plateau » et « menu midi Mile End ».

Budget pour un site comme ça : 2 500 à 6 000 $. Délai : 3 à 6 semaines. ROI mesurable sur les commissions Uber Eats économisées.

Vous tenez un resto au Québec. Votre site existe. Vous voyez peu de réservations en ligne — et 30 % de votre marge part chaque mois chez Uber Eats.

La frustration est légitime. Mais la cause n’est pas Uber Eats. La cause, c’est que votre site ne fait pas son travail : il ne donne pas envie de réserver chez vous directement. Voici les 6 éléments anatomiques d’un site resto qui change ça. On les illustre avec Kintsugi Sushi, notre démo de restaurant de sushi fictif imaginé au Plateau Mont-Royal.

Élément 01 — Le hero

3 secondes pour donner faim.

Le premier écran de votre site se joue en 3 secondes. Soit le visiteur a faim et clique « Réserver », soit il ferme l’onglet. Pas de troisième option.

Le hero idéal contient quatre choses, point. Pas un slider de 6 plats qui tourne. Pas un menu déroulant qui cache l’information.

Les 4 éléments du hero

1. Une photo plein écran d’UN plat phare

   Pas un buffet visuel. Une seule photo. Celle qui résume votre cuisine. Lumière naturelle, gros plan, vraiment appétissante.

2. Le nom du restaurant + une promesse en 5 mots

   « Kintsugi — Sushi gastronomique japonais. » Pas « Restaurant chaleureux et authentique depuis 2018 ».

3. Un bouton « Réserver » en vert, gras, sticky

   Visible sans scroller. Sur mobile aussi. Toujours présent en haut à droite quand on scrolle.

4. Un lien discret « Voir le menu »

   Pour les visiteurs qui veulent vérifier avant de réserver. À côté du bouton principal, plus petit.

💡 Test à faire : ouvrez votre site sur mobile en navigation privée. Si vous ne savez pas en 3 secondes ce que vous mangez ici ni comment réserver, votre hero est cassé.

Élément 02 — Le menu

Toujours HTML, jamais PDF.

Le PDF est mort pour la restauration depuis 2022. Trois raisons concrètes :

• Google ne lit pas un PDF correctement. Vos plats ne sortent pas dans les recherches « menu midi Plateau » ou « omakase Montréal ».
• Mobile ouvre mal un PDF. Téléchargement, zoom, scroll latéral : 60 % des visiteurs abandonnent avant d’avoir lu.
• ChatGPT et Perplexity ignorent le PDF. Quand un utilisateur leur demande « quel resto fait du tartare à Montréal », les IA citent les sites avec menu HTML. Pas les vôtres.

Le menu HTML qui marche

Structuré, indexable, modifiable en 30 secondes par le restaurateur. Sans repasser par un graphiste pour ajuster un prix.

• Sections claires : entrées · plats · desserts · boissons (ou par moment : midi, soir, dégustation)
• Allergènes structurés (gluten, lactose, fruits à coque, etc.) avec icônes — essentiel 2026 au Québec
• Options végé / végan filtrables
• Photos par plat phare (pas tous — seulement les 8-12 qui se vendent le mieux)
• Schema.org Menu dans le code — pour que Google affiche votre menu en rich snippet

🎯 Effet bonus IA : avec un menu HTML + Schema, quand un client demande à ChatGPT « où manger un omakase à Montréal sous 80 $ », l’IA peut littéralement citer votre menu et votre prix. C’est ça, exister en 2026.

Élément 03 — Les photos

L’investissement #1 sous-investi du secteur.

C’est facile à vérifier vous-même : parcourez 5-10 sites de restaurants québécois publiquement accessibles, regardez la qualité des photos de plats. La majorité utilise encore des photos prises au cellulaire avec flash, mal éclairées, fond de cuisine visible, reflet sur l’assiette.

La conversion réservation chute de 40 à 60 % avec des photos amateurs vs des photos pro. C’est statistiquement le levier le plus impactant — et le plus sous-traité.

Combien ça coûte (et ça rapporte)

• Photographe culinaire au Québec : 800 à 2 000 $ pour une session de 4-6 heures couvrant 15-25 plats + ambiance + équipe
• Délai retour : 1-2 semaines pour les photos retouchées
• Durée de vie utile : 2-3 ans (si vous gardez le même chef et la même carte)
• ROI typique : investissement amorti en 60-90 jours sur la conversion réservation

Les 3 types de photos à commander

1. Photos produit (gros plan plats)

   Pour le menu et les fiches plats. Lumière naturelle, fond neutre, angles variés.

2. Photos lifestyle (gens qui mangent)

   Pour la home et les pages « événement privé ». Plus humain, moins statique.

3. Photos de l’équipe et de la cuisine

   Pour la page « À propos ». Renforce la confiance et l’authenticité.

Élément 04 — Commande directe

Récupérer 15-30 % des ventes qui partaient chez Uber Eats.

Uber Eats et DoorDash prennent 25 à 30 % de commission sur chaque commande. Pour un resto qui fait 30 000 $/mois de livraison, c’est 8 000 $ qui partent en commissions.

L’idée n’est pas de supprimer Uber Eats — ils apportent de nouveaux clients. L’idée est de récupérer les commandes des clients déjà acquis, ceux qui vous cherchent volontairement par leur nom sur Google.

La structure qui marche

1. Un bouton « Commander directement »

   Couleur primaire vive, en haut de la page, à côté du « Réserver ». Pas caché dans le footer.

2. Une page de commande simple

   Choix des plats, mode (livraison/cueillette), code postal, paiement Stripe ou Square. Pas d’inscription obligatoire.

3. Un message d’incitation honnête

   « Commander chez nous directement = 100 % de votre paiement va au restaurant. Aucune commission tierce. » Les clients comprennent et apprécient.

4. Outils recommandés au Québec

   ChowNow, UEAT (made in Québec), TableHero, ou Stripe Checkout custom pour les indépendants. Coût : 50 à 200 $/mois — bien moins que les commissions évitées.

💰 Calcul concret : si 20 % de vos commandes Uber Eats passent par votre canal direct, sur 30 000 $/mois de livraison = 6 000 $ qui restent chez vous. Soit 72 000 $/an. C’est plus que le coût du site web complet.

Élément 05 — La réservation

1 clic sur mobile, vendredi 21h, en 4G dans le métro.

Le vrai test de votre formulaire de réservation, c’est ça : vendredi soir, 21h, sur un téléphone en 4G dans le métro. Pas en wifi du café avec votre MacBook ouvert.

Si à ce moment précis, votre site met plus de 5 secondes à charger, ou si le bouton « Réserver » n’est pas visible dans le premier écran, le client va chez le concurrent. Pas demain — dans la seconde qui suit.

Les 4 règles de la réservation qui marche

1. Bouton « Réserver » visible sans scroll sur mobile

   En haut à droite, vert vif, sticky (reste visible quand on scrolle).

2. Plateforme intégrée, pas de redirection externe

   Le client ne doit pas être projeté vers OpenTable.com avec un autre design. Intégration iframe ou widget natif.

3. 3 champs maximum à remplir

   Date · heure · nombre de personnes. Le nom et le téléphone se collectent à l’étape 2, après que le créneau soit confirmé.

4. Confirmation email immédiate

   Avec rappel SMS la veille (la plateforme s’en occupe). Réduit les no-shows de 30-40 %.

Quelle plateforme choisir au Québec

• Libro (Québec) : gestion francophone, intégration Google Business, prix moyen
• OpenTable (US) : standard mondial, audience touristique, commission par couvert
• Resy (US) : positionnement gastro, public urbain montréalais
• Cal.com (open source) : pour budgets très serrés, mais moins automatisé

Élément 06 — Le SEO local

Par quartier ET par occasion, pas par ville.

À Montréal, personne ne tape « restaurant Montréal » tout court. C’est trop large, trop générique. Les vraies requêtes qui rapportent du trafic qualifié sont :

• sushi Plateau Mont-Royal
• menu midi Mile End ouvert le dimanche
• restaurant pour anniversaire Vieux-Montréal
• omakase Montréal sous 100 $
• bistro français BYOB Rosemont

Chacune de ces requêtes correspond à une intention précise. Une intention = une page dédiée. Pas une seule page d’accueil qui essaie de répondre à tout le monde.

L’architecture qui capture chaque intention

Sur la démo Kintsugi, on a structuré le site en 4 couches :

1. Couche 1 — Page principale

   Cible la requête type-cuisine + ville : « restaurant sushi Montréal ».

2. Couche 2 — Une page par offre

   Menu midi, dégustation, événement privé, traiteur. Chaque page a son propre Schema.

3. Couche 3 — Une page par quartier

   « Sushi Plateau Mont-Royal », « Sushi Mile End », etc. avec contenu unique par quartier.

4. Couche 4 — Un blog qui répond aux questions ChatGPT

   « Combien coûte un omakase à Montréal ? », « Quel resto pour anniversaire de mariage ? » — le contenu citable par les IA.

🎯 Effet cumulatif : avec 4 couches × 4-6 quartiers × 3-4 occasions, un restaurant peut viser 40 à 60 pages indexables. Soit 40 à 60 chances de sortir sur Google ou d’être cité par une IA. Très peu de restos québécois ont cette structure — c’est exactement pour ça que la fenêtre est ouverte.

En résumé

Pas un site joli. Un outil de vente.

Ces 6 éléments ne sont pas optionnels. Ce sont les fondations d’un site restaurant qui fait son travail en 2026 : transformer un visiteur qui hésite en réservation confirmée.

La bonne nouvelle ? Au Québec, moins de 15 % des restos ont les 6 éléments en place. La compétition est sous-équipée. Quand vous mettez ces fondations, vous prenez une longueur d’avance qui dure des années.

Et chaque mois où vous attendez, c’est quelques milliers de dollars qui partent chez Uber Eats. C’est ça, le vrai coût d’un site mal foutu.

Preuve concrète

Ce que ChatGPT et Perplexity disent déjà sur les restaurants du Québec.

Pour rendre cet article vérifiable, voici deux vraies recherches faites sur ChatGPT et Perplexity en mai 2026. Les IA citent des restaurants précis de Saint-Léonard — avec adresses, notes Google, prix, photos. Les restaurants absents de ces réponses ne sont pas « malchanceux » : leurs sites ne donnent simplement pas aux IA de quoi les citer.

🎯 Ce que ces 2 captures prouvent : deux IA différentes (ChatGPT et Perplexity), deux requêtes longues différentes (« anniversaire 20 personnes » / « options végétariennes »), deux résultats hyper-locaux (Saint-Léonard). C’est exactement ce que vos clients tapent aujourd’hui. Et les restaurants cités ne sont pas les « plus grands » — ce sont ceux qui ont fait le travail des 6 éléments traités dans cet article.

⚠️ Les résultats des IA évoluent constamment. Les captures ci-dessus reflètent les réponses au moment de la rédaction (mai 2026). Pour vérifier où vous en êtes aujourd’hui, refaites le test vous-même sur perplexity.ai et chatgpt.com.

L’autrice

Fondatrice de Nextiweb, agence web à Montréal. A construit nextiwebstudio.ca, le laboratoire public de l’agence, avec 11 démos sectorielles complètes — dont Kintsugi Sushi, le concept de restaurant cité tout au long de cet article.

LinkedIn  ·  À propos  ·  Agence Nextiweb

Sources et références

Pour aller plus loin (sources publiques).

Cet article s’appuie sur des observations qualitatives du marché québécois et sur les sources publiques suivantes :

• Google Search Central — Documentation officielle SEO et bonnes pratiques contenu local.
  developers.google.com/search
• Schema.org — Restaurant + Menu + LocalBusiness — Vocabulaire officiel pour le balisage structuré des restaurants.
  schema.org/Restaurant · schema.org/Menu
• Google Rich Results Test — Outil officiel et gratuit pour vérifier le balisage Schema d’une page restaurant.
  search.google.com/test/rich-results
• Plateformes de réservation citées — Libro (Québec), OpenTable, Resy.
  libroreserve.com · opentable.ca · resy.com
• Plateformes de commande directe — Solutions pour court-circuiter les commissions Uber Eats / DoorDash.
  UEAT (Québec) · ChowNow · Stripe Checkout
• Web.dev — Core Web Vitals — Documentation Google sur la performance mobile (vitesse critique sur 4G vendredi soir).
  web.dev/articles/vitals

Les recommandations techniques de cet article (menu HTML, Schema Restaurant + Menu, réservation 1 clic) sont également appliquées en direct sur notre démo : restaurant-cafe.nextiwebstudio.ca. Le code est ouvert et vérifiable : github.com/lassrikhadija/nextiwebsolution.