Le brief qui crée un site

MAJ du 12 juin 2026

7 min de lecture + 25min d'exerciceNiveau débutantCréer son site avec l'IA

Vous voulez un site à votre image, mais les outils qui construisent à votre place sont obéissants. Trop obéissants. Si vous demandez « un site pour vendre mon coaching », vous obtenez un site correct, et fade, qui ressemble à des milliers d'autres. Le luxe et la personnalité ne viennent pas de l'outil : ils viennent de la précision de ce que vous lui demandez.

Cette masterclass vous donne la structure d'un brief en 6 blocs : chaque bloc enlève une zone de flou, et chaque zone de flou en moins, c'est un site plus proche de vous. Vous n'avez pas besoin de savoir coder. Vous avez besoin de savoir décrire.

Ce que cet exercice ne peut pas casser

Tout l'exercice consiste à écrire un texte, votre brief, avant de toucher à quoi que ce soit. Vous ne publiez rien, vous ne payez rien à cette étape. Au pire, vous reformulez un paragraphe. Un brief raté se corrige en deux minutes, un site raté se recommence.

Ce que vous saurez faire à la fin

  • Décrire le site que vous voulez en 6 blocs précis, au lieu d'une phrase vague.
  • Donner une référence de style et un code de couleur exact, au lieu d'adjectifs que l'IA interprète au hasard.
  • Décrire votre page d'accueil de haut en bas, section par section, pour ne rien laisser au hasard.
  • Niveau membre· le modèle de brief prêt à coller : vous remplissez les crochets, vous le collez dans l'outil, et vous obtenez une vraie première version.
  • Niveau Pro· je ne vous donne pas qu'un modèle : je construis votre actif avec vous, au niveau pro, sans que vous y passiez vos soirées.
Le brief en 6 blocs
1. Objetmétier + référence2. Ambiance3 mots + 1 ton3. Couleurscode exact, polices4. Architecturepages du menu5. Accueilde haut en bas6. Affinageles pièges connus

Chaque bloc enlève une zone de flou. Du plus structurant au plus fin.

Les 6 blocs, en détail

L'outil que j'ai utilisé s'appelle Lovable. Le mot fait peur, mais c'est juste un site web où vous écrivez ce que vous voulez, et il construit l'application ou le site à votre place (abonnement payant). Vous lui parlez en français, normalement. Le piège, c'est que ces outils font exactement ce qu'on leur dit, y compris quand on ne dit presque rien. C'est pour ça qu'on soigne ces 6 blocs.

1Bloc 1 : l'objet et la référence de styledoute : « comment lui faire comprendre ce que je veux ? »

Dites en une phrase à quoi sert le site, puis nommez une référence visuelle que vous admirez. L'IA a « vu » des millions de sites : lui donner un nom de référence (un créateur, une marque), c'est lui montrer la cible du premier coup, au lieu de la lui décrire pendant une heure. Le geste : écrivez « Création d'un site vitrine haut de gamme pour [votre métier], dans le style de [référence] ». Moi, ma référence était Justin Welsh, un créateur connu pour son site très épuré.

2Bloc 2 : l'ambiance et le tondoute : « luxueux ou bon marché, qu'est-ce qui décide ? »

