Comment créer avec l’IA un site d’entreprise locale optimisé qui convertit

Ça nous est tous arrivé, à nous qui créons des sites web.

On discute avec un client potentiel qui possède une entreprise locale — de celles que les clients visitent ou qui interviennent dans un rayon géographique limité — et il nous sort : « Un petit site tout simple, pour qu’on puisse m’appeler ou m’écrire sur WhatsApp. »

Tout simple. Bien sûr.

Évidemment, un site e-commerce avec des milliers de produits ou un SaaS sont bien plus complexes. Mais si une entreprise veut trouver des clients grâce à son site (en dépensant généralement peu ou rien en publicité), je peux te dire que ce n’est pas si simple que ça.

Car avant de faire quoi que ce soit, il faut comprendre les services de l’entreprise, découvrir comment ses clients les recherchent, décider des pages nécessaires, rédiger les textes, choisir les images, créer des formulaires, mesurer les leads et vérifier que tout fonctionne sur mobile.

Et si tu veux en plus le publier dans plusieurs langues, les décisions à prendre se multiplient.

J’en ai créé quelques-uns. Et tous, tous, tous, absolument tous ont dépassé leurs objectifs et généré plus de leads que prévu au départ. Je sais donc de quoi je parle.

Jusqu’à présent, j’avais ma méthode, qui incluait le marketing indispensable et que je mettais presque toujours en œuvre avec WordPress, pour des raisons évidentes.

Mais aujourd’hui, l’IA est arrivée. Elle simplifie des tâches qui prenaient autrefois un temps fou, étaient ingérables ou ne valaient tout simplement pas l’effort. Maintenant, si. C’est pourquoi mon dernier site, celui de l’entreprise de transport Rondabus, a été créé sans CMS, à l’aide d’un framework de développement, Astro, que je ne connaissais pas et que ChatGPT m’a recommandé après que je lui ai expliqué mes besoins.

Et je pense que c’était un excellent choix, puisqu’il repose sur une idée que j’ai toujours défendue : pour les sites vitrines d’entreprise, qu’on ne modifie presque jamais pendant des mois et qui ne servent pas à publier du nouveau contenu, le HTML statique présente trois avantages clairs :

1. Plus rapide.
2. Plus sûr.
3. Pas besoin d’hébergement payant.

J’entrerai dans les détails quand je parlerai de la stack technologique, au cas où ce troisième avantage t’aurait surpris.

Parce qu’avoir un site d’entreprise avec tout le nécessaire pour générer des leads (formulaire, email, téléphone et WhatsApp) en ne payant qu’environ 3 à 10 € par an pour le domaine, ça semble trop beau pour être vrai.

Et pourtant, c’est vrai.

Dans ce guide, je t’explique la démarche étape par étape pour que tu puisses la reproduire. Outre le domaine, il te suffit d’un abonnement payant à ChatGPT pour analyser, structurer, rédiger, traduire et vérifier, pendant que Codex travaille sur le code..

Bien sûr, tu peux remplacer ces outils par d’autres. Je le précise notamment si tu paies aussi Claude : l’association de ChatGPT comme analyste et de Claude comme développeur est encore meilleure.

Maintenant que les besoins sont clairs, passons aux étapes.

1. Comprends le projet et définis tout avant de commencer

Il faut d’abord que le client t’explique :

1. En quoi consiste son activité.
2. Quels services il propose.
3. À qui il s’adresse.
4. Dans quelles zones il intervient réellement.
5. Qui sont ses concurrents.
6. Ce qui le distingue d’eux.
7. Quelles preuves il peut présenter.
8. Quelles actions tu veux qu’une personne réalise en arrivant sur le site. Autrement dit, comment le canal numérique générera des affaires pour son entreprise.

En complément, il faudra définir (toi, le client ou tous les deux) :

• Le domaine.
• Les moyens de contact (téléphone, WhatsApp, email, formulaire…).
• Les langues envisagées.
• La rédaction des textes.
• Les photographies ou illustrations.
• La publication éventuelle de contenus réguliers.

L’IA et toi aurez besoin de toutes ces informations.

On distingue ici trois types de décisions :

1. Celles relatives à l’activité déterminent ce qui est vendu et à qui.
2. Celles relatives au contenu et au design déterminent ce qu’on raconte et comment on le présente.
3. Les décisions techniques déterminent comment le site est développé, publié et maintenu.

