Vous souhaitez configurer la langue principale Webflow en français pour votre site web sans perdre votre référencement ? En effet, définir la langue principale Webflow en français nécessite une planification minutieuse pour préserver votre visibilité SEO. Par ailleurs, une migration mal exécutée vers la langue française peut entraîner des erreurs 404 et une chute de trafic. Cependant, en suivant le guide détaillé de notre agence webflow pour configurer la langue principale Webflow en français , vous réussirez votre transformation linguistique en toute sécurité.
Avant de commencer la modification de votre langue principale Webflow en Français : Vue d'ensemble Pourquoi ? En effet, avant de commencer votre migration webflow comment passer son site en francais , il faut une liste complète de toutes les pages existantes.
Phase 1 : Comment exporter toutes les URLs pour votre migration webflow en français Pourquoi ? Avant de toucher quoi que ce soit, il faut une liste complète de toutes les pages existantes. Ce fichier servira de base pour créer les redirections.
Étape 1.1 - Export via Screaming Frog (méthode principale) Télécharger Screaming Frog SEO Spider → screamingfrog.co.uk (gratuit jusqu'à 500 URLs) Ouvrir le logiciel, entrer l'URL du site dans la barre en haut Cliquer sur Start Attendre la fin du crawl Dans l'onglet du haut, sélectionner Internal Dans le filtre à droite, choisir HTML (pour n'avoir que les pages, pas les images) Cliquer sur Export → CSV Sauvegarder le fichier sous le nom urls-anglais.csv Étape 1.2 - Export via Google Search Console (en complément) Aller sur search.google.com/search-console Sélectionner la propriété du site Menu gauche → Index > Pages Cliquer sur Exporter en haut à droite → CSV Sauvegarder sous urls-search-console.csv Étape 1.3 - Export des collections Webflow Pour chaque collection CMS (blog, études de cas, etc.) :
Dans Webflow, aller dans CMS Cliquer sur la collection concernée Cliquer sur Export en haut à droite Sauvegarder chaque fichier avec un nom clair (ex : collection-blog.csv) Étape 1.4 - Créer le fichier de mapping Ouvrir un tableur (Excel, Google Sheets) et créer un fichier avec ces colonnes :
<div class="syn1">
<style>
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700&family=Geist+Mono:wght@400;500&display=swap');
.syn1{--ink:#0a0a0a;--paper:#fff;--soft:#f6f6f4;--line:#e6e6e1;--muted:#6b6b66;--accent:#c6f24e;--todo-bg:#f0f0ee;--todo-tx:#6b6b66;--keep-bg:#eef1ff;--keep-tx:#3b4ba8;font-family:'Sora',-apple-system,sans-serif;color:var(--ink);line-height:1.55;max-width:980px;margin:0 auto}
.syn1 *{box-sizing:border-box}
.syn1 .h{display:flex;align-items:baseline;gap:12px;margin-bottom:4px}
.syn1 .num{font-family:'Geist Mono',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;background:var(--accent);padding:3px 8px;border-radius:6px;white-space:nowrap}
.syn1 .t{font-size:clamp(1.05rem,2.4vw,1.32rem);font-weight:700;letter-spacing:-.015em;margin:0}
.syn1 .s{font-size:.9rem;color:var(--muted);margin:6px 0 18px;max-width:62ch}
.syn1 .card{border:1px solid var(--ink);border-radius:14px;overflow:hidden;background:var(--paper);box-shadow:0 14px 40px -28px rgba(10,10,10,.45)}
.syn1 table{width:100%;border-collapse:collapse;font-size:.92rem}
.syn1 thead th{text-align:left;font-weight:600;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--paper);background:var(--ink);padding:13px 16px;white-space:nowrap}
.syn1 tbody td{padding:13px 16px;border-top:1px solid var(--line);vertical-align:top}
.syn1 tbody tr:nth-child(even){background:var(--soft)}
.syn1 tbody tr:hover{background:#f0f0ec}
.syn1 .u{font-family:'Geist Mono',monospace;font-size:.82rem;background:#f0f0ec;padding:2px 7px;border-radius:5px;display:inline-block;word-break:break-all}
.syn1 .u.new{background:#eef7e0}
.syn1 .tag{font-size:.76rem;color:var(--muted);border:1px solid var(--line);padding:2px 8px;border-radius:6px;white-space:nowrap}
.syn1 .b{display:inline-flex;align-items:center;gap:5px;font-size:.74rem;font-weight:600;padding:3px 10px;border-radius:999px;white-space:nowrap}
.syn1 .b::before{content:'';width:6px;height:6px;border-radius:50%}
.syn1 .b.todo{background:var(--todo-bg);color:var(--todo-tx)}.syn1 .b.todo::before{background:var(--todo-tx)}
.syn1 .b.keep{background:var(--keep-bg);color:var(--keep-tx)}.syn1 .b.keep::before{background:var(--keep-tx)}
.syn1 .foot{font-size:.82rem;color:var(--muted);margin-top:12px}.syn1 .foot strong{color:var(--ink);font-weight:600}
.syn1 .lbl{display:none}
@media(max-width:720px){
.syn1 thead{display:none}
.syn1 table,.syn1 tbody,.syn1 tr,.syn1 td{display:block;width:100%}
.syn1 tbody tr{border-top:1px solid var(--ink);padding:6px 0}.syn1 tbody tr:first-child{border-top:none}.syn1 tbody tr:nth-child(even){background:transparent}
.syn1 tbody td{border-top:none;padding:7px 16px;display:flex;gap:12px;align-items:flex-start}
.syn1 .lbl{display:block;flex:0 0 38%;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600;padding-top:2px}
.syn1 .v{flex:1 1 auto;min-width:0}}
</style>
<div class="h"><span class="num">Phase 1.4</span><h3 class="t">Fichier de mapping des URLs</h3></div>
<p class="s">La base de toute la migration : chaque ancienne URL EN, sa correspondance FR, son type et son statut.</p>
<div class="card"><table>
<thead><tr><th>Ancienne URL (EN)</th><th>Nouvelle URL (FR)</th><th>Type de page</th><th>Statut</th></tr></thead>
<tbody>
<tr><td><span class="lbl">Ancienne URL (EN)</span><span class="v"><span class="u">/about</span></span></td><td><span class="lbl">Nouvelle URL (FR)</span><span class="v"><span class="u new">/a-propos</span></span></td><td><span class="lbl">Type</span><span class="v"><span class="tag">Page statique</span></span></td><td><span class="lbl">Statut</span><span class="v"><span class="b todo">À faire</span></span></td></tr>
<tr><td><span class="lbl">Ancienne URL (EN)</span><span class="v"><span class="u">/blog/our-story</span></span></td><td><span class="lbl">Nouvelle URL (FR)</span><span class="v"><span class="u new">/blog/notre-histoire</span></span></td><td><span class="lbl">Type</span><span class="v"><span class="tag">Collection</span></span></td><td><span class="lbl">Statut</span><span class="v"><span class="b todo">À faire</span></span></td></tr>
<tr><td><span class="lbl">Ancienne URL (EN)</span><span class="v"><span class="u">/services</span></span></td><td><span class="lbl">Nouvelle URL (FR)</span><span class="v"><span class="u new">/services</span></span></td><td><span class="lbl">Type</span><span class="v"><span class="tag">Page statique</span></span></td><td><span class="lbl">Statut</span><span class="v"><span class="b keep">Inchangé</span></span></td></tr>
</tbody></table></div>
<p class="foot"><strong>Conseil :</strong> colle toutes les URLs de l'export Screaming Frog dans la 1<sup>re</sup> colonne, puis remplis « Nouvelle URL » au fur et à mesure.</p>
</div>
Conseil : Copier-coller toutes les URLs du fichier Screaming Frog dans la première colonne, puis remplir la colonne "Nouvelle URL" au fur et à mesure.
Phase 2 : Préparer les traductions pour configurer votre langue principale Webflow en français Pourquoi ? Avoir toutes les traductions prêtes avant de toucher au site évite de laisser des pages à moitié traduites en ligne.
Étape 2.1 - Inventaire du contenu à traduire Faire la liste de tout ce qui doit être traduit :
Pages statiques
[ ] Page d'accueil [ ] À propos [ ] Services / Offres [ ] Contact [ ] Mentions légales / CGV / Politique de confidentialité [ ] Page 404 Éléments globaux
[ ] Navigation principale (navbar) [ ] Footer (liens, textes, copyright) [ ] Boutons CTA (ex : "Get started" → "Commencer") [ ] Bannières et pop-ups Collections CMS
[ ] Articles de blog [ ] Études de cas / Projets [ ] Témoignages [ ] FAQ Formulaires
[ ] Labels des champs [ ] Textes placeholder (ex : "Your email" → "Votre email") [ ] Messages de confirmation (ex : "Thank you!" → "Merci !") [ ] Messages d'erreur Médias
[ ] Alt text des images [ ] Textes sur les images / infographies [ ] Sous-titres des vidéos si applicable Emails automatiques
[ ] Email de confirmation de formulaire [ ] Notifications internes Étape 2.2 - Organiser les traductions Créer un fichier Google Sheets ou Notion avec ces colonnes :
<div class="syn2">
<style>
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700&family=Geist+Mono:wght@400;500&display=swap');
.syn2{--ink:#0a0a0a;--paper:#fff;--soft:#f6f6f4;--line:#e6e6e1;--muted:#6b6b66;--accent:#c6f24e;--ok-bg:#e9f7e4;--ok-tx:#2f7d20;--wip-bg:#fff4e0;--wip-tx:#9a6700;font-family:'Sora',-apple-system,sans-serif;color:var(--ink);line-height:1.55;max-width:980px;margin:0 auto}
.syn2 *{box-sizing:border-box}
.syn2 .h{display:flex;align-items:baseline;gap:12px;margin-bottom:4px}
.syn2 .num{font-family:'Geist Mono',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;background:var(--accent);padding:3px 8px;border-radius:6px;white-space:nowrap}
.syn2 .t{font-size:clamp(1.05rem,2.4vw,1.32rem);font-weight:700;letter-spacing:-.015em;margin:0}
.syn2 .s{font-size:.9rem;color:var(--muted);margin:6px 0 18px;max-width:62ch}
.syn2 .card{border:1px solid var(--ink);border-radius:14px;overflow:hidden;background:var(--paper);box-shadow:0 14px 40px -28px rgba(10,10,10,.45)}
.syn2 table{width:100%;border-collapse:collapse;font-size:.92rem}
.syn2 thead th{text-align:left;font-weight:600;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--paper);background:var(--ink);padding:13px 16px;white-space:nowrap}
.syn2 tbody td{padding:13px 16px;border-top:1px solid var(--line);vertical-align:top}
.syn2 tbody tr:nth-child(even){background:var(--soft)}
.syn2 tbody tr:hover{background:#f0f0ec}
.syn2 .b{display:inline-flex;align-items:center;gap:5px;font-size:.74rem;font-weight:600;padding:3px 10px;border-radius:999px;white-space:nowrap}
.syn2 .b::before{content:'';width:6px;height:6px;border-radius:50%}
.syn2 .b.ok{background:var(--ok-bg);color:var(--ok-tx)}.syn2 .b.ok::before{background:var(--ok-tx)}
.syn2 .b.wip{background:var(--wip-bg);color:var(--wip-tx)}.syn2 .b.wip::before{background:var(--wip-tx)}
.syn2 .lbl{display:none}
@media(max-width:720px){
.syn2 thead{display:none}
.syn2 table,.syn2 tbody,.syn2 tr,.syn2 td{display:block;width:100%}
.syn2 tbody tr{border-top:1px solid var(--ink);padding:6px 0}.syn2 tbody tr:first-child{border-top:none}.syn2 tbody tr:nth-child(even){background:transparent}
.syn2 tbody td{border-top:none;padding:7px 16px;display:flex;gap:12px;align-items:flex-start}
.syn2 .lbl{display:block;flex:0 0 38%;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600;padding-top:2px}
.syn2 .v{flex:1 1 auto;min-width:0}}
</style>
<div class="h"><span class="num">Phase 2.2</span><h3 class="t">Suivi des traductions</h3></div>
<p class="s">Centralise chaque élément à traduire pour ne jamais laisser une page à moitié traduite en ligne.</p>
<div class="card"><table>
<thead><tr><th>Élément</th><th>Texte EN</th><th>Texte FR</th><th>Validé</th></tr></thead>
<tbody>
<tr><td><span class="lbl">Élément</span><span class="v">Navbar — Lien 1</span></td><td><span class="lbl">Texte EN</span><span class="v">About</span></td><td><span class="lbl">Texte FR</span><span class="v">À propos</span></td><td><span class="lbl">Validé</span><span class="v"><span class="b ok">Validé</span></span></td></tr>
<tr><td><span class="lbl">Élément</span><span class="v">CTA principal</span></td><td><span class="lbl">Texte EN</span><span class="v">Get started</span></td><td><span class="lbl">Texte FR</span><span class="v">Commencer</span></td><td><span class="lbl">Validé</span><span class="v"><span class="b ok">Validé</span></span></td></tr>
<tr><td><span class="lbl">Élément</span><span class="v">Formulaire contact — label email</span></td><td><span class="lbl">Texte EN</span><span class="v">Email address</span></td><td><span class="lbl">Texte FR</span><span class="v">Adresse email</span></td><td><span class="lbl">Validé</span><span class="v"><span class="b wip">En cours</span></span></td></tr>
</tbody></table></div>
</div>
Phase 3 : Configurer la langue principale Webflow en français pour votre site Prérequis : Être sur le plan Advanced de Webflow avec Localization activé.
Étape 3.1 - Activer le Français comme langue principale Dans Webflow, aller dans Settings (icône engrenage) Cliquer sur Localization Cliquer sur Add locale Sélectionner Français (FR) Le définir comme Primary locale Garder l'Anglais en locale secondaire si besoin Étape 3.2 - Vérifier les paramètres de publication Dans Settings > Publishing Vérifier que le domaine principal pointe bien vers la version française Vérifier la structure des URLs (ex : /en/ pour l'anglais si conservé) Phase 4 : Traduire les pages statiques Important : Travailler page par page. Ne pas publier avant d'avoir fini toute la page ET créé la redirection correspondante.
Étape 4.1 - Modifier les slugs Pour chaque page statique :
Ouvrir la page dans le Designer Aller dans Page Settings (icône engrenage en haut à droite) Modifier le Slug (ex : about → a-propos) ✅ Webflow crée automatiquement une redirection 301 pour les pages statiques Modifier tous les textes de la page en français Mettre à jour le SEO Title et la Meta Description en français Mettre à jour les Open Graph Title / Description Cocher la case "Statut : Traduit" dans votre fichier de mapping Étape 4.2 - Règles pour les slugs en français <div class="syn3">
<style>
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700&family=Geist+Mono:wght@400;500&display=swap');
.syn3{--ink:#0a0a0a;--paper:#fff;--soft:#f6f6f4;--line:#e6e6e1;--muted:#6b6b66;--accent:#c6f24e;font-family:'Sora',-apple-system,sans-serif;color:var(--ink);line-height:1.55;max-width:980px;margin:0 auto}
.syn3 *{box-sizing:border-box}
.syn3 .h{display:flex;align-items:baseline;gap:12px;margin-bottom:4px}
.syn3 .num{font-family:'Geist Mono',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;background:var(--accent);padding:3px 8px;border-radius:6px;white-space:nowrap}
.syn3 .t{font-size:clamp(1.05rem,2.4vw,1.32rem);font-weight:700;letter-spacing:-.015em;margin:0}
.syn3 .s{font-size:.9rem;color:var(--muted);margin:6px 0 18px;max-width:62ch}
.syn3 .card{border:1px solid var(--ink);border-radius:14px;overflow:hidden;background:var(--paper);box-shadow:0 14px 40px -28px rgba(10,10,10,.45)}
.syn3 table{width:100%;border-collapse:collapse;font-size:.92rem}
.syn3 thead th{text-align:left;font-weight:600;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--paper);background:var(--ink);padding:13px 16px;white-space:nowrap}
.syn3 tbody td{padding:13px 16px;border-top:1px solid var(--line);vertical-align:top}
.syn3 tbody tr:nth-child(even){background:var(--soft)}
.syn3 tbody tr:hover{background:#f0f0ec}
.syn3 .u{font-family:'Geist Mono',monospace;font-size:.82rem;background:#f0f0ec;padding:2px 7px;border-radius:5px;display:inline-block;word-break:break-all}
.syn3 .u.new{background:#eef7e0}
.syn3 .lbl{display:none}
@media(max-width:720px){
.syn3 thead{display:none}
.syn3 table,.syn3 tbody,.syn3 tr,.syn3 td{display:block;width:100%}
.syn3 tbody tr{border-top:1px solid var(--ink);padding:6px 0}.syn3 tbody tr:first-child{border-top:none}.syn3 tbody tr:nth-child(even){background:transparent}
.syn3 tbody td{border-top:none;padding:7px 16px;display:flex;gap:12px;align-items:flex-start}
.syn3 .lbl{display:block;flex:0 0 38%;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600;padding-top:2px}
.syn3 .v{flex:1 1 auto;min-width:0}}
</style>
<div class="h"><span class="num">Phase 4.2</span><h3 class="t">Règles de réécriture des slugs</h3></div>
<p class="s">Tirets (pas d'underscores), pas d'accents, slugs courts et lisibles. Exemples EN → FR.</p>
<div class="card"><table>
<thead><tr><th>Slug EN</th><th>Slug FR</th><th>Règle appliquée</th></tr></thead>
<tbody>
<tr><td><span class="lbl">Slug EN</span><span class="v"><span class="u">about</span></span></td><td><span class="lbl">Slug FR</span><span class="v"><span class="u new">a-propos</span></span></td><td><span class="lbl">Règle</span><span class="v">Sans accent (« à » → « a »)</span></td></tr>
<tr><td><span class="lbl">Slug EN</span><span class="v"><span class="u">our-services</span></span></td><td><span class="lbl">Slug FR</span><span class="v"><span class="u new">nos-services</span></span></td><td><span class="lbl">Règle</span><span class="v">Tirets, court &amp; lisible</span></td></tr>
<tr><td><span class="lbl">Slug EN</span><span class="v"><span class="u">contact-us</span></span></td><td><span class="lbl">Slug FR</span><span class="v"><span class="u new">contact</span></span></td><td><span class="lbl">Règle</span><span class="v">Simplification</span></td></tr>
<tr><td><span class="lbl">Slug EN</span><span class="v"><span class="u">privacy-policy</span></span></td><td><span class="lbl">Slug FR</span><span class="v"><span class="u new">politique-de-confidentialite</span></span></td><td><span class="lbl">Règle</span><span class="v">Tirets, sans accent</span></td></tr>
</tbody></table></div>
</div>
Utiliser des tirets et non des underscores _ Ne pas utiliser d'accents dans les slugs (ex : a-propos et non à-propos) Garder les slugs courts et lisibles Exemples :about → a-proposour-services → nos-servicescontact-us → contactprivacy-policy → politique-de-confidentialite Phase 5 : Traduire les collections CMS Attention : Contrairement aux pages statiques, les redirections pour les collections sont manuelles . C'est l'étape la plus risquée pour les erreurs 404.
Étape 5.1 - Modifier les slugs des items de collection Pour chaque article / item de collection :
Ouvrir l'item dans le CMS Modifier le Slug en français Modifier tous les champs texte en français Mettre à jour le SEO Title et la Meta Description Sauvegarder (ne pas publier encore) Noter l'ancienne et la nouvelle URL dans le fichier de mapping Étape 5.2 - Modifier le slug de la collection elle-même Dans le CMS, cliquer sur les paramètres de la collection Modifier le Collection Slug (ex : blog reste blog, ou case-studies → etudes-de-cas) Mettre à jour le fichier de mapping en conséquence Phase 6 : Créer les redirections 301 pour votre migration webflow français C'est l'étape la plus critique. À faire avant toute publication pour éviter les erreurs 404.
Étape 6.1 - Ajouter les redirections dans Webflow <div class="syn4">
<style>
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700&family=Geist+Mono:wght@400;500&display=swap');
.syn4{--ink:#0a0a0a;--paper:#fff;--soft:#f6f6f4;--line:#e6e6e1;--muted:#6b6b66;--accent:#c6f24e;--ok-bg:#e9f7e4;--ok-tx:#2f7d20;--todo-bg:#f0f0ee;--todo-tx:#6b6b66;font-family:'Sora',-apple-system,sans-serif;color:var(--ink);line-height:1.55;max-width:980px;margin:0 auto}
.syn4 *{box-sizing:border-box}
.syn4 .h{display:flex;align-items:baseline;gap:12px;margin-bottom:4px}
.syn4 .num{font-family:'Geist Mono',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;background:var(--accent);padding:3px 8px;border-radius:6px;white-space:nowrap}
.syn4 .t{font-size:clamp(1.05rem,2.4vw,1.32rem);font-weight:700;letter-spacing:-.015em;margin:0}
.syn4 .s{font-size:.9rem;color:var(--muted);margin:6px 0 18px;max-width:62ch}
.syn4 .card{border:1px solid var(--ink);border-radius:14px;overflow:hidden;background:var(--paper);box-shadow:0 14px 40px -28px rgba(10,10,10,.45)}
.syn4 table{width:100%;border-collapse:collapse;font-size:.92rem}
.syn4 thead th{text-align:left;font-weight:600;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--paper);background:var(--ink);padding:13px 16px;white-space:nowrap}
.syn4 tbody td{padding:13px 16px;border-top:1px solid var(--line);vertical-align:top}
.syn4 tbody tr:nth-child(even){background:var(--soft)}
.syn4 tbody tr:hover{background:#f0f0ec}
.syn4 .u{font-family:'Geist Mono',monospace;font-size:.82rem;background:#f0f0ec;padding:2px 7px;border-radius:5px;display:inline-block;word-break:break-all}
.syn4 .u.new{background:#eef7e0}
.syn4 .tag{font-size:.76rem;color:var(--muted);border:1px solid var(--line);padding:2px 8px;border-radius:6px;white-space:nowrap}
.syn4 .b{display:inline-flex;align-items:center;gap:5px;font-size:.74rem;font-weight:600;padding:3px 10px;border-radius:999px;white-space:nowrap}
.syn4 .b::before{content:'';width:6px;height:6px;border-radius:50%}
.syn4 .b.ok{background:var(--ok-bg);color:var(--ok-tx)}.syn4 .b.ok::before{background:var(--ok-tx)}
.syn4 .b.todo{background:var(--todo-bg);color:var(--todo-tx)}.syn4 .b.todo::before{background:var(--todo-tx)}
.syn4 .foot{font-size:.82rem;color:var(--muted);margin-top:12px}.syn4 .foot strong{color:var(--ink);font-weight:600}
.syn4 .lbl{display:none}
@media(max-width:720px){
.syn4 thead{display:none}
.syn4 table,.syn4 tbody,.syn4 tr,.syn4 td{display:block;width:100%}
.syn4 tbody tr{border-top:1px solid var(--ink);padding:6px 0}.syn4 tbody tr:first-child{border-top:none}.syn4 tbody tr:nth-child(even){background:transparent}
.syn4 tbody td{border-top:none;padding:7px 16px;display:flex;gap:12px;align-items:flex-start}
.syn4 .lbl{display:block;flex:0 0 38%;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600;padding-top:2px}
.syn4 .v{flex:1 1 auto;min-width:0}}
</style>
<div class="h"><span class="num">Phase 6</span><h3 class="t">Redirections 301</h3></div>
<p class="s">À saisir dans Settings → Publishing → 301 Redirects <strong>avant</strong> toute publication, pour éviter les erreurs 404.</p>
<div class="card"><table>
<thead><tr><th>Old URL</th><th>New URL</th><th>Type</th><th>Testé</th></tr></thead>
<tbody>
<tr><td><span class="lbl">Old URL</span><span class="v"><span class="u">/about</span></span></td><td><span class="lbl">New URL</span><span class="v"><span class="u new">/a-propos</span></span></td><td><span class="lbl">Type</span><span class="v"><span class="tag">Auto Webflow</span></span></td><td><span class="lbl">Testé</span><span class="v"><span class="b todo">À tester</span></span></td></tr>
<tr><td><span class="lbl">Old URL</span><span class="v"><span class="u">/blog/our-story</span></span></td><td><span class="lbl">New URL</span><span class="v"><span class="u new">/blog/notre-histoire</span></span></td><td><span class="lbl">Type</span><span class="v"><span class="tag">Manuel (CMS)</span></span></td><td><span class="lbl">Testé</span><span class="v"><span class="b todo">À tester</span></span></td></tr>
<tr><td><span class="lbl">Old URL</span><span class="v"><span class="u">/case-studies</span></span></td><td><span class="lbl">New URL</span><span class="v"><span class="u new">/etudes-de-cas</span></span></td><td><span class="lbl">Type</span><span class="v"><span class="tag">Manuel (CMS)</span></span></td><td><span class="lbl">Testé</span><span class="v"><span class="b ok">Testé</span></span></td></tr>
</tbody></table></div>
<p class="foot"><strong>Vérifier :</strong> pas de faute de frappe, les URLs commencent par <span class="u">/</span>, et l'ancienne URL correspond exactement à ce qui était en ligne.</p>
</div>
Dans Webflow, aller dans Settings > Publishing > 301 Redirects Pour chaque ligne du fichier de mapping où l'URL a changé :Dans Old URL : entrer l'ancienne URL (ex : /blog/our-story) Dans New URL : entrer la nouvelle URL (ex : /blog/notre-histoire) Cliquer sur Add Redirect Répéter pour chaque URL modifiée Étape 6.2 - Vérifier les redirections Avant de publier, vérifier que chaque redirection est bien saisie :
Pas de faute de frappe Les URLs commencent bien par / L'ancienne URL correspond exactement à ce qui était en ligne Étape 6.3 - Cas particuliers Liens internes dans le contenu : Rechercher dans le CMS et le Designer tous les liens qui pointent vers les anciennes URLs et les mettre à jourLiens dans la navbar et le footer : Les mettre à jour manuellement dans les composants globauxPhase 7 : Éléments souvent oubliés Checklist à cocher avant de publier.
Éléments globaux [ ] Navbar — tous les liens et textes traduits [ ] Footer — textes, liens, mentions légales [ ] Boutons CTA sur toutes les pages [ ] Bannières / pop-ups / barres d'annonce SEO [ ] SEO Title traduit sur toutes les pages [ ] Meta Description traduite sur toutes les pages [ ] Open Graph Title et Description (partage réseaux sociaux) [ ] Alt text des images principales Formulaires [ ] Labels de tous les champs [ ] Textes placeholder [ ] Messages de confirmation [ ] Messages d'erreur [ ] Email de notification (côté client et interne) Pages système [ ] Page 404 traduite [ ] Page de mot de passe (si site protégé) Tracking & Analytics [ ] Vérifier que les événements Google Analytics sont toujours déclenchés [ ] Vérifier que Google Tag Manager fonctionne [ ] Vérifier les conversions dans Google Ads si applicable [ ] Informer @James Brunetto pour mettre à jour les URLs dans les campagnes actives Phase 8 : Publier & Tester Ne jamais publier sans avoir terminé les phases 1 à 7.
Étape 8.1 - Publier le site Vérifier une dernière fois que toutes les redirections 301 sont en place Publier le site depuis Webflow Vider le cache si un CDN est utilisé (Cloudflare, etc.) Étape 8.2 - Tester toutes les pages Pour chaque ancienne URL du fichier de mapping :
Entrer l'ancienne URL dans le navigateur Vérifier qu'elle redirige bien vers la nouvelle URL (et non une erreur 404) Cocher "Testé ✅" dans le fichier de mapping Étape 8.3 - Tester les formulaires Remplir et soumettre chaque formulaire du site Vérifier que l'email de confirmation est reçu en français Vérifier que la notification interne fonctionne Étape 8.4 - Vérifier sur mobile Tester la navigation sur smartphone Vérifier que les textes ne débordent pas avec les nouveaux mots français (souvent plus longs qu'en anglais) Phase 9 : Après publication SEO - à faire dans les 48h Aller sur Google Search Console Aller dans Sitemaps Soumettre le nouveau sitemap : https://votresite.com/sitemap.xml Demander l'indexation des pages principales via Inspection d'URL > Demander l'indexation Note : Une baisse temporaire de trafic organique est normale pendant 2 à 4 semaines, le temps que Google ré-indexe toutes les pages. C'est attendu.
Liens externes - à mettre à jour [ ] Profil Google Business [ ] Page LinkedIn de l'entreprise [ ] Autres réseaux sociaux (Instagram, Facebook, etc.) [ ] Signatures email de l'équipe [ ] Annuaires et mentions externes si possible Suivi post-migration Surveiller Google Search Console pendant 4 semaines (erreurs 404, couverture d'index) Surveiller Google Analytics pour détecter toute anomalie de trafic Informer l'équipe marketing des nouvelles URLs pour les prochaines campagnes Ressources utiles &amp;amp;lt;style&amp;amp;gt;
.slq-lw2-wrap { overflow: hidden; margin: 24px 0; border-radius: 8px; border: 1px solid #e5e5e5; }
.slq-lw2-tbl { width: 100%; border-collapse: collapse; font-family: inherit; }
.slq-lw2-tbl thead { background: #1a1a1a; }
.slq-lw2-tbl th { text-align: left; padding: 14px 16px; color: #fff; font-weight: 600; font-size: 14px;
border-bottom: 2px solid #000; }
.slq-lw2-tbl td { padding: 14px 16px; border-bottom: 1px solid #e5e5e5; font-size: 14px; vertical-align: top;
}
.slq-lw2-tbl tbody tr:last-child td { border-bottom: none; }
.slq-lw2-tbl tbody tr:hover td { background-color: #f9f9f9; }
.slq-lw2-tbl a { color: inherit; text-decoration: underline; }
@media (max-width: 768px) {
.slq-lw2-tbl thead { display: none; }
.slq-lw2-tbl, .slq-lw2-tbl tbody, .slq-lw2-tbl tr, .slq-lw2-tbl td { display: block; width: 100%; }
.slq-lw2-tbl tr { margin-bottom: 12px; padding: 16px; border: 1px solid #e5e5e5; border-radius: 8px;
background: #fff; }
.slq-lw2-tbl td { padding: 6px 0; border: none; display: flex; justify-content: space-between; align-items:
flex-start; gap: 8px; }
.slq-lw2-tbl td::before { content: attr(data-label); font-weight: 600; color: #1a1a1a; flex-shrink: 0;
min-width: 40%; font-size: 13px; }
}
&amp;amp;lt;/style&amp;amp;gt;&amp;amp;lt;div class="slq-lw2-wrap"&amp;amp;gt;&amp;amp;lt;table class="slq-lw2-tbl"&amp;amp;gt;&amp;amp;lt;thead&amp;amp;gt;&amp;amp;lt;tr&amp;amp;gt;&amp;amp;lt;th&amp;amp;gt;Outil&amp;amp;lt;/th&amp;amp;gt;&amp;amp;lt;th&amp;amp;gt;Usage&amp;amp;lt;/th&amp;amp;gt;&amp;amp;lt;th&amp;amp;gt;Lien&amp;amp;lt;/th&amp;amp;gt;&amp;amp;lt;/tr&amp;amp;gt;&amp;amp;lt;/thead&amp;amp;gt;&amp;amp;lt;tbody&amp;amp;gt;&amp;amp;lt;tr&amp;amp;gt;&amp;amp;lt;td data-label="Outil"&amp;amp;gt;Screaming Frog&amp;amp;lt;/td&amp;amp;gt;&amp;amp;lt;td data-label="Usage"&amp;amp;gt;Exporter toutes les URLs&amp;amp;lt;/td&amp;amp;gt;&amp;amp;lt;td data-label="Lien"&amp;amp;gt;&amp;amp;lt;a href="https://www.screamingfrog.co.uk/seo-spider/" target="_blank" rel="noopener"&amp;amp;gt;screamingfrog.co.uk&amp;amp;lt;/a&amp;amp;gt;&amp;amp;lt;/td&amp;amp;gt;&amp;amp;lt;/tr&amp;amp;gt;&amp;amp;lt;tr&amp;amp;gt;&amp;amp;lt;td data-label="Outil"&amp;amp;gt;Google Search Console&amp;amp;lt;/td&amp;amp;gt;&amp;amp;lt;td data-label="Usage"&amp;amp;gt;Suivi SEO &amp;amp;amp;amp; soumission sitemap&amp;amp;lt;/td&amp;amp;gt;&amp;amp;lt;td data-label="Lien"&amp;amp;gt;&amp;amp;lt;a href="https://search.google.com/search-console" target="_blank" rel="noopener"&amp;amp;gt;search.google.com&amp;amp;lt;/a&amp;amp;gt;&amp;amp;lt;/td&amp;amp;gt;&amp;amp;lt;/tr&amp;amp;gt;&amp;amp;lt;tr&amp;amp;gt;&amp;amp;lt;td data-label="Outil"&amp;amp;gt;Redirect Checker&amp;amp;lt;/td&amp;amp;gt;&amp;amp;lt;td data-label="Usage"&amp;amp;gt;Vérifier les redirections 301&amp;amp;lt;/td&amp;amp;gt;&amp;amp;lt;td data-label="Lien"&amp;amp;gt;&amp;amp;lt;a href="https://www.redirect-checker.org/" target="_blank" rel="noopener"&amp;amp;gt;redirect-checker.org&amp;amp;lt;/a&amp;amp;gt;&amp;amp;lt;/td&amp;amp;gt;&amp;amp;lt;/tr&amp;amp;gt;&amp;amp;lt;tr&amp;amp;gt;&amp;amp;lt;td data-label="Outil"&amp;amp;gt;Webflow University&amp;amp;lt;/td&amp;amp;gt;&amp;amp;lt;td data-label="Usage"&amp;amp;gt;Documentation Localization&amp;amp;lt;/td&amp;amp;gt;&amp;amp;lt;td data-label="Lien"&amp;amp;gt;&amp;amp;lt;a href="https://university.webflow.com/" target="_blank" rel="noopener"&amp;amp;gt;university.webflow.com&amp;amp;lt;/a&amp;amp;gt;&amp;amp;lt;/td&amp;amp;gt;&amp;amp;lt;/tr&amp;amp;gt;&amp;amp;lt;/tbody&amp;amp;gt;&amp;amp;lt;/table&amp;amp;gt;&amp;amp;lt;/div&amp;amp;gt;