Vous vous demandez comment réussir la refonte de votre site web ? Découvrez dans notre guide complet les étapes pour réussir votre projet de refonte, tout en conservant votre référencement naturel SEO. Dans cet article nous aborderons différents termes et sujets clés dont quelques aspects techniques.
Une refonte de site internet est un pilier d’une stratégie de branding, découvrez comment la réussir
La refonte d’un site internet est un moment important pour une entreprise. Cette refonte peut avoir lieu dans le cadre d’un changement d’image de marque, une amélioration d’un site existant ou autres. Un projet de refonte doit être mis en place de façon pragmatique et réfléchie favorisant l’expérience utilisateur et l’amélioration de sa notoriété, tout en conservant ses positionnements dans les SERPs de Google.
De plus, avant de commencer ce type de projet, il est vivement conseillé, voire indispensable de concevoir un cahier des charges répertoriant l’ensemble des fonctionnalités et des attentes. Par exemple, chez FD360, certains de nos cahiers des charges peuvent atteindre 10 pages A4.
Étape 1. Audit du site actuel
Un audit de site est primordial pour permettre de ressortir les points forts et les points faibles de votre site existant. Cela permet de lister l’ensemble de vos pages, vos URLs, et d’avoir une vue d’ensemble sur les erreurs existantes nécessitant d’être retravaillés. Lorsqu’une entreprise souhaite refondre son site, tant qu’à faire, il vaut mieux corriger les soucis au lieu de les déplacer sur le nouveau site. Un audit peut être fait avec différents logiciels spécialisés dans le référencement naturel SEO. Par exemple, notre agence, FD360, utilise Semrush et Screaming Frog permettant d’avoir une vue 360°.
Outils pour réaliser un un audit SEO
Il faut savoir que l’utilisation de Semrush est payante. C’est un logiciel performant sous forme de SaaS (Software As A Service). Au contraire, Screaming Frog dispose d’une version gratuite qui peuvent convenir aux sites de petites tailles, même si vous ne pouvez pas utiliser l’ensemble des fonctionnalités.
Semrush
Ce logiciel lancé en 2008 permet une analyse complète du référencement naturel SEO avec d’excellents indicateurs SEA. Chez FD360, nous nous en servons pour l’analyse concurrentielle, la recherche de mots-clés et l’audit SEO d’un site internet.
Screaming Frog
Screaming Frog, quant à lui, est spécialement développé pour les audits les plus complets. Il permet d’avoir une vue complète sur les aspects techniques, le SEO on-page, mais également des indicateurs sur le contenu dupliqué interne au site. De plus, ce logiciel permet également d’obtenir les textes d’ancrages et autres indicateurs importants pour le référencement.
Étape 2. Maquette de site internet responsive design
Une maquette de site internet permet d’avoir une vision globale de son projet avant le déploiement en ligne. Plusieurs logiciels permettent de concevoir une maquette. Ce type de projet permet de définir la mise en page, le design, les choix typographiques, mais également de prévisualiser le projet de façon Responsive (adaptée à toutes tailles d’écrans).
Outils pour concevoir une maquette
Adobe XD
Parmi les logiciels de design les plus utilisés, nous retrouvons Adobe XD, inclus dans les pack Créative Cloud d’Adobe. Ce logiciel permet de travailler les maquettes, tout comme les prototypes interactifs.
Figma
Depuis quelques années Figma est un logiciel de plus en plus utilisé. Il offre différentes offres dont une gratuite pour permettre une utilisation personnelle.
Conception d’une maquette au design sur mesure et captivante
Entreprendre son design est une étape importante dans le cadre d’une refonte de son site web. Non seulement cela joue un rôle majeur dans l’expérience utilisateur, mais aussi indirectement dans son positionnement sur les moteurs de recherche. En SEO, on dit que l’UX est devenu l’un des piliers clés. En effet, Google utilise différents indicateurs pour classer les pages dans les résultats de recherche.
Parmi certains indicateurs nous retrouvons le temps passé sur vos pages, le taux de rebond d’un site internet. Plus vous soignerez votre design, votre mise en page, plus fort sera l’engagement de vos visiteurs et de vos internautes, et meilleurs seront les signaux envoyés à Google ou autres robots.
Travaillez la structure du site
La structure permet à l’utilisateur de pouvoir naviguer de façon intuitive sur votre site. Cela permet l’amélioration du temps passé sur vos pages. De plus, une structure claire et cohérente, permet à Google d’indexer plus facilement votre contenu, vos pages, mais plus important encore, cela lui permet de mieux comprendre votre thématique.
Lorsque vous concevez votre architecture, n’oubliez pas que vous la créez pour vos visiteurs, et non pour les moteurs de recherche.
Le référencement SEO, n’est pas un sprint, mais bien un marathon !
Étape 3. Choix du CMS ou développement sur-mesure
Vous vous retrouvez à une étape clé pour votre projet de refonte de site. Quel système de gestion de contenu utiliser ? Dois-je partir sur un CMS open source, un CMS propriétaire, ou encore un développement From Scratch ? Il n’y a pas de réponse miracle. Cela dépend de la façon dont vous créer votre site, de la manière dont il a été pensé, mais aussi travaillé.
Développer un site From Scratch sans penser au SEO ne vous permettra pas d’être mieux positionné qu’un site Wix qui a été référencé, et qui pourtant sera bien plus lourd avec des temps de chargement bien plus élevés que des sites entièrement conçus sur mesure.
La sélection doit se faire par rapport à votre budget et vos besoins. En règle générale, notre agence recommande WordPress qui est adapté à une grande majorité de projets.
WordPress
WordPress est un CMS open source (avec un accès au code source). Il s’agit du CMS le plus répandu à l’échelle mondiale. Il permet de concevoir tous types de sites internet adaptés à son image de marque. En optant pour un thème léger, avec un minimum de plugins, vous obtenez un site avec un code propre et optimisé pour le référencement.
Difficulté d’utilisation et de personnalisation : 5,5/10
Prestashop
PrestaShop est également un CMS open source, très répandu pour les sites spécialisés e-commerce. Il embarque de multiples fonctionnalités pour les boutiques en ligne inclus dans le cœur même du CMS, et ce, sans modules complémentaires. Le code est optimisé pour le référencement, ce qui en fait un choix parfait pour le e-commerce.
Difficulté d’utilisation et de personnalisation : 7,5/10
Wix
Wix est un outil permettant de concevoir des sites web par glisser/déposer. Il est basé sur un modèle économique sous forme de mensualité. Il comprend de multiples fonctionnalités et permet un de créer des designs rapidement. Contrairement à un site sous CMS open source, un site développé avec Wix ne vous appartient pas.
Difficulté d’utilisation et de personnalisation : 3,5/10
Développement From Scratch
Ce type de projet nécessite souvent soit de solides compétences en développant, soit de faire appel à une agence telle que FD360 pour vous accompagner efficacement. Ce type de site permet d’obtenir un projet entièrement développé pour vous et vos problématiques. Différents frameworks sont disponibles pour ce type de développement.
Dans notre cas, nous utilisons en règle générale : ReactJs, NodeJs, Express pour la conception d’un site From Scratch. Bien optimisé pour les moteurs de recherche, un site avec ReactJs et NodeJs permet d’obtenir des sites avec des temps de chargement extrêmement rapides.
Étape 4. Analyse concurrentielle
Ensuite, vous passez à la partie de l’analyse concurrentielle, incluant la recherche de mots-clés. Pour ce faire, le logiciel Semrush est excellent pour analyser vos concurrents et faire une analyse de mots-clés.
Si vous n’utilisez pas Semrush, vous pouvez utiliser l’outil de planification des mots-clés de Google Ads. Cet outil gratuit permet de faire ressortir le nombre de recherches mensuel. Misez sur des mots-clés de longue traîne pour permettre d’obtenir du trafic plus qualifié, et d’atténuer la difficulté de positionnement dans les SERPs.
Les mots-clés génériques permettent d’avoir un grand nombre de recherches mensuelles. Cependant, les sites qui sont présents ont souvent beaucoup d’ancienneté, de nombreux backlinks, et une forte autorité de domaine. De plus, ce type de termes de recherche obtient souvent du trafic moins qualifié que la longue traîne.
Si vous êtes une PME, une Start-up, ou une grande entreprise, vous arriverez, avec du travail qualifié, à atteindre la première page. Pour les plus petites entreprises, il vous sera bien plus compliqué d’y arriver sans investissement conséquent.
Étape 5. Optimisation des URLs
Google et les autres moteurs de recherche prennent en compte les optimisations des URLs. Il s’agit d’un indicateur pertinent, mais aussi un critère facile à mettre en place sur un projet.
Chemin Logique et structure du projet
Tout d’abord, parlons de la logique et de la structure de vos URLs. Dans un premier temps, et je ne le répéterai jamais assez, vous concevez votre site avant tout pour vos visiteurs. Alors, soyez clair, structuré, mais surtout naturel.
Si vous vendez des chaussure pour hommes, vos URLs pourrait ressembler à ceci :
- Page catégorie : nom-de-domaine.fr/chaussures/
- Page catégorie : nom-de-domaine.fr/chaussures/hommes/
- Page produit : nom-de-domaine.fr/chaussures/hommes/tennis-de-sport-noir/
Évitez les répétitions multiples telle que :
nom-de-domaine/chaussures/chaussures-pour-homme/chaussure-de-sport-noir-homme/
- ou /chaussures/ = catégorie recensant femme et homme
- /chaussures-pour-homme/ = catégorie thématique homme
- /chaussure-de-sport-noir-homme/ = Page produit
Vous en conviendrez, l’URL a été pensé pour les mots-clés et pour Google mais pas pour les internautes de votre site
Mots-clés dans les URLs
L’utilisation des termes de recherche doit être inclus dans les URLs de manière naturelle. Dans l’exemple précédant, grâce à cette structure, Google et les robots des moteurs de recherche vont facilement comprendre que votre page produit est une sous-page des pages du niveau précédent.
Sur un site vitrine, en fonction de votre nombre de pages, vous aurez peut-être des URLs plates.
Prenons l’exemple d’un couvreur ciblant le mot-clé couvreur cognac. Son URL pourrait-être :
- nom-de-domaine.fr/artisan-couvreur-cognac/
- Ou simplement : nom-de-domaine.fr/couvreur-cognac/
Évitez les URLs à rallonge avec du bourrage de mots-clés :
nom-de-domaine.fr/artisan-couvreur-charpentier-cognac-specialises-toiture-couverture/
Non seulement cela ne permet pas d’atteindre le top 3, mais cela est également considéré comme de la manipulation algorithmique.
Étape 6. Rédaction de contenus et optimisation SEO des images
Tout d’abord, il faut savoir que Google juge les sites par rapport aux temps de chargement des pages. Plus un site charge vite, moins le site gaspille du budget crawl et plus vite le robot passera à nouveau sur site. La performance et la technicité sont des facteurs essentiels au référencement web. Pour ce faire, redimensionner vos images et compresser les. Évitez les images supérieures à 200 Ko. De plus, pensez à rédiger des contenus de haute qualité tout en utilisant un champ lexical varié autour de son mot-clé principal. Écrivez pour l’internaute avant Google. De plus, rédigez vos contenus de façon naturelle.
Comment fonctionne la balise ALT
De plus, il faut également savoir que chaque image doit avoir un attribut ALT, qu’il soit rédigé ou non. Par défaut, les CMS appliquent cette balise aux images. Si l’image est purement décoratif, laissez le vide. Au contraire, s’il s’agit d’une image qui illustre votre site, alors rédigez-la. Vous pouvez inclure des mots-clés naturels et le champ lexical de votre terme principal.
Étape 7. Intégration du Lazy Load et de la mise en cache
Entrons sur la partie un peu plus technique, mais facile à mettre en place sur un CMS. Tout d’abord, le Lazy Load permet le chargement différé de vos images. Les images se chargeront juste avant d’entrer dans le viewport (visible à l’écran). Cela permet d’alléger considérablement le temps de chargement de vos pages, surtout si vous avez beaucoup d’images comme un e-commerce. La mise en cache, quant à elle, permet d’accélérer le rendu de vos pages.
Lazy Load en HTML
Voici un exemple illustrant son utilisation dans du HTML (Hypertext Markup Language).
<img src="/uploads/mon-image.jpg" lazy ="loading">Ce simple ajout de lazy = “loading” suffit pour le chargement paresseux.
Lazy Load sous WordPress
En règle générale, les thèmes et ou les constructeurs de pages offrent cette solution. Cependant, si vous avez un e-commerce, mais que vous n’avez pas cette option. Vous pouvez ajouter ceci dans votre thème enfant. Cela cible les images produits WooCommerce et vous ajoutera le Lazy Load.
<script>
document.addEventListener("DOMContentLoaded", function() {
if (document.querySelector('body').classList.contains('woocommerce')) {
var productImages = document.querySelectorAll('ul.products li.product img');
productImages.forEach(function(img) {
img.setAttribute('loading', 'lazy');
});
}
});
</script>Mise en cache des pages
La mise en cache côté front-end consiste à stocker temporairement des ressources ou des pages web directement sur le navigateur de l’utilisateur pour accélérer le chargement lors des visites suivantes. Elle réduit le nombre de requêtes vers le serveur et améliore l’expérience utilisateur.
Mise en cache côté serveur web
La mise en cache côté serveur consiste à stocker des versions pré-générées de pages web, de contenus dynamiques ou de résultats de calculs sur le serveur. Cela permet de répondre beaucoup plus rapidement aux requêtes des utilisateurs, sans avoir à recalculer ou regénérer entièrement la page à chaque visite. En pratique, le serveur peut servir directement ces versions mises en cache, ce qui réduit significativement la charge sur la base de données, améliore les performances globales du site et assure une expérience utilisateur plus fluide, même lors de pics de trafic importants.
Étape 8. Mettre en place un certificat SSL
Le certificat SSL, facilement identifiable grâce au « https » dans l’URL, permet de chiffrer les informations lorsqu’un visiteur se connecte à votre site internet. Contrairement au http, qui fait transiter les données en clair sur le réseau, le SSL assure la sécurité des échanges. Il est désormais devenu un standard incontournable, même si certains sites ne l’utilisent pas encore. C’est un critère essentiel, tant pour la confiance de vos visiteurs que pour le référencement sur les moteurs de recherche. La mise en place est simple, et la plupart des hébergeurs proposent des certificats SSL.
Vous cherchez un hébergement performant pour vos sites web ? FD360 inclut également les certificats SSL pour les sites hébergés chez nous. Nous réalisons également la mise à jour de vos certificats tous les 3 mois.
Étape 9. Mettre en place les Redirections 301, une étape primordiale pour conserver son SEO
La redirection 301 permet de rediriger définitivement une URL vers une autre, transférant ainsi l’autorité et le référencement de l’ancienne page vers la nouvelle. Lors d’une refonte de site internet, elle est essentielle pour éviter les erreurs 404 et préserver le SEO acquis, en garantissant que vos visiteurs et les moteurs de recherche trouvent les bonnes pages.
Utilisation des redirections page par page
En fonction de vos besoins et de la taille de votre site web, il est possible de rediriger les pages une par une à l’aide des redirections 301. La méthode la plus simple consiste à ouvrir votre fichier .htaccess, accessible à la racine de votre site internet. Une redirection page par page se présente ainsi :
RedirectPermanent "/page-1/" "https://fd360.fr/page-2/"Comment cela fonctionne :
- RedirectPermanent : directive Apache du module mod_alias utilisée pour créer une redirection 301 permanente d’une URL vers une autre.
- « /page-1/ » : l’URL actuelle de la page, sans le nom de domaine, uniquement le chemin.
- « https://fd360.fr/page-2/ » : la nouvelle URL de destination, URL complète à indiquer pour que la redirection fonctionne correctement.
Redirigez les catégories
Lorsqu’une catégorie change d’URL lors d’une refonte, il est possible de rediriger toute la catégorie et ses sous-pages vers la nouvelle catégorie à l’aide d’une redirection 301 avec une règle mod_rewrite dans le fichier .htaccess.
RewriteEngine On
RewriteRule ^ancienne-categorie/(.*)$ https://fd360.fr/nouvelle-categorie/$1 [R=301,L]Explications :
- RewriteEngine On : active le module mod_rewrite d’Apache.
- ^ancienne-categorie/(.*)$ : correspond à toutes les URLs qui commencent par /ancienne-categorie/ (y compris toutes les sous-pages).
- https://fd360.fr/nouvelle-categorie/$1 : $1 conserve le chemin de la sous-page dans la nouvelle catégorie.
- [R=301,L] : indique une redirection 301 permanente et stoppe le traitement des autres règles.
Cette méthode permet de rediriger automatiquement toutes les pages d’une catégorie vers la nouvelle, sans avoir à créer une redirection pour chaque page individuellement.
Étape 10. Informez Google de votre projet de refonte
Informer Google de votre refonte est une étape essentielle pour maintenir votre référencement et éviter toute perte de trafic. Que vous changiez de structure de site ou de nom de domaine, signaler ces modifications permet aux moteurs de recherche de réindexer rapidement vos nouvelles pages et de comprendre l’évolution de votre site. Cela inclut notamment la mise à jour des Sitemaps XML et l’indication de tout changement de domaine afin que Google puisse rediriger correctement le trafic et préserver votre SEO.
Indiquez à Google si vous avez changé de nom de domaine
Si vous avez changé de nom de domaine lors de votre refonte, il est essentiel de le signaler à Google via la Search Console. Cela permet de transférer le référencement de l’ancien domaine vers le nouveau et d’éviter une perte de trafic organique. Il vous suffit simplement de vous connecter à votre Search Console puis :
- Allez dans paramètre
- Puis dans Changement Adresse
- Entrez ensuite la nouvelle adresse de votre site
Renseignez vos Sitemaps XML
Pour pouvoir soumettre vos sitemaps, toujours dans la Google Search Console :
- Allez dans l’onglet Sitemaps
- Si vos URLs de sitemaps ne sont plus bonnes, supprimez les sitemaps existants, puis soumettez les nouvelles URLs à Google
Votre refonte est prête, au fil du temps vous pouvez ajouter de nouvelles fonctionnalités favorisant l’UX
Une fois votre refonte terminée, vous pouvez progressivement ajouter de nouvelles fonctionnalités pour améliorer l’expérience utilisateur (UX) et optimiser l’interaction avec vos visiteurs. Cela permet d’adapter votre site aux besoins évolutifs de votre audience.
Il faut également savoir que Google peut mettre plusieurs semaines avant de digérer l’intégralité de votre refonte. Si vous constatez une baisse d’impressions sur la Search Console, ne paniquez pas. Google doit prendre en compte l’ensemble des changements. Attendez quelques semaines : si tous les points ont bien été respectés, vos positionnements reviendront.
Points importants : Ne négligez pas la stratégie SEO lors d’une refonte de site internet
Le SEO ne se limite pas aux redirections et aux Sitemaps : il inclut également l’optimisation des contenus, des balises HTML (titres, meta-descriptions), de la structure des URLs, de la vitesse de chargement, de l’accessibilité mobile et de l’expérience utilisateur. Pensez aussi au maillage interne, aux backlinks et à l’indexation par les moteurs de recherche. Une approche SEO globale dès la refonte garantit que votre site conserve ses positionnements, améliore son trafic organique et reste performant sur le long terme.