Vous cherchez l'atmosphère visuelle, et la voix. Un même contenu peut sembler luxueux ou bon marché selon l'ambiance : on la décide, on ne la laisse pas au hasard. Le geste : donnez trois mots pour le visuel et un pour le ton. Mon brief disait « extrêmement épuré, minimaliste, content-first (centré sur l'écrit), beaucoup d'espaces vides pour une sensation de clarté et de luxe », et un ton « conversationnel, direct, autoritaire mais accessible ». Petit mot à connaître : les espaces vides, ce que les pros appellent le « blanc », ce sont les zones où il ne se passe rien. C'est ce vide qui donne l'impression de luxe.

3Bloc 3 : les couleurs et les policesdoute : « « mets du violet », ça ne suffit pas ? »

Vous cherchez une palette précise et le style d'écriture des titres et du texte. C'est là que la plupart des sites ratent leur effet : « mets du violet » donne dix violets possibles, un code précis donne le bon. Un code de couleur, c'est l'adresse précise d'une teinte, écrite avec un dièse et six caractères (par exemple #6366F1 pour mon violet). Le geste : j'ai demandé fond blanc pur, accent violet électrique #6366F1, texte en bleu-gris profond. Pour les polices (le dessin des lettres), j'ai choisi Playfair Display pour les grands titres et Libre Baskerville pour le texte.

4Bloc 4 : l'architecturedoute : « et s'il invente des pages dont je ne veux pas ? »

Vous cherchez la liste des pages et le menu du haut. C'est le plan de la maison : si vous ne le donnez pas, l'IA invente des pièces dont vous ne voulez pas, ou en oublie. Le geste : listez vos pages dans l'ordre du menu. La mienne : Accueil, À propos, Articles, Newsletter, Coaching, Livres, Prendre rendez-vous.

5Bloc 5 : la page d'accueil, section par sectiondoute : « par où commencer la description ? »

Vous cherchez le contenu de la page la plus importante, dans l'ordre vertical. La page d'accueil, c'est votre poignée de main : on la décrit du haut vers le bas pour ne rien laisser au hasard. Le geste : décrivez d'abord le tout en haut, ce que les pros appellent le « hero », c'est-à-dire la première chose qu'on voit avant de faire défiler. Puis la suite. Mon haut de page : un titre d'impact « Transforme ton expertise en revenu », une invitation à la newsletter, et juste en dessous des témoignages.

6Bloc 6 : les conseils d'affinagedoute : « comment éviter les allers-retours inutiles ? »

Vous cherchez les pièges connus, signalés d'avance. Prévenir l'IA d'un piège, c'est s'épargner trois allers-retours. Le geste : ajoutez vos garde-fous. Les miens : « écris une idée par ligne » (le secret du style épuré), et « les sous-menus Coaching sont des liens vers l'extérieur, ne crée pas de pages vides ».

À vous de jouer : écrivez votre brief en 6 blocs

Prenez une page blanche, un bloc après l'autre, dans l'ordre. Cochez à mesure.

Le résultat, en 30 secondes

Voici le début du brief réel que j'ai écrit le 8 février 2026. Aucun mot inventé, c'est le vrai. Dès la première version, il a donné un haut de page épuré, mon nom, une promesse claire, et l'animation où le mot « revenu » s'écrit lettre par lettre.

Objet : Création d'un site vitrine haut de gamme pour expert en monétisation d'expertise (Style Justin Welsh). Identité Visuelle et Tone of Voice : le design doit être extrêmement épuré, minimaliste et « Content-First » (axé sur l'écrit). Utilise beaucoup d'espaces vides (white space) pour une sensation de clarté et de luxe. Palette de couleurs : fond blanc pur, accents en violet électrique pour le soulignement, texte et détails en bleu-gris profond. Le « violet » : pour obtenir le look Premium, demande un violet de type #6366F1 sur fond blanc #FFFFFF.

Le prompt prêt à coller

Brief de création de site~162 mots · 0 blocsNiveau membre · débloqué par email
Objet : création d'un site vitrine haut de gamme pour [VOTRE MÉTIER], dans le style de [RÉFÉRENCE QUE VOUS ADMIREZ].
Ambiance et ton : design [3 MOTS, ex : épuré, minimaliste, beaucoup d'espaces vides]. Ton d'écriture [1 MOT, ex : direct et chaleureux].
Couleurs : fond [COULEUR, ex : blanc pur], accent [COULEUR + code exact, ex : violet #6366F1], texte [COULEUR].
Polices : grands titres en [POLICE TITRES], texte courant en [POLICE TEXTE].
Architecture (menu en haut) : [PAGE 1], [PAGE 2], [PAGE 3], [PAGE 4].

Le modèle de brief complet, avec les 6 blocs déjà rédigés : vous remplissez les crochets, vous le collez dans l'outil, et vous obtenez une vraie première version de votre site. Laissez votre email, je vous l'envoie.

Pas de carte bancaire, juste un email réel. Déjà un compte ? Connectez-vous.

Vérifiez que c'est à vous

Vous écrivez à l'outil : « fais-moi un site élégant pour mon activité de coach, avec du violet ». La première version est fade et le violet ne ressemble à rien. Que corrigez-vous en premier ?

D'abord avec vos mots, sans regarder les options :

Expliquez-le pour l'ancrer

En une phrase, à un proche qui veut créer son site : pourquoi « accent violet #6366F1 » donne un meilleur résultat que « mets du violet » ? Si vous savez l'expliquer simplement, le réflexe est à vous.

Ce que vous savez faire maintenant

  • Structurer un brief de site en 6 blocs : objet et référence, ambiance, couleurs et polices, architecture, page d'accueil, conseils d'affinage.
  • Remplacer les adjectifs vagues par des éléments exacts : une référence nommée, un code de couleur, des polices choisies.
  • Décrire une page d'accueil de haut en bas, en commençant par le hero, pour que rien ne soit laissé au hasard.
Le blanc · les espaces vides, les zones où il ne se passe rien ; c'est ce vide qui donne l'impression de luxeCode de couleur · l'adresse précise d'une teinte, écrite avec un dièse et six caractères, par exemple #6366F1Hero · le tout en haut de la page, la première chose qu'on voit avant de faire défiler

Vous n'avez pas besoin de savoir coder. Vous avez besoin de savoir décrire.

Continuez seul

Votre brief est posé. Épisode suivant du parcours :

Épisode 2 : donner une âme (couleurs, polices et animation)

Faites-le avec moi

Vous voulez aller plus vite, et que ce soit fait au niveau pro, sans y passer vos soirées ? Je ne vous donne pas qu'un modèle : je construis votre actif avec vous.