Comment faire lire votre site créé avec v0 par ChatGPT
v0 génère des projets Next.js qui peuvent servir un HTML déjà rendu. Le problème apparaît quand le contenu important vit dans des composants client qui le chargent après coup.
Dépend de la construction ou d’un réglage.
Pourquoi ça arrive
Dans Next.js, les composants serveur arrivent avec leur texte dans le HTML. Les composants « use client » sont aussi rendus côté serveur la première fois, sauf ce qu’ils chargent via des effets ou des requêtes navigateur.
Si vos prix, vos textes ou vos fiches sont récupérés depuis le navigateur, le robot d’IA reçoit le squelette sans les données.
Un site v0 peut donc être presque parfait ou presque vide pour l’IA, selon la façon dont chaque page est construite.
Comment corriger
Analysez le site en ligne
Tarsier compare ce que voit une personne avec ce que reçoit un robot et signale les blocs perdus.
Chargez les données côté serveur
Déplacez les requêtes de données des effets client vers des composants serveur ou le chargement de la page.
Métadonnées avec l’API de Next
Utilisez generateMetadata pour le titre et la description de chaque page, et ajoutez du JSON-LD sur l’accueil.
robots.txt et sitemap
Next propose app/robots.ts et app/sitemap.ts : laissez entrer les robots d’IA et listez toutes les routes.
Le prompt à coller dans v0
Mon site est un projet Next.js généré avec v0. Je veux que tout le contenu public arrive déjà rendu dans le HTML pour les robots d’IA, qui n’exécutent pas JavaScript. 1. Passe en revue les pages publiques et déplace vers des composants serveur tout chargement de données fait aujourd’hui dans le navigateur (useEffect, SWR, fetch dans des composants "use client") pour les textes, prix, produits ou FAQ. 2. Ne garde côté client que l’interactif (panier, filtres, formulaires). 3. Ajoute generateMetadata avec un titre et une description propres à chaque page, et du JSON-LD schema.org sur l’accueil. 4. Crée app/robots.ts autorisant GPTBot, ClaudeBot, PerplexityBot, OAI-SearchBot et Google-Extended, et app/sitemap.ts avec toutes les routes publiques. Ne change pas le design. À la fin, dis-moi quelles pages chargeaient des données côté client et ce que tu as déplacé.
Copiez-le tel quel. Si l’analyse trouve d’autres problèmes, le rapport complet contient un prompt écrit pour votre site.
Questions fréquentes
Next.js ne rend-il pas déjà côté serveur ?
Si, mais seulement ce dont il dispose au moment du rendu. Ce qui est demandé ensuite depuis le navigateur arrive trop tard pour un robot sans JavaScript.
Dois-je héberger sur Vercel ?
Pas forcément, mais il faut un hébergement qui exécute Next.js avec son serveur. En export statique, vérifiez que les pages sortent avec leur contenu.