Étude de cas · Création de site
O’18 : le site d’un fast-food de Lorient, en affiche street-food
Un site vitrine fait main pour un fast-food fait maison : une direction affiche street-food, une performance mesurée et du SEO local, sans CMS ni cookies.

- Client
- O’18, Lorient
- Prestation
- Création complète
- Mise en ligne
- Juillet 2026
- Stack
- Site statique · o2switch
- Lighthouse mobile
- 99100 en accessibilité, bonnes pratiques et SEO, le 4 octobre 2026
- Décalage visuel
- 0CLS 0 · TBT 0 ms, sur mobile
- Adresses au plan du site
- 26Pages, piliers locaux et articles du blog
01 Point de départ
Le défi
O’18 venait d’ouvrir et n’avait pas de site : une carte qui évolue, des horaires qui changent, et des clients qui cherchent sur mobile. Il fallait une présence en ligne rapide à charger, simple à tenir à jour et visible sur les recherches locales à Lorient.
- Un restaurant qui venait d’ouvrir, sans site
- Une carte et des horaires qui changent
- Une visibilité locale à construire
02 Direction artistique « Affiche street-food »
Un fast-food en affiche de rue.
Le site emprunte aux affiches collées dans la rue : titres serrés en Bebas Neue, bleu marine et jaune, bordures d’encre et ombres dures décalées, comme du papier imprimé posé de travers. Les étiquettes penchent, les sections se suivent par des bords déchirés, un ruban défile sous l’accueil, et le pied de page souhaite « Bon appétit » en lettres géantes. Derrière l’affiche, un site statique : la carte et les horaires sortent d’un seul fichier, et le badge « Ouvert maintenant » se calcule sur les horaires réels.
- Site statique fait main, sans CMS
- Carte et horaires générés depuis une source unique
- Données structurées et blog SEO local
La palette
- Bleu marine
#0B2A6BCouleur principale - Jaune
#F5C518Accent, prix, étiquettes - Crème
#F6EEDCFond clair - Crème chaude
#EBDFC0Sections alternées - Encre
#0E0E0EBordures, ombres, pied de page - Marine profond
#071A46Fonds sombres
Les typographies
Bebas Neue · Titres
Une seule graisse, des capitales serrées
Archivo Narrow · Étiquettes et boutons
Graisse 700 en capitales ; le texte courant est en Archivo
Le décodeur
Chaque fonction du site a sa forme. En petit, ce qu’elle fait ; en gros, comment le site la présente.

Sur le site · La page d’accueil L’affiche Chaque plat vedette a son affiche : nom en lettres géantes, prix en étiquette penchée, numéro fantôme en fond, et « Fait maison · Produit frais » qui tourne autour de l’assiette.

Sur le site · Les engagements Les trois règles Produit frais, fait minute, sauces maison : trois cartes bordées d’encre, à l’ombre dure, légèrement de travers.

Sur le site · La carte Les onglets et les prix Un onglet par famille, chaque plat numéroté, son prix en menu et seul sur des étiquettes jaunes.

Sur le site · La formule du midi Le panneau du midi Trois formules en lignes, le prix d’appel en très grand, et « MIDI » répété en filigrane.

Sur le site · L’histoire Les polaroïds L’histoire du lieu, et deux plats en polaroïds posés de travers, avec leur étiquette « Depuis 2026 ».

Sur le site · Le contact Le panneau bleu « Une question ? Écrivez-nous » : le téléphone, l’adresse et le formulaire sur un panneau bleu marine.

Sur le site · Le pied de page Le mot de la fin « Bon appétit à Lorient » en lettres géantes, jaune et crème sur l’encre.
03 La visite
Visitez le site, page par page
Choisissez une page : elle s’affiche en entier, sur ordinateur et sur téléphone. Faites défiler chaque écran pour la parcourir.


Accueil. L’affiche du plat vedette, les trois règles, la carte en entier, la formule du midi, l’histoire, l’accès et les questions fréquentes.


Page pilier. Smash burger à Lorient : la technique, le tableau des six burgers, où les déguster, et les articles pour aller plus loin.


Les actus. Les articles en cartes bordées d’encre, chacun avec son étiquette de rubrique.


Article. C’est quoi, un smash burger ? L’essentiel en résumé coché, puis la technique expliquée.


Contact. Nous trouver : le plan du quartier, les horaires, l’accès, puis le formulaire.
04 Méthodologie
L’approche en 5 étapes
Cadrage
Identité, arborescence et charte définies avec le client.
Maquette
Direction affiche street-food : typographies fortes, visuels des plats.
Dev
Site statique HTML, CSS et JavaScript natif, sans CMS.
SEO
Données structurées, pages piliers locales et blog maillé.
Lancement
Déploiement sur o2switch et suivi d’indexation.
Prestations mobilisées
Très satisfait des deux sites réalisés pour mes entreprises. Sébastien a bien compris nos besoins, le rendu est moderne et nos clients nous trouvent facilement en ligne.
O’18Fast-food fait maison, LorientOuvert à de nouveaux projets
Et si c’était le vôtre ?
Parlez-moi de votre activité : je vous envoie sous 48 h un devis gratuit et des recommandations concrètes pour vous lancer.
SébastienFondateur de Wasabi Web Design, à Arras






