Code HTML pour site web
Du prompt à la landing page publiable.
Une vraie page web en quinze minutes, sans toucher au code.
Cinq blocs incontournables
Bloc d'accroche
Titre fort, sous-titre clair, bouton d'action. La première seconde décide si le visiteur reste.
Trois bénéfices clés
Pas dix. Trois. Le visiteur scanne, il ne lit pas. Format icône + titre court + une phrase.
Témoignages ou logos
Citation client, étoiles, logo de référence. Pour rassurer celui qui hésite.
Objections anticipées
Les 3-4 questions que tout le monde se pose avant d'acheter. Réponses courtes, directes.
Appel à l'action final
Bloc dédié, contraste fort. Une seule action proposée — pas trois.
Un prompt structuré par bloc
Contexte
« Je suis [métier], pour [cible], qui propose [offre]. La landing doit servir à [objectif]. »
Consigne
« Crée une landing page complète en HTML/CSS, single-page, responsive, sans framework. »
Données
« Brand colors : terracotta #a8472a et crème #faf7f2. Témoignages : [coller 2-3 vrais témoignages]. »
Format
« Cinq blocs : hero, valeur, preuve, FAQ, CTA. Style sobre, espacé, typographie serif pour les titres. »
Le prompt complet
Contexte + consigne + données + format. Une fois pour toutes.
Première version
Claude génère la landing entière en un artefact. Rendu immédiat dans le panneau.
Premier zoom
Voir le hero, les bénéfices, la preuve sociale.
FAQ et CTA
Scroll dans le panneau pour vérifier les sections du bas.
Cinq retouches typiques
« Rends les boutons plus contrastés »
Claude ajuste sans tout réécrire. Itération rapide.
« Plus d'espace entre les sections »
Le respiratoire change radicalement la perception de qualité.
« Vérifie le rendu mobile »
Claude ajoute les media queries manquantes. Toujours tester sur petit écran.
« Le sous-titre est trop long, fais 15 mots max »
L'écrit pour le web n'est pas l'écrit pour le print. Plus court, plus direct.
Du panneau au monde entier
Bouton Publish
En haut à droite du panneau d'artefact. Un clic, un lien public est généré.
URL partageable
Format claude.site/p/abc123. Vous pouvez l'envoyer en SMS, par mail, l'afficher sur LinkedIn.
Pas de maintenance
Anthropic héberge, met à jour, sécurise. Vous payez zéro et n'avez rien à administrer.
Limites à connaître
Pas de domaine personnalisé, pas de base de données, pas d'authentification. Pour ça : exportez le HTML et hébergez ailleurs.
Pour aller plus loin
Téléchargez l'HTML, déposez-le sur Netlify, Vercel, ou un FTP classique. Hébergement gratuit ou à 5€/mois.
Bon réflexe
Avant Publish, vérifiez qu'aucune donnée sensible n'est dans la page — adresses, téléphones perso, informations clients.