Une fois tout cela défini, consigne ces décisions dans un brief et un document d’exigences produit (PRD) avant de commencer à créer les pages. En fournissant ces documents à ChatGPT, on évite de devoir réexpliquer dans chaque conversation quel domaine utiliser, quelles pages sont validées ou d’où viennent le numéro de téléphone et l’adresse email.

La technologie importe peu à ce stade. Cette méthode fonctionne avec WordPress, Astro ou n’importe quel autre système : garde un endroit précis pour les décisions et une autre source pour les données de l’entreprise.

Livrable

Un brief court et un PRD complet, avec les validations, les décisions en suspens, les objectifs de conversion, les ressources disponibles et les responsables.

Lorsqu’une décision change, mets toi-même le PRD à jour ou demande à Codex de le faire.

2. Crée des maquettes pour choisir le design

Avant de demander à Codex de programmer quoi que ce soit, mieux vaut préparer deux ou trois propositions pour comparer les approches. Pas besoin de réaliser trois sites complets. Généralement, la page d’accueil ou une page de service pour chaque proposition suffit à se faire une idée de l’identité visuelle générale du projet.

Mais il faut aussi présenter la version mobile pour éviter les mauvaises surprises.

C’est la première chose que nous allons demander à Codex.

Pour commencer, nous explorons trois concepts pour une page de service. Clairs ou sombres, avec des couleurs ou des styles différents : choisis ce qui convient au projet, mais demande-en trois. Deux, c’est trop peu ; quatre ou cinq, ça commence à faire beaucoup.

Une fois les propositions côte à côte, vérifie si chacune contient les modules nécessaires, si les textes sont corrects (les tiens ou ceux de ChatGPT), si le numéro de téléphone ou WhatsApp est bien visible, si le formulaire ne demande que l’essentiel, si les images représentent bien le service, etc. Bref, si elle respecte les fondamentaux du CRO..

Après les itérations nécessaires pour ajuster les éléments essentiels, montre les propositions au client pour recueillir son avis et lui expliquer laquelle te paraît la meilleure des trois. Mais veille à ce que ce que tu lui montres soit aussi proche que possible du design final, et pas une simple approximation. Le client n’a pas forcément ton habitude d’abstraire un concept de site web.

Livrable

Une maquette à la direction visuelle validée, des versions ordinateur et mobile, la liste des éléments communs (en-tête, pied de page, icônes, hero avec formulaire…) et celle des détails à respecter pendant l’implémentation.

3. Fais une étude de marché de terrain

Tu n’as pas besoin d’une étude de cent pages pour définir la structure initiale d’un site local. Il te faut assez de données pour ne pas choisir les pages à l’intuition — la tienne ou, pire, celle de ton client. L’analyse comporte deux parties : la demande et la concurrence..

Analyse de la demande : que cherchent les utilisateurs, combien et où ?

La première chose à déterminer, c’est si l’offre de ton client répond à une demande existante ou s’il faut la créer. Et, surtout pour une entreprise locale, quelle est l’ampleur de cette demande dans sa zone d’intervention..

Pour cela, voici un article complet, étape par étape, sur l’étude de la demande pour l’e-commerce, mais je vais le résumer et l’adapter à un site d’entreprise locale ci-dessous.

Dresse une première liste de services avec les mots qu’utiliserait un client. Ajoute les variantes, les besoins et les précisions géographiques. Exemple tiré de mon cas :

• Location d’autobus.
• Location d’autobus à Ronda.
• Transport pour mariages.
• Bus de mariage à Ronda.
• …

Tu vois l’idée, non ?

Vérifie ensuite quelles recherches traduisent une intention de réserver, lesquelles cherchent des informations et lesquelles regroupent des services qui devraient figurer sur la même page. Par exemple, « location de bus pour mariage », « autocar pour invités de mariage » et « transport pour une célébration » répondent à un besoin semblable. Inutile de créer trois pages sous prétexte qu’il existe trois formulations. En revanche, « transport scolaire » et « transfert aéroport » impliquent des publics, des conditions et des questions suffisamment distincts pour mériter des pages séparées.

À cette première étape, pour définir la structure du site, ne retiens que les recherches à intention commerciale. Le reste pourra servir au blog, s’il y en a un un jour.

