--- title: "Votre premier site, du début à la fin | Briks" url: https://briks.dev/fr/docs/your-first-site description: "Suivez une petite boulangerie, du nouveau projet à l'aperçu sur briks.live, au premier changement dans le chat, puis à la mise en production, écran par écran." last_updated: 2026-10-08 --- # Votre premier site, du début à la fin Ce pas à pas suit une entreprise, d'un espace de travail vide jusqu'à un site public, pour que vous voyiez chaque écran une fois avant de le faire vous-même. L'exemple est Larder Lane, une petite boulangerie à York, créée avec les 50 crédits du forfait Free. 9 minutes de lecture Vérifié par rapport au studio le 8 octobre 2026 ## Avant de commencer Préparez trois choses : le nom de l'entreprise, un paragraphe de présentation et une liste approximative de pages. Sam, qui tient Larder Lane, veut un site qui montre le pain, prend les précommandes du samedi et indique où se trouve la boutique et quand elle est ouverte. Sam est sur l'offre Free : il a donc 50 crédits et de la place pour 1 projet. Un nouveau site en réserve 50 pendant sa création, il démarre donc avec un solde complet et n'en dépense pas pour autre chose avant. Comme premier site d'un espace de travail Free, il est construit en entier même s'il demande plus que ce qu'il a. ## Première étape : décrire l'activité Où 1. Projects 2. New project Vous pouvez aussi partir de la zone de saisie de Home et appuyer sur **Continue**. Dans les deux cas, vous arrivez à une courte configuration en sept étapes : **What are you making?**, **Describe it**, **Show what you like**, **Your brand**, **Pictures**, **How it is built** et **Review and create**. Une liste à côté indique où vous en êtes, et **Back** et **Next** permettent de passer d'une étape à l'autre. Ce que vous saisissez est conservé dans ce navigateur jusqu'au début de la création, donc vous pouvez partir et revenir. 1. Choisissez le type et donnez-lui un nom Où : What are you making? Sam choisit **Website** et saisit `Larder Lane` dans **Business or project name**. Le nom devient aussi la première adresse du site. 2. Rédigez la description Où : Describe it Le champ accepte jusqu'à 25 000 caractères et en demande au moins dix. Vous pouvez écrire ou dicter. Le panneau en dessous liste ce que dit une bonne description : à qui le site s'adresse et où, ce qu'il propose ou fait, quelle impression il doit donner, et les pages ou fonctions qu'il lui faut. 3. Passer les étapes facultatives Où : Show what you like, Your brand Les deux sont marqués **Optional**, et sans rien remplir le bouton affiche **Skip**. Sam n'a aucun site à suivre et aucune couleur imposée : il passe les deux et laisse Briks choisir. 4. Conserver les images incluses Où : Pictures Le premier choix, marqué **Included**, prend des images adaptées dans la bibliothèque du studio et dessine ce qui manque, sans frais pour les images. Les autres choix dessinent chaque image à neuf et ajoutent un prix par image à la construction. 5. Vérifiez comment il est construit Où : How it is built **Ask about what is unclear before building** est activé ; laissez-le ainsi. Sam laisse désactivés les interrupteurs d'approbation et **Check the published site**. 6. Vérifier et créer Où : Review and create Chaque choix est listé avec un moyen de revenir le modifier. La note en dessous indique que le nouveau projet retient 50 crédits pendant la construction, quel est votre solde, et que la première version prend quelques minutes. Quand un projet de ce type demande en général plus que ce que vous avez, une ligne en dessous donne l'estimation. Sam appuie sur **Build it**. Le brief de Sam Larder Lane, York > Une petite boulangerie de quartier à York, ouverte du mercredi au samedi. Pain au levain, pain de seigle et viennoiseries cuits sur place chaque matin. Les clients peuvent précommander des pains à retirer le samedi grâce à un formulaire simple : nom, téléphone, ce qu'ils souhaitent et une heure de retrait. Pages : accueil, notre pain, précommandes, nous rendre visite avec les horaires d'ouverture et le plan d'accès, et une courte histoire sur nous deux. Un ton chaleureux et direct. Crème et vert profond, de grandes photos de pain, sincères. Pourquoi un formulaire et pas une boutique Sam demande des précommandes par un formulaire, et non un paiement en ligne, parce qu'il veut commencer simplement : le client paie au comptoir. Pour encaisser en ligne plus tard, il connecterait son propre processeur de paiement sous **Settings**, **Payments** et le demanderait dans une modification. Laisser désactivées les étapes d'approbation à 50 crédits **Approve the words before building**, **Choose the look from three directions** et **Choose the hero from four wireframes** mettent chacun la création en pause jusqu'à votre décision. Poursuivre après l'une d'elles réserve de nouveau jusqu'à 50 crédits, ou ce que votre solde contient jusqu'à 5, et chaque partie est facturée selon son travail. Avec 50 crédits, une création comportant plusieurs arrêts peut faire baisser votre solde ; voir [approuver au fil de la création](https://briks.dev/fr/docs/approval-steps). ## Deuxième étape : répondez aux questions Le projet s'ouvre sur son onglet **Studio**, avec la conversation à gauche et l'aperçu à droite. Avant de planifier quoi que ce soit, Briks prépare quelques questions ; l'étiquette au-dessus de l'aperçu indique « Waiting for your answers ». Le détail complet se trouve dans [questions avant la création](https://briks.dev/fr/docs/questions-before-building). 1. Cochez les pages Où : Studio Briks suggère des pages à partir de votre brief. **Home** est marquée **Always**. Cochez ou décochez les autres, et ajoutez les vôtres dans le champ « Add a page, for example Careers ». Un site peut démarrer avec jusqu'à 10 pages, et chaque page cochée est construite en entier. 2. Répondez aux autres questions Où : Studio Chacune propose un choix marqué **Recommended**, déjà sélectionné. Modifiez ceux qui ne conviennent pas, ou choisissez **Something else** pour écrire votre propre réponse. 3. Envoyer vos réponses Où : Studio Appuyez sur **Continue**. **Decide for me** prend à la place toutes les réponses recommandées. Vous pouvez aussi saisir vos réponses avec vos propres mots dans la zone sous la conversation. Ce que Sam a choisi > Sam a gardé Home, Our bread, Pre-orders, Visit us et Our story, et a ajouté `Wholesale` pour les trois cafés qu'il fournit. Une question portait sur la façon de prendre les précommandes ; il a gardé la réponse recommandée. Six pages, puis Continue. La création a démarré aussitôt. ## Étape trois : regardez-le se construire La conversation montre chaque étape au fur et à mesure, comme **Planning the site and its pictures**, **Designing and building**, **Verifying build** et **Publishing**. La première version prend quelques minutes. Vous pouvez quitter la page pendant ce temps : la création continue et le résultat vous attend à votre retour. [Suivre une création](https://briks.dev/fr/docs/watching-a-build) explique chaque étape. Quand le site est publié, l'aperçu se remplit et l'étiquette au-dessus devient **Live preview**. Les boutons au-dessus de l'aperçu permettent de le voir en largeur ordinateur, tablette et téléphone, de le recharger, de l'ouvrir en plein écran, ou de l'ouvrir dans un nouvel onglet à sa propre adresse pour parcourir toutes les pages comme un visiteur. Vous avez changé d'avis en cours de création ? **Stop** arrête une génération en cours avant sa publication, et le site reste tel qu'il était. Vous n'êtes facturé que pour le travail effectué jusqu'à l'arrêt. Si une construction attend des crédits Sur les sites suivants, ou avec un forfait payant, une création dont la suite demande généralement plus de crédits que vous n'en avez s'arrête une fois planifiée. La conversation indique **Waiting for credits**, avec l'estimation et ce que vous avez, et le plan est conservé. Appuyez sur **Get credits**, puis sur **Resume building** une fois vos crédits obtenus ; elle ne reprend jamais d'elle-même. Voir [crédits et forfaits](https://briks.dev/fr/docs/credits-and-plans). ## Étape quatre : ouvrir l'aperçu La première publication est un aperçu à une adresse formée à partir du nom du projet, ici `larder-lane.briks.live`. Si ce nom est pris, quelques caractères sont ajoutés à la fin. Un Owner ou un Admin peut la changer plus tard ; voir [l'adresse de votre site](https://briks.dev/fr/docs/site-address). Un aperçu est un vrai site, fonctionnel, que toute personne disposant de l'adresse peut ouvrir. Il diffère de la production sur deux points : on demande aux moteurs de recherche de l'ignorer, et les messages envoyés par ses formulaires sont conservés dans le studio mais ne vous sont pas envoyés par e-mail. - Lisez chaque page sur votre propre téléphone, et pas seulement dans le volet d'aperçu. - Ouvrez le menu et vérifiez que chaque page cochée y figure. - Envoyez une précommande de test par le formulaire, puis retrouvez-la dans **Forms** du projet. Où 1. Projects 2. Larder Lane 3. Settings 4. Forms ## Étape cinq : faire une modification Sam remarque que les horaires d'ouverture sont placés trop bas sur la page Visit us, et que la photo de la page d'accueil montre des croissants alors qu'il est connu pour son pain au levain. Il écrit un seul message dans la zone sous la conversation, celle qui indique « Change the hero, add a page, adjust the colours… ». 1. Rédigez la modification Où : Studio Dites quoi changer et où, avec des mots simples. Un message peut contenir plusieurs modifications liées, jusqu'à 6,000 caractères, avec jusqu'à six images ou vidéos jointes. 2. Décider à partir d'une vérification Où : Studio Sous la zone de saisie, **Check the site after this change** examine le site publié à quatre tailles d'écran et répare ce qui s'affiche de travers. Cela ajoute quelques minutes et quelques crédits, alors laissez-le désactivé pour les petites modifications comme celle-ci. 3. Envoyer Où : Studio Appuyez sur le bouton d'envoi, **Send**. Une modification bloque 5 crédits pendant son exécution. Si une création est déjà en cours, le bouton devient **Queue** : le message attend et s'exécute quand cette création se termine. La modification de Sam > Sur Visit us, mets les horaires d'ouverture en haut, en gros caractères : du mercredi au samedi, de 8 h à 14 h. Sur la page d'accueil, remplace la grande photo par un gros plan de miches au levain sur une planche en bois. Briks a créé la modification et l'a publiée à la même adresse, et l'aperçu s'est rechargé. La version précédente est restée dans les versions du projet au cas où Sam voudrait la retrouver. Astuce Si vous tapez une question plutôt qu'une modification, comme « quelles pages ont un formulaire ? », vous obtenez une réponse dans la conversation, sans création et sans rien bloquer. Voir [poser des questions](https://briks.dev/fr/docs/asking-questions) et [faire des modifications](https://briks.dev/fr/docs/making-changes). ## Étape six : publier en production La production rend le site entièrement public : les moteurs de recherche peuvent le référencer, et les messages de ses formulaires vous sont envoyés par e-mail. 1. Appuyez sur Publish Où : Top bar Une fois un site publié, la barre du haut affiche **Preview** et un bouton **Publish**. Appuyez dessus. 2. Lisez la boîte de dialogue Où : Publish to production Elle explique ce qui change. Briks vérifie d'abord le site, liens compris, et si quelque chose doit être corrigé, rien ne change et le studio vous dit quoi. 3. Confirmer Où : Publish to production Appuyez sur **Publish to production**. Une fois terminé, le bouton de la barre du haut indique **In production**. Publier en production, et revenir en arrière avec **Back to preview**, ne consomme aucun crédit. Une fois le site en production, chaque modification que vous envoyez y est aussi publiée. Plus de détails dans [publier en production](https://briks.dev/fr/docs/publish-to-production). ## Étape sept : votre propre domaine Avec l'offre Free, le site reste à son adresse `briks.live`, qui fonctionne aussi en production. Connecter votre propre domaine, comme `larderlane.co.uk`, commence avec l'offre Starter. Où 1. Projects 2. Larder Lane 3. Settings 4. Domain Vous y saisissez le domaine sous **Your domain** et vous appuyez sur **Connect domain**. Ensuite, vous ajoutez trois enregistrements chez l'entreprise où vous avez acheté le domaine. Les enregistrements sont de courts réglages qui indiquent à internet où pointe votre domaine : ici un enregistrement A, un CNAME pour `www` pointant vers `edge.briks.live`, et un enregistrement TXT nommé `_briks` qui prouve que le domaine est à vous. Briks les revérifie toutes les 2 minutes et émet pour vous le certificat de sécurité. [Connecter votre domaine](https://briks.dev/fr/docs/custom-domains) vous guide pas à pas. ## En cas de problème ### La création a échoué. Ai-je été débité ? Non. Une demande qui échoue n'est pas facturée, et sa réserve retourne sur votre solde. Le projet affiche **Needs attention** ; lisez le dernier message de la conversation, puis envoyez votre message suivant pour continuer. ### Je n'ai pas assez de crédits pour une modification. Le studio indique ce que contient la modification et quel est votre solde, et rien ne démarre. Une modification qui ajoute des pages peut aussi être refusée quand elle demande habituellement plus que ce que vous avez, avec l'estimation. Votre site reste en ligne. Un Owner peut passer à un plan avec plus de crédits depuis la fenêtre qui s'ouvre, ou depuis **Billing**. Voir [crédits et plans](https://briks.dev/fr/docs/credits-and-plans). ### Puis-je créer un deuxième site avec Free ? Non. Le plan Free inclut 1 projet. Pro et les plans supérieurs en incluent davantage ; voir le tableau des plans dans [crédits et plans](https://briks.dev/fr/docs/credits-and-plans). ### Quelqu'un d'autre doit le voir avant la mise en ligne. Envoyez-leur l'adresse de l'aperçu. Ils n'ont pas besoin de compte. Voir [partager un aperçu](https://briks.dev/fr/docs/sharing-a-preview). ## À lire ensuite - [Génération en cours **Démarrer un nouveau projet** Chaque choix de la page Nouveau projet, pas à pas : type de projet, brief, site que vous aimez, marque, images, options de création et coût du départ.](https://briks.dev/fr/docs/new-project) - [Génération en cours **Bien rédiger son brief** Que mettre dans un brief pour réussir la première version : activité, public, pages, action principale, faits et ton, avec six exemples avant et après.](https://briks.dev/fr/docs/writing-a-brief) - [Travailler sur un projet **Faire des modifications** Modifiez votre site en écrivant à Briks : que dire, ajouter des images, contenu et coût d'un changement, pages internes, demandes en file et corriger un raté.](https://briks.dev/fr/docs/making-changes) - [Publication et domaines **Publier en production** Passez un site Briks de l'aperçu à la production : ce que lit la vérification, ce qui bloque un lancement, comment corriger chaque point et revenir à l'aperçu.](https://briks.dev/fr/docs/publish-to-production) Toujours bloqué ? Écrivez à [hello@briks.dev](mailto:hello@briks.dev) en indiquant le nom de votre projet et ce que vous espériez voir. Une capture d'écran aide.