Introduction : pourquoi Framer a besoin du pre-rendering
Framer est devenu l'outil favori des designers pour créer des sites web interactifs et visuellement impressionnants. Mais comme tous les outils no-code modernes, il génère des sites JavaScript qui peuvent être difficiles à indexer par Google.
Le défi spécifique de Framer
Framer utilise React sous le capot, ce qui signifie que :
La solution : pre-rendering avec Rank Deploy
Le pre-rendering résout ce problème en :
1. Visitant vos pages avec un navigateur complet
2. Attendant que tout le contenu soit chargé
3. Capturant le HTML final
4. Le servant aux robots de recherche
Prérequis avant de commencer
Avant de commencer, assurez-vous d'avoir :
Note importante sur les domaines
Le pre-rendering fonctionne uniquement avec un domaine personnalisé. Les sous-domaines Framer (*.framer.app) ne sont pas supportés car vous ne contrôlez pas leur DNS.
Étape 1 : Créer votre compte et ajouter votre site
1.1 Inscription sur Rank Deploy
1. Allez sur [rankdeploy.com](https://rankdeploy.com)
2. Cliquez sur "Commencer gratuitement"
3. Connectez-vous avec GitHub ou email
4. Complétez la configuration de votre compte
1.2 Ajouter votre site Framer
Une fois connecté au dashboard :
1. Cliquez sur "**Ajouter un site**"
2. Entrez l'URL de votre site Framer (ex: https://monsite.com)
3. Sélectionnez "**Framer**" comme plateforme
4. Cliquez sur "Continuer"
Notre système analysera automatiquement votre site pour :
Étape 2 : Configurer le DNS
Cette étape est cruciale. Vous allez rediriger le trafic de votre site vers notre proxy, qui servira les pages pré-rendues aux robots.
2.1 Récupérer les informations DNS
Après avoir ajouté votre site, Rank Deploy vous fournira :
Type: CNAME
Nom: www (ou @ pour le domaine racine)
Valeur: proxy.rank-deploy.com
TTL: Auto (ou 3600)
2.2 Configurer chez votre registrar
Exemple avec Cloudflare :
1. Connectez-vous à Cloudflare
2. Sélectionnez votre domaine
3. Allez dans "DNS"
4. Modifiez l'enregistrement existant ou créez-en un nouveau
5. Entrez les valeurs fournies
6. Désactivez le proxy Cloudflare (nuage gris) temporairement
Exemple avec OVH :
1. Allez dans l'espace client OVH
2. Sélectionnez votre domaine
3. Onglet "Zone DNS"
4. Modifiez ou ajoutez un enregistrement CNAME
5. Entrez les valeurs
Exemple avec GoDaddy :
1. Connectez-vous à votre compte
2. "Mes produits" → Votre domaine → "DNS"
3. Modifiez l'enregistrement CNAME
4. Sauvegardez
2.3 Propager les changements
La propagation DNS prend généralement :
Comment vérifier :
# Sur Mac/Linux
dig www.votresite.com CNAME
# Résultat attendu
www.votresite.com. CNAME proxy.rank-deploy.com.
Étape 3 : Vérification et premier crawl
3.1 Vérifier la configuration
Retournez sur votre dashboard Rank Deploy :
1. Cliquez sur votre site
2. Allez dans l'onglet "Configuration"
3. Cliquez sur "**Vérifier DNS**"
Si tout est correct, vous verrez :
✅ DNS correctement configuré
3.2 Lancer le premier crawl
1. Allez dans l'onglet "**Pages**"
2. Cliquez sur "**Crawler maintenant**"
3. Notre système va :
Temps estimé :
3.3 Vérifier les pages générées
Une fois le crawl terminé, vous verrez la liste des pages pré-rendues avec :
Étape 4 : Tester le pre-rendering
4.1 Test manuel
Vérifiez que les robots reçoivent bien la version pré-rendue :
# Simuler une requête Googlebot
curl -A "Googlebot" https://www.votresite.com
Vous devriez voir du HTML complet avec tout votre contenu visible.
4.2 Test avec Google Search Console
1. Allez dans Search Console
2. Utilisez "Inspection de l'URL"
3. Entrez une URL de votre site
4. Vérifiez que le contenu est correctement affiché
4.3 Demander l'indexation
Toujours dans Search Console :
1. Cliquez sur "Demander l'indexation"
2. Répétez pour vos pages les plus importantes
3. Soumettez votre sitemap mis à jour
Étape 5 : Configuration avancée
5.1 Fréquence de mise à jour
Par défaut, les pages sont régénérées quotidiennement. Vous pouvez ajuster :
5.2 Exclure des pages
Certaines pages ne doivent pas être pré-rendues :
Dans votre dashboard, ajoutez ces chemins à la liste d'exclusion.
5.3 Priorités de crawl
Définissez quelles pages sont les plus importantes :
Résolution des problèmes courants
"DNS non détecté"
"Erreur de rendu sur certaines pages"
"Contenu différent de l'original"
C'est terminé !
Votre site Framer est maintenant optimisé pour le SEO. Les robots de recherche recevront automatiquement les versions HTML statiques de vos pages, garantissant une indexation complète et rapide.
Prochaines étapes recommandées
1. **Soumettez votre sitemap** dans Google Search Console
2. **Créez du contenu** optimisé pour vos mots-clés cibles
3. **Suivez vos performances** dans le dashboard Rank Deploy
4. **Optimisez vos titres** et meta descriptions
FAQ Configuration Framer
Le pre-rendering affecte-t-il mes animations Framer ?
Non, vos utilisateurs voient toujours le site normal avec toutes les animations. Seuls les robots reçoivent la version statique.
Dois-je reconfigurer après une mise à jour de mon site ?
Non, les pages sont automatiquement régénérées selon la fréquence définie.
Puis-je utiliser Framer et un domaine hébergé ailleurs ?
Oui, tant que vous pouvez modifier les enregistrements DNS de votre domaine.