Utilise l’ outil de planification des mots clés de Google Ads pour obtenir des estimations, en délimitant la zone géographique. Cela donne une idée du trafic potentiel, sachant qu’une fourchette de recherches ne correspond pas au nombre de visites organiques que nous recevrons : seule une partie se transformera en visites. Avec un taux de conversion estimé, on pourra prévoir le nombre de leads mensuels.

Concurrence : contre qui te bats-tu ?

Là encore, voici un article où j’explique en détail comment réaliser une analyse de la concurrence en e-commerce. Il date un peu et certaines choses ont changé, mais les bases restent les mêmes.

Pour une entreprise locale, cherche comme le ferait un client depuis les zones pertinentes et note quelles entreprises apparaissent dans les résultats organiques et locaux. Examine les éléments suivants :

• Services.
• Textes, CTA et contenus.
• Structure du site.
• Couverture géographique.
• Appels à l’action.
• Moyens de contact.
• Réputation en ligne (notes sur des annuaires comme Google Maps ou Trustpilot).
• Lead magnets, s’ils en proposent (généralement non, puisqu’ils ne feront pas d’email marketing).
• Prix.

Il ne s’agit pas de copier le premier des résultats. La comparaison doit t’aider à repérer les questions sans réponse dans tes contenus, à préciser ta ou tes propositions de valeur et à déceler des opportunités auxquelles ton entreprise peut réellement répondre.

Si tu n’as pas accès aux données économiques d’un concurrent, ne les invente pas. Demande à ChatGPT, éventuellement avec Deep research..

Livrable

Deux éléments :

Un tableau des mots clés, regroupés par URL de destination provisoire (généralement l’accueil et les pages de service), zone géographique si nécessaire, priorité commerciale, concurrents visibles et conclusions. Il doit guider les décisions concernant le site, sa structure et les contenus (surtout les titres) de chaque page.

En complément, nous constituerons un document recensant toutes les bonnes idées des concurrents qui sont applicables à mon entreprise et à son site.

4. Définis la structure du site et de chaque URL à partir de la demande

Transforme maintenant ces groupes de mots clés provisoires en un véritable plan des pages. Pour chaque URL envisagée, note :

• Le besoin auquel elle répond, son public cible et le service concerné.
• L’action qu’elle doit déclencher (formulaire, clic sur le téléphone ou WhatsApp, prise de rendez-vous…).
• Les contenus nécessaires.
• La possibilité ou non d’obtenir de vrais témoignages.
• Les pages qui lui enverront des liens internes.
• La zone géographique visée (parfois une seule, mais il peut aussi être judicieux de reproduire une page de service si l’on attire des clients dans deux pays ou villes différents).

Décide également quelles pages doivent être indexées. Ou plutôt, fais l’inverse : lesquelles ne doivent pas être indexées. Exemple : les pages légales et celles qui dupliquent du contenu (la page « Qui suis-je ? » et l’accueil).

Autre point important pour le contenu : si l’entreprise possède une fiche d’établissement Google, les informations qui y figurent (nom, services, coordonnées, horaires et véritables zones de service) doivent être exactement identiques à celles du site.

Livrable

Plan des pages avec :

• URL.
• Mots clés ciblés.
• Décisions propres au contenu de chaque page.
• Indexation : oui ou non.

5. Finalise les exigences et choisis la technologie adaptée

Avant de développer quoi que ce soit, il faut transformer toutes nos décisions en document de travail : une nouvelle version complète de notre PRD initial. Il doit permettre à quelqu’un d’autre — ou, ici, à l’IA — de comprendre ce qu’il faut construire et comment savoir que le travail est terminé.

En général, le plus pratique est de réunir toutes ces informations dans un projet ChatGPT et de lui demander d’en rédiger un brouillon en te posant toutes les questions nécessaires sur les informations manquantes. Il ne te reste alors qu’à le relire et le modifier. C’est beaucoup plus rapide.

Toutes ces informations réunies, il est temps de choisir la technologie. Pour ce type de site, je te propose d’envisager deux systèmes : le framework Astro (voici ses avantages et inconvénients) ou WordPress. Tu trouveras dans cet article un comparatif des deux, pour comprendre pourquoi, à l’heure actuelle, je privilégie Astro pour ces projets.

La combinaison gagnante est celle que j’utilise et que je vais suivre dans ce tutoriel ::

