Faire un vrai site avec Claude Design : mode d'emploi

Peut‑on faire un vrai site avec Claude Design ?

Claude Design crée des maquettes et des prototypes de pages, pas un site en ligne : les pages officielles consultées d’Anthropic ne mentionnent ni hébergement, ni nom de domaine, ni gestion des formulaires. Pour un site public, il faut exporter le résultat, le faire transformer en vrai site, puis l’installer chez un hébergeur.

Ce tutoriel s’adresse à un dirigeant qui a une maquette réussie et veut un site visible sur Google. Voici le chemin, étape par étape.

Prérequis

• Un compte Claude, dont la formule se vérifie à l’étape 1.
• Une maquette terminée, avec les vrais textes et les vraies images.
• Un budget pour l’hébergement (l’endroit où vit votre site) et pour le nom de domaine (l’adresse de votre site, par exemple monentreprise.fr).
• Les informations légales de votre entreprise : raison sociale, adresse, numéro d’immatriculation.
• Claude Code (l’assistant de programmation d’Anthropic) ou une personne qui sait mettre un site en ligne.

Étape 1 : Quel accès à Claude Design selon la formule Claude ?

L’accès dépend de votre formule, et les sources ne s’accordent pas : vérifiez dans votre propre compte avant de prévoir quoi que ce soit.

• Au lancement, le 17 avril 2026, l’outil était en préversion de recherche sur les formules Pro, Max, Team et Enterprise source : @claudeai, 2026.
• Depuis le 16 septembre 2026, on peut demander un design dans n’importe quelle conversation. Les notes de version indiquent une disponibilité sur toutes les formules, Free comprise, avec une bêta pour Enterprise source : Claude Help Center, 2026.
• Un site tiers, Agence Scroll, décrit au contraire une bêta réservée aux formules payantes source : Agence Scroll, 2026.

Les limites d’usage sont partagées avec le chat et Claude Code source : Engadget, 2026. Chaque design consomme donc votre quota habituel.

Étape 2 : Comment exporter une maquette Claude Design ?

Claude Design propose plusieurs exports : partage par adresse interne à l’organisation, dossier, Canva, PDF, PPTX et fichier HTML autonome source : Anthropic, 2026. La page produit ajoute la transmission vers Claude Code et des connecteurs comme Vercel, Wix ou Lovable source : claude.com, 2026.

Le HTML est le langage de base des pages web : un fichier HTML autonome contient une page complète que n’importe quel navigateur sait afficher.

Étape 3 : Comment transformer l’export en site avec Claude Code ?

La transmission vers Claude Code est la voie la plus solide : Claude Design empaquette la maquette dans un « handoff bundle », que Claude Code transforme en code de production avec une seule instruction source : Anthropic, 2026.

Le handoff désigne cette transmission d’une maquette à l’outil de programmation, qui évite de repartir de zéro.

Dans votre instruction, précisez trois choses :

1. Le chemin du projet sur votre ordinateur.
2. Le framework voulu (la boîte à outils de code, par exemple Astro ou Next.js).
3. L’endroit où le site sera publié.

Un blog non officiel recommande aussi de nommer les composants, leurs états et les contraintes, ce qui se vérifie facilement en pratique. Le détail de la mise en ligne par le code est dans notre guide site vitrine avec Claude Code jusqu’à Vercel. Pour débuter l’outil, voyez le guide du premier projet Claude Code.

Étape 4 : Que faut‑il ajouter pour mettre un site Claude Design en ligne ?

Il faut ajouter cinq éléments que la maquette ne contient pas : hébergement, domaine, formulaires, référencement et mentions légales. Un export de page est généralement un site statique, c’est‑à‑dire un ensemble de fichiers sans base de données ni logique d’envoi.

Un formulaire collecte des données personnelles : prévoyez une phrase de consentement et une durée de conservation.

Étape 5 : Comment tester le site avant de le publier ?

Testez le site sur téléphone et sur ordinateur avant d’y relier votre nom de domaine. Cliquez sur chaque lien, envoyez un message de test par chaque formulaire et vérifiez que vous le recevez. Contrôlez aussi que les images se chargent vite. La liste complète figure dans la check‑list avant mise en ligne d’une appli faite avec l’IA.

Pièges courants

• Confondre partage et publication. Le lien de partage de Claude Design est interne à l’organisation : ce n’est pas un site public.
• Garder des textes provisoires. Une maquette contient souvent des textes d’exemple, qui finissent en ligne si personne ne les relit.
• Oublier les formulaires. Ils s’affichent correctement dans la maquette, mais n’envoient rien tant qu’un service d’envoi n’est pas branché.
• Négliger le mobile. Vérifiez l’affichage sur téléphone à la main, sans supposer qu’il est bon.
• Croire un blog plutôt que son compte. Les accès par formule ont changé en 2026 : seule la page de votre compte fait foi.
• Sauter l’hébergement et le suivi. Quelqu’un doit gérer les mises à jour et les pannes après la mise en ligne, voir ce que doit contenir un forfait de maintenance.

Claude Design livre la maquette, et le site public se construit après : un hébergeur, un domaine, des formulaires qui fonctionnent, du référencement et des mentions légales.