DE LA PAGE BLANCHE
À TON SITE EN LIGNE.

As-tu déjà un hébergement web quelque part ?

Pas un nom de domaine. Pas un compte chez un hébergeur. Un hébergement web, celui qui te donne un gestionnaire de fichiers.

1. Connecte-toi chez ton hébergeur
2. Regarde le menu de gauche
3. Cherche les mots Fichiers, Gestionnaire de fichiers, ou FTP

Beaucoup de débutantes perdent une soirée sur cette question. Elle se tranche en une phrase.

Veux-tu modifier ton site toi-même, plusieurs fois par semaine, sans passer par personne ?

Le créateur de sites n’est pas un mauvais outil. Il est très bien pour ce qu’il fait. Mais il ne donne accès à aucun fichier, et une IA qui ne peut pas ouvrir de fichier ne peut rien construire.

Le test tient en trente secondes.

1. Connecte-toi à hPanel chez ton hébergeur
2. Ouvre ton site, puis regarde le menu de gauche
3. Cherche une section Fichiers, ou Gestionnaire de fichiers

C’est officiel et documenté par Hostinger : le gestionnaire de fichiers est disponible pour tous les utilisateurs, sauf ceux du créateur de sites.

Concrètement, une fois l’hébergement web acheté :

• Tu peux déposer des fichiers, donc suivre ce playbook
• Tu peux aussi installer WordPress en un clic depuis hPanel, sans surcoût, si tu changes d’avis plus tard
• Tu peux même faire les deux, à des adresses différentes

Quelle formule prendre ? La formule d’entrée d’hébergement web suffit dans la très grande majorité des cas. Les formules supérieures apportent surtout des ressources et des sauvegardes automatiques, utiles quand le site grossit, pas au départ.

C’est possible, et c’est même prévu. Voici honnêtement ce que chacun apporte.

Ce qui se transfère facilement : tes textes, la structure de tes pages, ton travail de référencement.

Ce qui est à refaire : le gabarit. Une page en fichiers ne devient pas une page WordPress toute seule.

Claude Code n’existe pas en version gratuite. Le plan gratuit donne accès à la conversation, pas à Claude Code.

Commence par Pro. C’est suffisant pour tout ce playbook. Les tarifs officiels sont publiés en dollars, vérifie le montant en euros au moment de t’abonner.

Aucun terminal, aucune commande, aucun Node.js. Claude Code est inclus dans l’application de bureau.

1. Télécharge l’application Claude pour Mac ou Windows depuis claude.ai
2. Ouvre-la et connecte-toi avec le compte qui a l’abonnement Pro
3. En haut de la fenêtre, clique sur l’onglet Code
4. Clique sur Choisir un dossier et sélectionne le dossier de ton site

Sur ton bureau, crée un dossier nommé mon-site. C’est lui que tu choisiras à l’étape précédente.

Tout ce que Claude produira ira dedans. Tu n’auras jamais à chercher où sont tes fichiers.

Ouvrir Hostinger · lien de partenariat, il ne change rien à ton prix

Ton nom de domaine : court, dictable au téléphone, en .com si possible, sans tiret ni chiffre. Ton prénom et ton nom fonctionnent très bien.

Décoche tous les suppléments proposés à la commande. Aucun n’est utile le premier mois.

Elle permet à Claude de regarder ta page dans un vrai navigateur, et donc de vérifier le rendu au lieu de le supposer. Utile à l’étape 4, pas indispensable.

Ouvre l’application, onglet Code, ton dossier mon-site sélectionné, et colle ceci.

Sans consigne, tu obtiendras parfois de l’anglais. Le prompt 2 de l’étape suivante règle ça définitivement, en l’inscrivant dans ton fichier de règles.

Active-les. Certaines étapes prennent deux ou trois minutes. Avec les notifications, tu pars faire autre chose et tu reviens quand c’est prêt, au lieu de regarder l’écran.

Il permet à Claude d’aller chercher ce qui lui manque, par exemple de regarder un site dont tu t’inspires. Sans lui, il travaille de mémoire.

Un connecteur donne à Claude accès à un service extérieur. Pour un site, deux suffisent largement, et souvent zéro au début.

À savoir avant de te lancer : voir ses connecteurs se fait dans une interface, mais en ajouter un demande aujourd’hui une commande à coller. C’est la seule étape de ce playbook qui en demande une, et elle est facultative.

C’est le réflexe le plus important. Entre chaque étape, tu fermes la conversation et tu en ouvres une neuve, en joignant le fichier produit à l’étape précédente.

Une conversation qui traite les cinq étapes traîne le contexte des cinq. Elle ralentit, elle confond, et elle finit par produire n’importe quoi.

Trente secondes qui t’évitent vingt minutes de travail à jeter.

Dix ajustements d’un coup produisent dix approximations. Un ajustement, tu vérifies, tu enchaînes. C’est plus lent sur le papier, c’est beaucoup plus rapide en vrai.

1. Ouvre le Gestionnaire de fichiers de ton hébergeur
2. Entre dans le dossier de ton site, en général public_html
3. Clique sur Nouveau fichier, nomme-le exactement index.html
4. Ouvre-le, colle les quelques lignes ci-dessous, enregistre