• Astro pour générer le site.
• GitHub comme dépôt de code.
• Cloudflare pour le publier (ce n’est pas indispensable, mais c’est plus facile si tu y as aussi acheté le domaine).
• Zoho Mail pour l’ email professionnel et l’API du formulaire.

Cela dit, pour une entreprise dont l’équipe doit modifier régulièrement beaucoup de contenus depuis un tableau de bord, WordPress peut constituer un meilleur point de départ.

En plus de la technologie, il faut maintenant organiser les sources. Crée sur ton PC un dossier contenant plusieurs sous-dossiers, par exemple :

• Documents originaux du client.
• Tes propres documents (étude de la demande, maquettes, PSD, textes…).
• Code.
• Ressources finales du site (ce qui sera envoyé sur Cloudflare : principalement HTML, CSS, JS et images).
• Secrets de production (mots de passe).

Tout cela ne sera pas envoyé au dépôt : seulement ce qui est indispensable pour reconstruire le site, sans mots de passe ni énormes documents originaux que nous gardons comme sources de travail.

Une fois cette organisation en place, il est temps de créer un projet dans Codex, distinct de celui créé dans ChatGPT. Ce sont deux projets différents qui partageront certains documents, comme le PRD. À partir de maintenant, imagine que deux personnes travaillent pour toi :

1. ChatGPT : l’analyste, qui conçoit le système selon tes spécifications et te propose des solutions.
2. Codex : le développeur, qui construit le site selon les instructions proposées par l’analyste.

Pour créer le projet dans Codex, il suffit de :

1. Créer un nouveau projet dans l’application.
2. Lui donner un nom.
3. Partager le dossier racine du projet que nous avons créé sur notre PC.
4. Lui indiquer où se trouve le PRD et lui demander de tout évaluer avant de commencer.

Pour terminer cette étape, il reste à définir les derniers aspects avant le développement :

• Comment les modifications seront vérifiées avant publication (veux-tu que Codex s’en charge ou préfères-tu le faire manuellement ?).
• Comment le site sera publié (Codex effectuera-t-il un commit sur GitHub, puis un déploiement sur Cloudflare, ou le feras-tu manuellement ?).
• Si le site sera multilingue et par quelle langue commencer.

Une fois tes décisions prises, demande-lui de les ajouter au PRD. Puisqu’il a le droit d’écrire dans le dossier, il effectuera les modifications nécessaires. À partir de maintenant, voici notre méthode de travail :

1. Tu réfléchis à tes besoins. Tu es le propriétaire (owner) du projet.
2. Tu les présentes à ChatGPT et vous étudiez ensemble chaque point et les doutes éventuels.
3. Une fois tout clarifié, tu demandes à ChatGPT de préparer le prompt pour Codex.
4. Tu le colles dans Codex, qui l’exécute.
5. Tu vérifies ce que Codex a fait et tu ajustes si nécessaire.
6. Tu passes à l’étape suivante du développement.

Désormais, ton travail consiste uniquement à réfléchir, décider et définir. Ton analyste et ton développeur se chargent de construire le site.

Livrables

• PRD validé avant le développement (il pourra évoluer au fil du projet).
• Dossier organisé selon la structure du dépôt.
• Plan de publication et de tests.

6. Rédige les textes

Si ce n’est pas déjà fait, maintenant que la structure du site et le projet sont prêts, il faut commencer à produire les contenus de chaque URL.

L’accueil doit présenter l’offre générale et renvoyer vers les services. Chaque page de service doit décrire ce qui est proposé, à qui, dans quelles situations, quelles questions les clients se posent et comment prendre contact. Les textes SEO ne remplacent pas les textes utiles aux visiteurs : bien pensés, les deux se complètent.

Utilise l’IA pour préparer des brouillons contextualisés. Explique-lui :

• Le service.
• Ta proposition de valeur unique.
• Le public.
• La zone géographique.
• Le ton.
• Les véritables questions fréquentes.
• Les témoignages disponibles. Si l’entreprise possède une fiche d’établissement Google, il est possible d’y récupérer de bons avis.

Fais des itérations et corrige ses propositions jusqu’à obtenir un texte publiable. Ensuite, réfléchis à la manière de le répartir en modules ou demande des propositions à ChatGPT. Certains modules peuvent se répéter sur tout le site (formulaire, carte, avantages généraux). Ne t’en préoccupe pas encore : nous y reviendrons à l’étape suivante.

Voici un exemple de prompt pour rédiger une page de service :

