Créer un site web professionnel avec Claude Code, sans coder
Un site rapide, propre et bien référencé, en ligne en une matinée. Pas de CMS à maintenir, pas d'abonnement agence, pas une ligne de code à écrire vous-même. Vous préparez vos ressources en discutant avec Claude, Claude Code construit le site à partir d'elles, vous validez à l'écran.
Mis à jour le
Dernière mise à jour : juin 2026
La preuve avant la méthode : ce site
refonte-up.fr a été construit intégralement avec Claude Code. Aucun WordPress, aucun thème acheté, aucun développeur embauché. Et ce ne sont pas des promesses, ce sont les scores réels de cette page, testés sur Google PageSpeed Insights en mobile :
| Critère | refonte-up.fr (PageSpeed mobile) |
|---|---|
| Score Performance | 98/100 |
| Score SEO | 100/100 |
| Score Accessibilité | 100/100 |
| Affichage du premier contenu | 1,0 seconde |
| Stabilité visuelle (CLS) | 0, parfait |
| Coût d'hébergement | 0 euro par mois |
| Maintenance technique | Aucune, le site est statique |
| Propriété | 100% à moi, code et contenu |
Vous êtes en train de regarder le résultat. Naviguez, testez la vitesse, ouvrez le site sur votre téléphone. C'est ce niveau de qualité que la méthode produit.
Vous voulez un site, et chaque option coince
Aujourd'hui, pour avoir un site professionnel, vous avez le choix entre trois chemins, et chacun a son défaut.
Passer par une agence : comptez 1 500 à 5 000 euros, puis une facture de maintenance tous les mois. Le moindre changement d'horaire ou de texte passe par un prestataire que vous devez relancer et payer.
Prendre un abonnement mensuel tout compris : vous payez chaque mois pour un site que vous ne possédez pas, sur un engagement dont vous ne sortez pas facilement. Le jour où vous arrêtez, vous repartez les mains vides.
Le faire vous-même avec un outil grand public : c'est rapide et pas cher, mais le résultat se voit, et le site reste invisible sur Google.
Il existe une quatrième voie. Un site que vous possédez à 100%, de qualité professionnelle, sans loyer mensuel et sans dépendre de personne pour le modifier. C'est tout l'objet de cette page.
Les 5 niveaux d'usage de Claude : où vous êtes, où on va
Claude n'est pas un seul outil. C'est une échelle à 5 niveaux, et la plupart des gens restent bloqués au premier sans le savoir. Créer votre site vous fait grimper jusqu'au niveau 4, avec un objectif concret.
Niveau 1 : le chat
L'usage de base sur claude.ai. Une question, une réponse. Pas de mémoire structurée, pas de fichiers, pas d'outils. C'est là que reste la majorité des utilisateurs.
Niveau 2 : les Projets
Vous ajoutez des rails : instructions personnalisées, fichiers de référence attachés au projet, une conversation par sujet. Le point clé : vos décisions vivent dans des fichiers réutilisables, pas dans l'historique du chat.
Niveau 3 : Cowork
Claude agit. Il se connecte à vos outils (emails, fichiers, agenda) et produit des livrables. On passe de « Claude qui répond » à « Claude qui fait ».
Niveau 4 : Claude Code
Claude développe. Il lit un fichier de consignes, écrit du vrai code, le teste, le met en ligne. C'est le niveau de cette méthode, et vous n'avez pas besoin de savoir coder pour l'utiliser : c'est lui qui code.
Niveau 5 : API et agents autonomes
Vous programmez Claude. Des automatisations qui tournent sans vous. Hors sujet pour un site vitrine, mais c'est le sommet de l'échelle.
La règle qui change tout
Chaque niveau suppose le précédent maîtrisé. Quelqu'un qui n'a jamais structuré un Projet (niveau 2) galère en Claude Code, parce qu'il ne sait pas mettre son contexte dans des fichiers. C'est la cause numéro 1 d'abandon, et c'est exactement ce que le coaching court-circuite : on grimpe les niveaux ensemble, dans l'ordre, en construisant votre site.
Le stack complet : exactement celui de ce site
Pas de jargon, et rien d'inventé : c'est le stack qui fait tourner refonte-up.fr. Les noms techniques peuvent impressionner, mais retenez ceci : c'est Claude Code qui s'en occupe. Vous n'y touchez jamais directement.
Claude Code : celui qui construit le site
Claude Code est un assistant IA d'Anthropic qui s'installe sur votre ordinateur. Vous lui parlez en français, il écrit le code pour vous. Inclus dans l'abonnement Claude Pro, environ 20 euros par mois. C'est la seule dépense mensuelle de toute la méthode.
Un skill de design : le goût du beau en plus
Claude Code code proprement, mais un skill de design comme UX UI Pro Max lui donne en plus le sens de l'esthétique : hiérarchie claire, espacements justes, couleurs cohérentes, composants soignés. C'est ce qui sépare un site qui fait amateur d'un site qui inspire confiance. Il s'ajoute à Claude et guide chaque choix visuel. C'est ce skill qui a dessiné la page que vous lisez. Gratuit.
Télécharger le skill UX UI Pro MaxNext.js, le moteur du site (géré par Claude Code)
Next.js est l'outil qui produit le site, le même que les grandes entreprises utilisent. Configuré en « site statique », il génère des pages ultra-rapides qui ne demandent aucune maintenance. C'est ce qui donne le score de 98/100 en performance que vous avez vu plus haut. Vous n'avez pas à comprendre Next.js : Claude Code l'installe et l'utilise pour vous. Gratuit, c'est un logiciel libre.
GitHub : celui qui garde votre site en mémoire
GitHub stocke les fichiers de votre site et garde l'historique de chaque modification. Si une mise à jour casse quelque chose, vous revenez en arrière en un clic. Gratuit.
Cloudflare Pages : celui qui met le site en ligne
Cloudflare Pages héberge votre site et le distribue depuis des serveurs partout dans le monde. Votre site charge vite à Versailles comme à Marseille. À chaque modification, il se met à jour en ligne automatiquement. Gratuit, sans limite de trafic pour un site vitrine.
Un nom de domaine : votre adresse
votreentreprise.fr, réservé chez un registrar comme OVH ou Cloudflare. Entre 8 et 15 euros par an. C'est la seule chose que vous payez à l'année.
Web3Forms : votre formulaire de contact
Un site vitrine a besoin d'un formulaire qui envoie les demandes sur votre email. Web3Forms le fait sans serveur et sans base de données. Gratuit.
| Outil | Rôle | Coût |
|---|---|---|
| Claude Code (abonnement Claude Pro) | Construit et modifie le site | env. 20 euros/mois |
| Skill de design (UX UI Pro Max) | Rendu visuel professionnel | Gratuit |
| Next.js (géré par Claude Code) | Moteur du site, pages rapides | Gratuit |
| GitHub | Sauvegarde et historique | Gratuit |
| Cloudflare Pages | Hébergement et mise en ligne | Gratuit |
| Nom de domaine | Votre adresse web | 8 à 15 euros/an |
| Web3Forms | Formulaire de contact | Gratuit |
Total : environ 20 euros par mois, plus une dizaine d'euros par an. Et le jour où le site est terminé et que vous n'avez plus de modifications à faire, vous pouvez couper l'abonnement Claude. Le site reste en ligne, gratuitement.
La méthode en 5 étapes : du chat au site en ligne
La méthode suit l'échelle des 5 niveaux. Vous posez les bases dans le chat avec un projet dédié, Cowork produit les textes et les ressources, Claude Code code le site. Chaque étape inclut un prompt prêt à copier. Adaptez les crochets, collez, c'est parti.
L'astuce qui fait tout tenir : les ressources. Claude ne code jamais de tête. Chaque décision (vos couleurs, vos textes, vos règles) vit dans un fichier que Claude relit avant de travailler. C'est ce qui sépare un site IA bricolé d'un site professionnel. La page que vous lisez a été produite exactement comme ça : contenu validé dans des fichiers, design system dans un fichier, règles dans un CLAUDE.md, et Claude Code qui assemble.
Étape 1 : Le chat : poser les fondations et créer un projet dédié (1 heure)
Tout commence sur claude.ai, en conversation simple. Vous définissez votre positionnement, vos pages, vos messages. Et surtout : vous faites écrire chaque décision dans un fichier téléchargeable. L'historique du chat se perd, les fichiers restent. Créez aussi un projet dédié dans le chat : c'est là que vivront toutes vos ressources, réutilisables d'une conversation à l'autre.
Tu vas m'aider à préparer le site web de mon entreprise.
Mon activité : [plombier, avocat, dentiste]
Ma zone : [ville et département]
Mes clients : [particuliers, entreprises, les deux]
Mon objectif numéro 1 : [recevoir des appels / des demandes de devis]
Pose-moi 10 questions, une par une, pour clarifier mon positionnement
et la liste de mes pages. À la fin, écris toutes nos décisions dans
un fichier positionnement.md que je peux télécharger.Étape 2 : Cowork : produire les textes et les ressources (2 à 3 heures)
Sur Cowork, Claude écrit les textes et abat les tâches fastidieuses : à partir de votre projet, il produit tout ce dont le site aura besoin, le design system (couleurs, typographie, espacements), le logo, les images, et le texte de chaque page. Un fichier par livrable. À la fin de cette étape, votre site existe déjà entièrement, sauf le code. C'est ici que le skill de design entre en jeu : activez un skill comme UX UI Pro Max pour que votre design system ait un vrai niveau professionnel dès le départ.
Lis le fichier positionnement.md attaché à ce projet.
On va produire les ressources du site, un fichier à la fois :
1. design-tokens.md : propose-moi 3 directions de design
(couleurs, typographie) adaptées à mon métier, je choisis.
2. Un fichier contenu-[page].md par page, avec titres,
textes complets et appels à l'action.
3. Si tu as ajouté ma base SEO/GEO au projet (voir plus bas),
utilise-la pour que chaque page soit pensée pour le
référencement dès l'écriture.
Ne passe jamais au fichier suivant sans ma validation.Si vous avez téléchargé la base de connaissances SEO/GEO (section bonus ci-dessous), ajoutez-la à votre Projet dès cette étape. Elle devient une ressource comme les autres : Claude s'en sert pour que vos textes et la structure de vos pages soient pensés pour Google et les moteurs IA, pas seulement pour faire joli.
Étape 3 : Claude Code : coder le site à partir des ressources (1 heure max)
C'est l'étape la plus rapide, parce que tout le travail est déjà fait. Quand vos ressources sont prêtes, Claude Code n'a plus qu'à assembler : il code le site en moins d'une heure. Vous installez Claude Code une fois (comptez 30 minutes, demandez au chat de vous guider pas à pas si besoin), puis vous rattachez votre projet à Claude Code : vous placez le dossier de ressources sur votre ordinateur et vous lancez Claude Code dedans, pour qu'il ait tout le contexte avant de coder. Son travail : assembler, pas inventer. Vous validez page par page dans votre navigateur et vous corrigez en français : « le titre est trop gros », « mets mes horaires dans le pied de page ».
Lis tous les fichiers du dossier ressources : positionnement.md,
design-tokens.md, base-seo-geo.md et les contenus de pages. Écris
un CLAUDE.md avec les règles du projet, puis code un site vitrine
avec Next.js en export statique, pensé mobile d'abord, rapide à
charger. Respecte exactement les textes, le design system et les
règles SEO des fichiers : tu assembles, tu ne réécris rien.
Montre-moi chaque page dans le navigateur avant de passer
à la suivante.Étape 4 : Mettre en ligne (30 minutes)
Deux comptes gratuits à créer avant de lancer le prompt, deux minutes chacun : un sur github.com (où vivent les fichiers de votre site) et un sur cloudflare.com (qui héberge et publie). Vous n'avez rien à configurer vous-même, vous créez juste les comptes. Claude Code se charge de tout connecter.
Ensuite, Claude Code envoie le site sur GitHub, Cloudflare Pages le détecte et le publie. Vous branchez votre nom de domaine. Votre site est en ligne, en HTTPS, accessible dans le monde entier.
J'ai créé mes comptes GitHub et Cloudflare. Aide-moi à mettre
le site en ligne : crée le dépôt GitHub, connecte-le à Cloudflare
Pages, puis guide-moi pour brancher mon nom de domaine. Une étape
à la fois, et vérifie chaque étape avec moi.Étape 5 : Modifier votre site à vie, en français
C'est la vraie différence avec une agence. Un nouveau service, un changement d'horaires, une photo à remplacer : vous ouvrez Claude Code, vous demandez la modification, elle est en ligne deux minutes plus tard. Et grâce aux ressources, le site reste cohérent : Claude relit vos fichiers avant chaque modification.
Relis le CLAUDE.md et le design system. Sur la page [services],
remplace [ancien texte] par [nouveau texte], puis mets le site
à jour en ligne.Bonus : la base de connaissances SEO et GEO à donner à Claude
Un site en ligne n'est pas un site visible. Pour que Claude construise des pages qui ont une chance de ranker, il lui faut une ressource de plus : une base de connaissances en référencement.
J'ai compilé la mienne : les principes SEO, GEO (être cité par ChatGPT et Perplexity) et référencement local que j'applique sur les sites de mes clients, à jour des dernières évolutions de l'algorithme Google (2026). Vous la téléchargez, vous l'ajoutez à votre dossier ressources, et Claude adapte le référencement à votre métier et votre ville.
Lis le fichier base-seo-geo.md. Adapte le référencement de mon site :
balises de chaque page, structure des titres, données structurées,
maillage entre les pages. Mon métier et ma zone sont dans
positionnement.md. Explique-moi chaque choix en une phrase.Ce que ça coûte vs une agence ou un abonnement
| Méthode Claude Code | Agence classique | Abonnement mensuel | |
|---|---|---|---|
| Création | 0 euro (votre matinée) | 1 500 à 5 000 euros | Inclus, mais site templatisé |
| Coût mensuel | env. 20 euros (résiliable) | Maintenance 50 à 150 euros/mois | Souvent plusieurs centaines d'euros/mois |
| Engagement | Aucun | Variable | Longue durée, sortie difficile |
| Le site vous appartient | Oui, totalement | Selon contrat | Non, en général |
| Modifications | Vous-même, en 2 minutes | Sur devis, sous délai | Limitées, via leur support |
Le calcul est simple. Sur 3 ans, la méthode Claude Code coûte moins de 800 euros en tout. Un abonnement à 300 euros par mois sur la même durée coûte 10 800 euros, pour un site que vous ne possédez pas.
Vous préférez ne pas tâtonner ? Je vous installe tout et je vous forme en une session.
Soyons honnêtes : ce que la méthode demande
Zéro promesse intenable sur cette page. La méthode fonctionne, mais :
- L'étape d'installation peut frustrer si vous n'êtes pas à l'aise avec Claude. C'est 30 minutes pour quelqu'un d'habitué, parfois une soirée entière pour quelqu'un qui ne l'est pas.
- La qualité du site dépend de la qualité de vos demandes. Claude Code exécute bien, mais il faut savoir quoi lui demander : structure des pages, textes qui vendent, bases du référencement.
- Un site en ligne n'est pas un site visible. Le référencement Google est un travail à part entière.
C'est exactement pour ces trois points que je propose un accompagnement.
Vous bloquez ? Je vous installe tout et je vous apprends à gérer
Si l'installation vous freine ou si vous voulez un résultat professionnel sans tâtonner, je propose une session de coaching individuelle :
- Installation complète du stack sur votre ordinateur (Claude Code, GitHub, Cloudflare, domaine)
- Construction de votre site avec vous, en direct
- Formation à la gestion : vous repartez capable de modifier votre site seul avec Claude Code
À la fin de la session, votre site est en ligne et vous êtes autonome.
« J'ai eu le plaisir de collaborer avec Cherif sur un sujet de formation Claude et WordPress. J'ai particulièrement apprécié sa pédagogie, son professionnalisme et sa disponibilité. Il a su bien comprendre ma problématique et m'apporter une solution adaptée avec beaucoup de justesse. Son accompagnement m'a donné de la confiance et une vraie clarté dans la manière d'aborder et de structurer mes projets dans Claude. Je le recommande vivement. »
FAQ
Non. Vous dialoguez en français, Claude Code écrit le code. Savoir décrire précisément ce que vous voulez est plus utile que savoir programmer.
Le secret, c'est que le code est l'étape la plus courte : moins d'une heure avec Claude Code, parce que tout est déjà préparé. Le vrai travail est en amont : 3 à 4 heures de préparation des ressources (positionnement, design, textes) dans le chat et le Projet. Ajoutez 30 minutes à une soirée pour installer Claude Code la première fois, selon votre aisance avec l'informatique. Au total, une matinée de bout en bout pour un site vitrine de 4 à 6 pages.
Environ 20 euros par mois pour l'abonnement Claude Pro, plus 8 à 15 euros par an pour le nom de domaine. Hébergement, sauvegarde et formulaire de contact sont gratuits. L'abonnement Claude est résiliable dès que le site ne bouge plus.
Oui. Le code est sur votre compte GitHub, le domaine est à votre nom, l'hébergement est sur votre compte Cloudflare. Personne ne peut vous couper votre site ou vous facturer pour le récupérer.
WordPress demande de la maintenance permanente (mises à jour, sécurité, plugins). Wix vous loue un site qui ne vous appartient pas et que vous ne pouvez pas déménager. Un site statique construit avec Claude Code est plus rapide, sans maintenance, et totalement à vous.
GitHub garde l'historique complet de votre site. Chaque modification peut être annulée. Vous ne pouvez pas casser votre site de façon irréversible.
La méthode produit un site techniquement propre, ce qui est la base. Mais ranker sur Google demande un travail de contenu et de référencement local spécifique. C'est mon métier : on en parle en session de coaching.
Cherif · Freelance web design, SEO et GEO
Basé à Saint-Quentin-en-Yvelines (78). Je construis des sites rapides et bien référencés avec Claude Code, et j'accompagne des indépendants et des artisans pour leur visibilité Google et IA. Ex-applied geophysics, formé en communication digitale chez Studi.
Prêt à mettre votre site en ligne sans tâtonner ?
Une session, votre site en ligne, et vous repartez autonome pour le gérer avec Claude Code.
Réserver une session de coaching