<!doctype html>
<html lang="fr">
<head><meta charset="utf-8"><title>Bientôt ici</title></head>
<body style="font-family:system-ui;text-align:center;padding:20vh">
  <h1>Ça arrive.</h1>
  <p>Cette page est en construction.</p>
</body>
</html>

Ouvre ton adresse dans le navigateur. Si tu lis Ça arrive, le plus dur est fait.

À partir de maintenant, mettre à jour ton site tient en quatre gestes, toujours les mêmes.

1. Tu demandes tes fichiers à l’IA
2. Tu les compresses en une archive zip sur ton ordinateur
3. Tu la téléverses dans public_html et tu l’extrais
4. Tu recharges ton adresse en vidant le cache

Avant d’ouvrir Claude, mets dans ton dossier mon-site :

• Trois textes que tu as écrits toi-même. Des posts, des emails à des clientes, peu importe. C’est ce qui donnera ta voix.
• Tes photos, si tu en as
• Ton logo, si tu en as un

Trois textes de toi valent mieux que dix consignes de style. C’est la différence entre un site qui te ressemble et un site qui ressemble à une IA.

Session neuve. Colle le prompt, réponds aux questions qu’il te pose.

Session neuve. Joins ma-matiere.md.

Tu reviendras l’enrichir à chaque piège rencontré, dans la section prévue. C’est ton vrai capital, et il grossit tout seul.

Session neuve. Joins ma-matiere.md.

Regarde ta page et note ce qui cloche. Puis demande un seul ajustement, vérifie, enchaîne.

Cette vérification passe avant tout le reste. Elle évite de perdre une soirée.

Connecte-toi à hPanel et regarde la liste de tes services.

Avant de toucher à quoi que ce soit.

1. Dans le Gestionnaire de fichiers, ouvre public_html
2. Sélectionne tout ce qui s’y trouve
3. Clique sur Compresser, nomme l’archive ancien-site-AAAA-MM-JJ.zip
4. Déplace cette archive hors de public_html, un cran au-dessus

Si ton ancien site vit sur le constructeur, ne le supprime pas non plus : dépublie-le seulement. Il reste consultable et tu peux revenir en arrière.

Le gestionnaire de fichiers sait décompresser. Tu montes une archive au lieu de dizaines de fichiers un par un.

1. Toujours dans public_html, vide-le entièrement une fois ta sauvegarde faite
2. Clique sur Téléverser, choisis ton archive, attends la fin
3. Clic droit sur l’archive, puis Extraire
4. Vérifie que les fichiers sont bien directement dans public_html, pas dans un sous-dossier
5. Supprime l’archive une fois extraite

Le fichier .htaccess commence par un point, donc il est masqué par défaut. C’est lui qui donne les adresses propres, sans .html à la fin.

1. Dans le gestionnaire de fichiers, cherche le réglage Afficher les fichiers cachés et active-le
2. Vérifie que .htaccess est bien présent dans public_html

S’il manque, ton site fonctionnera quand même, mais les adresses afficheront .html et les anciennes adresses ne seront pas reprises.

Hostinger fournit une adresse temporaire pour chaque hébergement, du type quelquechose.hostingersite.com. Elle est dans hPanel, sur la page de ton hébergement.

Ouvre cette adresse et vérifie, dans l’ordre :

1. La page d’accueil s’affiche correctement
2. Le menu fonctionne, les images se chargent
3. Le rendu sur téléphone tient la route

Tant que ce test n’est pas concluant, ne touche pas au domaine. Ton ancien site reste en ligne pendant ce temps, et personne ne voit rien.

Une fois le test concluant, rattache ton domaine à l’hébergement web dans hPanel.

Puis vérifie ces quatre adresses, une par une :

• ton-domaine.com
• ton-domaine.com/une-page-quelconque (une adresse sans .html)
• ton-domaine.com/nimportequoi (doit afficher ta page d’erreur, pas celle de l’hébergeur)
• ton-domaine.com/sitemap.xml

Inscris ton site dans la Search Console de Google, gratuitement. Sans ça, il finira par te trouver, mais beaucoup plus tard.

Ouvre une fenêtre de navigation privée et tape ton adresse. C’est le seul test honnête : ton navigateur habituel te ment, il garde des versions en mémoire.

Il doit y avoir un cadenas à gauche de ton adresse, et l’adresse doit commencer par https. Sinon, cherche SSL dans ton panneau et active le certificat gratuit. C’est inclus partout aujourd’hui.

Clique sur tous les liens de ton menu, un par un. Aucun ne doit afficher une page d’erreur.

Sors ton téléphone et ouvre ton adresse. Vérifie trois choses : le texte se lit sans zoomer, rien ne dépasse sur les côtés, les boutons se touchent sans viser.

La majorité de tes visiteuses arriveront par leur téléphone. C’est le vrai format de ton site, pas ton écran d’ordinateur.

Remplis ton propre formulaire avec ta vraie adresse email, envoie, et va voir ta boîte. Vérifie aussi les indésirables.

Garde l’archive zip de ton site dans un dossier que tu retrouveras, avec la date dans le nom.

Tant que tu as cette archive, aucune erreur n’est grave : tu remets l’archive et tout revient.

Note trois choses dans un endroit sûr, ton gestionnaire de mots de passe par exemple.

• L’adresse de connexion de ton hébergeur
• Le nom du dossier où vivent tes fichiers
• L’endroit où est rangée ton archive