Rédige la page [servicio] de [negocio] à [zona]. Proposition de valeur unique : [propuesta]. Public : [audiencia]. Intention principale : [necesidad]. Témoignages : [lista]. Questions fréquentes : [lista]. CTA : [acción]. Adopte un ton [tono]. Propose la structure, les textes, les métadonnées SEO et le schema. Signale toute affirmation nécessitant des preuves et n’invente ni chiffres, ni avis, ni véhicules, ni zones desservies.

Crée le contenu de toutes les pages, une par une.

Livrable

Des fiches de pages validées avec les contenus : textes, CTA, métadonnées, preuves et ressources visuelles. Tu peux d’abord construire l’accueil et une page de service représentative pour vérifier le fonctionnement du système avant de l’étendre aux autres services et au contact.

7. Sépare les composants réutilisables

Avec les maquettes et les fiches de pages sous les yeux, repère ce qui se répète vraiment : en-tête, navigation, pied de page, boutons, formulaire, cartes d’avantages, sections illustrées, CTA finaux, messages…

Nous utiliserons pour cela des composants réutilisables : si le numéro de téléphone change, il suffira de le modifier dans le composant pour mettre à jour toutes les URL. Évidemment, l’en-tête et le pied de page sont réutilisables, mais il peut y en avoir d’autres.

Tu voudras peut-être aussi que toutes les pages de service partagent un même design ou une même structure. Sépare donc la structure des données. Exemples :

• Un modèle de page de service peut assembler des modules communs sans imposer le même texte à toutes les pages.
• Plus concrètement, un composant présentant les avantages peut conserver sa mise en page tandis que le titre, l’explication et l’icône changent.

Fais un essai concret avant de multiplier le modèle : demande à ChatGPT le prompt nécessaire pour que Codex réalise la mise en page de l’accueil et d’une page de service, compare-les aux maquettes et ajuste aussi bien les contenus individuels que les composants communs.

Vérifie le rendu sur ordinateur et sur mobile. Quand tout est correct, étends le système aux autres pages.

Livrable

Page d’accueil et une page de service mises en page.

Inventaire des composants, des données reçues par chacun et des pages qui les utilisent.

8. Prépare les images pour la production

Allez, après les textes, place aux images.

Idéalement, le client t’aura fourni des photos correctes. En pratique, c’est rarement le cas. Heureusement, si tu ne maîtrises pas Photoshop, ChatGPT est ton ami et son système de création et de retouche d’images est vraiment, vraiment bon. Alors, au travail.

Ne complique pas les choses : une à trois images maximum par URL devraient suffire. Certaines se répéteront probablement. Dans l’idéal, la première, celle de l’en-tête, doit tout de même être différente sur chaque page.

Conserve les originaux du client et, quand tu produis une nouvelle image, garde un master de haute qualité dans des dossiers qui ne seront pas ajoutés au dépôt.

Demande ensuite à ChatGPT de charger Codex d’adapter chaque image à sa place sur le site et, pour cela, de :

• Générer des versions aux bonnes dimensions et dans les bons formats, généralement .webp pour les photos et SVG pour les icônes.
• Définir des tailles responsive et éviter d’envoyer sur mobile un fichier conçu pour remplir un grand écran.
• Réserver l’espace nécessaire pour éviter que la page saute pendant le chargement. L’image principale peut mériter un téléchargement prioritaire, contrairement à celle qui se trouve tout en bas.
• Un texte alternatif utile décrit l’information de l’image ; s’il peut intégrer naturellement un mot clé pertinent, tant mieux.

Livrable

Images définitives du site.

9. Crée les icônes

C’est probablement la partie la plus difficile à optimiser sur les sites qui en comportent beaucoup (plus de 20 ou 30).

En effet, il est difficile de générer des variantes dans un style uniforme, surtout au sein d’une même planche d’icônes. On finit par les traiter une par une, ce qui prend du temps.

Et ensuite, plus difficile encore : les convertir en SVG avec un bon rendu. C’est pourquoi je te conseille de ne pas hésiter à utiliser des PNG découpés à la main ou extraits d’une planche créée dans Photoshop. Tu n’atteindras pas 100 % d’optimisation, mais tu gagneras énormément de temps. Je parle d’expérience.

Par exemple, sur Rondabus, j’ai testé plusieurs solutions parce que les premiers dessins s’éloignaient des références : certains étaient trop simples et d’autres semblaient avoir une échelle différente malgré des cadres de mêmes dimensions. J’ai même envisagé des découpes et des PNG tirés des planches validées, mais la solution retenue pour la version 2.0 consistait à utiliser les SVG originaux affichés plus grands..

Pour mener le processus :

1. Commence par repérer où apparaît chaque icône et ce qu’elle signifie.
2. Regroupe celles qui se répètent.
3. Garde un master par dessin ou planche d’icônes.
4. Prépare un aperçu dans les contextes réels : hero, module de cartes de services, liste des avantages, contact…
5. Ajuste la taille optique sans déformer les formes : deux icônes de même largeur peuvent sembler très différentes à cause des marges autour du dessin.
6. Teste un échantillon sur une page importante (accueil ou services) avant de modifier toutes les pages. Si un essai ne reproduit pas correctement le style de la maquette, reviens à la référence et abandonne-le.
7. Applique le résultat aux autres pages.
8. Le format du fichier relève de l’implémentation, tandis que la qualité visuelle et la cohérence sont ce que l’utilisateur remarquera. Et c’est le plus important.

Livrable

Ensemble d’icônes et de masters validés.

10. Construis le site par étapes

Une fois l’accueil et le modèle de page de service validés, construis les autres pages et vérifie-les individuellement. Partager un modèle ne garantit pas que toutes les pages fonctionneront visuellement : la longueur des titres, les photos, le nombre d’avantages, le texte des boutons et les besoins du public varient.

Vérifie le rendu sur ordinateur et sur plusieurs largeurs de mobile et de tablette. Mets-toi à la place de l’utilisateur, compare chaque page à sa maquette et vérifie ce qu’une image statique ne permet pas de voir :

• Menu déroulant.
• Liens.
• Validation du formulaire côté client.
• Chargement des images et des icônes.
• Contenus longs.
• Retours à la ligne dans les titres.
• …

Il est utile de sauvegarder des points de contrôle du code lorsqu’une étape comportant plusieurs modifications est validée. Demande-le à ChatGPT pendant que tu peaufines les détails.

Livrable

Pages front-end terminées (il reste à valider le formulaire, si tu en as un).

Point de contrôle du front-end achevé, site version V1 (une langue). Si tu estimes ton site terminé à ce stade, passe directement à la section 17 pour le publier en ligne.

11. Mets en place un formulaire et d’autres moyens de contact

Si tu as lu mes articles sur Astro, deux choses te paraîtront évidentes :

1. Tu publies des fichiers HTML.
2. Sur un serveur sans langage côté serveur (PHP, Python).

Cela présente beaucoup d’avantages et un inconvénient : tu ne peux pas envoyer directement de formulaires.

Il existe plusieurs solutions, notamment :

• Utiliser les services payants de Cloudflare.
• Utiliser un fournisseur d’email (gratuit ou payant) et intégrer son service via une API.

Dans mon cas, comme je mets généralement aussi en place l’email du projet et que j’utilise la version gratuite de Zoho Mail, je préfère ce service pour envoyer les messages des formulaires plutôt que d’ajouter un fournisseur de plus.

C’est un peu complexe et cela demande plusieurs opérations manuelles, alors demande à ChatGPT de te guider étape par étape. Et surtout, n’ajoute jamais les secrets au dépôt GitHub. Cloudflare dispose d’un espace pour les stocker.

Une fois le formulaire prêt, remplis-le correctement et incorrectement pour vérifier que la validation et l’envoi fonctionnent.

Si tu ne l’as pas déjà fait, c’est aussi le bon moment pour tester les liens de téléphone et de WhatsApp sur un vrai mobile, si tu les as ajoutés — ce qui devrait presque certainement être le cas.

Livrable

Formulaire testé et fonctionnel de bout en bout.

Point de contrôle, site version V1.5 (terminé avec un formulaire et une langue).

Avec cela, à part la publication du site (étape 17), nous aurions terminé l’indispensable pour n’importe quel site d’entreprise locale. Mais les étapes suivantes sont TRÈS RECOMMANDÉES si l’on veut vraiment attirer des clients.

12. Mesure les contacts et configure le consentement

Commençons les étapes facultatives par une base : la mesure.

Que voulons-nous mesurer ? L’essentiel :

• Les événements de conversion.
• Le trafic.

Pourquoi ?

Pour savoir d’où viennent les ventes, surtout si l’on prévoit d’investir en publicité pour trouver les premiers clients (tu devrais sérieusement l’envisager).

La première chose à faire est donc de définir le plan de mesure et les événements commerciaux avant d’installer quoi que ce soit. Ils seront très simples :

• Contact par téléphone.
• Contact par WhatsApp.
• Contact par email.
• Contact par formulaire.
• Prise de rendez-vous dans l’agenda.
• Abonnement (à une newsletter, éventuellement).
• Clic pour voir l’adresse sur Google Maps.

Cela couvre probablement tous les événements à suivre sur ce type de site.

Détermine ceux qui s’appliquent à ton cas et demande à ChatGPT de te fournir :

• Le nom de l’événement selon la nomenclature recommandée par Google, car je te propose d’utiliser Google Analytics 4 pour les mesurer.
• La condition de déclenchement de l’événement.
• Les paramètres secondaires (le cas échéant).

Le système fonctionne ainsi :

Un visiteur du site déclenche un événement > Google Tag Manager le récupère > GA4 le stocke pour que tu puisses consulter les données.

Crée un compte GA4 et GTM avec ton compte Google et, tant que tu y es, un compte GSC, dont nous nous servirons plus tard pour le SEO.

Si ton entreprise est située dans l’Union européenne, la mesure dépend aussi des choix en matière de confidentialité. Demande donc à ChatGPT de mettre en place le Google Consent Mode v2 avancé, avec une option permettant de rouvrir les préférences. Cela créera la bannière de cookies habituelle.

Une fois tout cela défini, demande à ChatGPT de faire créer par Codex le fichier JSON du conteneur à importer dans GTM. L’IA te demandera les identifiants de tes comptes GA4 et GTM et te fournira un petit fichier prêt à importer avec tous les éléments nécessaires.

Il ne restera plus qu’à tester chaque événement en mode aperçu de GTM avant de publier le conteneur et de commencer à recueillir les données réelles de ton site.

Livrable

Le plan de mesure, ainsi que GTM et GA4 fonctionnels, avec le consentement vérifié si nécessaire.

13. Termine le SEO technique et publie la première version

Si tu travailles le SEO local — et tu devrais —, c’est le moment de lancer Screaming Frog et de rechercher les erreurs. Demande à ChatGPT de les corriger.

Relie le site à ta fiche d’établissement Google. Vérifie le nom, les catégories, l’adresse ou la zone de service, le téléphone, les horaires, les photos et les services, sans inventer de lieux.

De plus, dans GSC (Google Search Console), envoie le sitemap généré. Si tu ne connais pas son URL, demande-la directement à Codex. Après quelques jours, vérifie si les pages importantes peuvent être explorées et indexées.

Livrable

Un site sans erreurs de SEO technique, avec des URL et un sitemap vérifiés, ainsi que le domaine canonique correct.

Nous pourrions appeler cela la version V2..

14. Décide si traduire le site dans d’autres langues en vaut la peine

Nous arrivons à la dernière partie du processus : traduire le site dans d’autres langues.

Avant de prendre ta décision, précise :

• Quels publics tu veux attirer.
• Dans quelle langue tu pourras leur répondre.

Proposer un massage à un Norvégien à Málaga sans parler sa langue, ce n’est pas la même chose que proposer des services juridiques. Tu peux aussi attirer des Japonais cherchant un taxi à Ronda, tout en indiquant clairement que tu ne les accueilles qu’en anglais.

Une langue supplémentaire implique également de traduire les contenus, menus, formulaires, métadonnées, schema et futures mises à jour. Ce n’est pas juste un bouton avec un drapeau.

Une fois les langues du site décidées avec ChatGPT, définis :

• La langue source, celle de ton site public actuel.
• Les langues cibles.
• Les pages à traduire, qui ne sont pas toutes les pages (par exemple, la page d’erreur 404 ou les pages légales).
• La politique d’URL. Décide si les slugs seront traduits, comment les pages équivalentes seront reliées et ce qui se passera en l’absence de traduction.

L’architecture devrait identifier chaque page par un code stable, indépendant de la langue, afin que le sélecteur redirige vers la page équivalente et que le site génère les relations hreflang sans devoir les deviner à partir du titre affiché.

Tout cela doit être réglé avant la traduction.

Livrable

Plan de traduction.

15. Sépare l’exportation, la traduction et l’intégration

La méthode qui me convient le mieux consiste à répartir le travail.

1. Codex inspecte le projet et prépare un paquet de textes contenant des identifiants stables, les textes sources, le contexte, la langue cible, les marqueurs, les liens et les termes protégés. Il s’agit généralement d’un paquet JSON ou XML.
2. ChatGPT traduit ces paquets, vérifie les valeurs et nous renvoie les fichiers traduits.
3. Codex intègre ces fichiers et valide les pages.

Cette répartition permet de changer de traducteur (voire de faire appel à un humain) sans lui imposer de comprendre le code, ni obliger le développeur à deviner le sens de chaque phrase. Évidemment, la révision de ChatGPT ne remplace pas la vérification linguistique d’un traducteur assermenté.

Prompt d’exportation :

Inspecte le projet et prépare un inventaire traduisible pour [idiomas]. Inclus les textes visibles, la navigation, les formulaires, les métadonnées et les slugs. Pour chaque unité, fournis un ID stable, le texte source, le contexte, les marqueurs, les liens et les termes protégés. Ne traduis pas et ne modifie pas encore les pages. Signale les chaînes ambiguës et les contenus sans équivalent.

Prompt de traduction :

Traduis uniquement les valeurs du paquet vers [idioma y variante]. Public : [audiencia]. Ton : [tono]. Glossaire : [términos]. Conserve les IDs, la structure, l’ordre, les placeholders, les noms propres, les liens et le code. Signale en dehors du paquet les phrases qui exigent une décision commerciale ou une révision par un locuteur natif.

Prompt d’intégration :

Importe ces traductions validées dans le projet. Vérifie les IDs, les marqueurs, les termes protégés, les slugs et les routes équivalentes. Ne publie pas une langue si des textes obligatoires manquent. Exécute l’audit des traductions, les vérifications du projet et le build ; signale toute différence avant le déploiement.

Livrable

Site multilingue non encore vérifié.

16. Audite chaque langue comme un site complet

Une fois les traductions intégrées, ouvre les pages : un fichier valide peut provoquer un menu qui déborde, un CTA trop long ou un avertissement qui cache le formulaire. Vérifie chaque URL de chaque langue sur ordinateur et mobile.

Pour le SEO, vérifie (toi-même ou avec ChatGPT) :

• <html lang>.
• Titre.
• Description.
• URL localisée.
• Balise canonique pointant vers la page elle-même.
• Relations hreflang entre pages équivalentes.
• Sitemap des URL indexables.
• Le sélecteur de langue doit conserver la page actuelle lors du changement de langue, si son équivalent existe.
• Vérifie aussi les liens du pied de page.
• Les formulaires et messages d’erreur.
• Les textes alternatifs des images.
• Les données structurées contenant du texte ou des URL.

Fais autant d’itérations que nécessaire pour tout peaufiner.

Livrable

Site multilingue complet, version V3.

17. Publie une version identifiable et vérifie la production

Que tu arrives ici après l’étape 10 (V1), la 11 (V1.5), la 13 (V2) ou la précédente (V3), tu disposes d’un site construit dans un environnement de test. Il reste à le mettre en production. Et c’est ce que nous allons faire ici.

Nous allons demander à ChatGPT d’indiquer à Codex de publier le build sur Cloudflare.

Pour cela, Codex va :

1. Se connecter à notre compte GitHub.
2. Nous demander de sélectionner ou de créer le bon dépôt.
3. Se connecter à notre compte Cloudflare.
4. Nous demander sur quel domaine publier.
5. Publier la dernière version du site.

De notre côté, il suffira de vérifier que tout s’affiche comme dans notre version de test.

Le site sera terminé.

Livrable

Version complète du site publiée.

18. Transforme le projet en méthode reproductible

C’est encore plus facultatif, mais vivement recommandé si tu veux appliquer ce processus au site d’une autre entreprise.

Il te suffit de demander à ChatGPT de créer une Skill couvrant tout le processus que vous avez suivi. Ainsi, tu n’auras pas besoin de te souvenir de chaque étape de la dernière fois ou de revenir consulter ce tutoriel. Ton ChatGPT le gardera précieusement et ton Codex l’aura installé dans ses entrailles.

Ainsi, tu créeras beaucoup plus rapidement le prochain site d’une autre entreprise locale.

Pas mal, non ?