Refonte de site internet
Qu'est-ce que c'est ?
La refonte d'un site web existant implique de rénover un site existant pour améliorer certains cotés. Il existe divers types de refonte de votre site web. On peut parler de refonte partielle si seulement une partie est mise à jour et de refonte totale si tout le site doit être rénové. Les aspects graphiques, rédactionnels et fonctionnels seront remodelés pour être en adéquation avec les dernières pratiques du web. Il ne s'agit pas forcément d'une nouvelle création d'un site web mais de la mise en place d'améliorations par l'agence web.
Il est recommandé de refondre complètement votre site actuel environ tous les cinq ans pour le tenir à jour et en harmonie avec les habitudes des utilisateurs. Toutefois, il est plus judicieux de faire des mises à jour régulières et éventuellement des refontes partielles en fonction des objectifs et des besoins de votre entreprise.
Cette dernière option consistera à remodeler uniquement les éléments du backend ou du frontend (de la page d accueil aux pages profondes) . Il est fréquent pour l'agence web de ne retravailler que la partie graphique ou uniquement le contenu et la stratégie de référencement naturel.
Pourquoi refaire son site ?
Vous disposez d'un site vitrine ou e-commerce mais il ne vous permet plus d'atteindre vos objectifs de communication, commerciaux car votre organisation a simplement évolué.
En vous proposant la meilleure conception, les meilleurs outils (choix du CMS et des technologies) et les meilleures interfaces (tendances design, responsive, mobile first, expérience utilisateur etc...), notre mission principale est de vous accompagner sur l’analyse de vos objectifs :
- Repositionnement commercial
- Augmentation du trafic (Référencement, campagnes, ...)
- Augmentation des ventes (boutique en ligne) ou de la visibilité (site vitrine, site institutionnel)
- Demandes de contact ou devis
- Renouvellement de votre image de marque
- changement de solution technique (CMS ou Framework)
Repositionnement stratégique
Refondre son site internet sert souvent à mettre à jour le site par rapport à une offre commerciale qui a évolué et à repositionner la marque de l'entreprise par rapport aux nouvelles demandes de ses clients. Ce repositionnement marketing (ou de l'image de marque) s'accompagne souvent de nouveaux messages, accroches et d'une communication visuelle repensée. Etant donné que la plupart des entreprises ont déjà un site web, la majorité de nos actions consiste à les accompagner pour atteindre leur nouveaux objectifs stratégiques.
La refonte graphique
Le design est l'un des éléments clés à travailler lors d'une refonte de site. Un petit audit sera effectué pour discuter avec le client de ses souhaits, de ses idées et de ses besoins. Dans le cas d'une refonte d'identité avec évolution de la charte graphique, qui est souvent la base d'une refonte de site en général, il est crucial d'échanger avec le client et d'étudier la concurrence pour remodeler le design de manière à refléter parfaitement l'entreprise. Une recherche graphique et visuelle sera alors entreprise avant de lancer la création de la maquette. La page d'accueil sera la première à être créée, afin que le client puisse avoir une vision d'ensemble de son futur site. Une fois validée, les pages internes seront déclinées.
Selon les besoins, un zoning et le wireframing peuvent être effectués avant la maquette pour créer une première ébauche du futur site.
Ainsi, cette refonte graphique permettra non seulement d'obtenir un design moderne et cohérent avec l'identité de la marque, mais aussi d'améliorer l'ergonomie globale du site. En effet, une fois l'audit terminé, la nouvelle maquette sera l'occasion de supprimer les mauvais CTA et les boutons sans lien, ce qui améliore considérablement l'expérience utilisateur.
Une fois la maquette de la première page validée par le client, il sera temps de passer à la partie technique de la refonte de site: le développement et l'intégration des contenus.
La refonte structurelle
Lors de la refonte d'un site web, la dimension technique des pages web est cruciale et il est essentiel d'avoir une expertise avancée en développement et intégration. Pour obtenir un site cohérent qui répond aux besoins du client, il est nécessaire de clarifier les attentes et les objectifs en amont. La structure (la structure en squelette) du site sera développée pour déterminer les pages existantes qui seront conservées et les nouvelles pages à créer. Une fois les catégories établies, la structure du nouveau site pourra prendre forme et être développée.
Après avoir créé les contenus en fonction de la structure et optimisés pour le référencement, ils peuvent être intégrés au nouveau site web. En fonction du cahier des charges préétabli, le code sera également révisé pour ajouter de nouvelles fonctionnalités.
Améliorer sa visibilité
une des autres raisons de refaire son site est d'améliorer sa visibilité sur les moteurs de recherche au travers d'un référencement naturel plus efficace. En travaillant les mots clés on arrive à remonter les pages du site dans les résultats de recherche. Un audit SEO doit alors être réalisé en amont de la refonte mais peut aussi être proposé en tant que prestation régulière lors d'un suivi mensuel par exemple. Travailler l'accessibilité sur les smartphones pour un affichage responsive design et réduire les temps de chargement contribuent largement à cette optimisation.
Améliorer le taux de conversion
Améliorer la visibilité par le référencement naturel n'est que la première étape car une fois arrivé sur votre site il faut que le visiteur reste et suive le parcours vers vos pages et formulaires cibles. Un site, dès sa mise en ligne, doit être vu comme un outil qui transforme des visiteurs en prospects, voire en clients. Tout comme dans une boutique physique, le site accompagne l'internaute vers un achat ou une demande de devis ou de contact. Une des raisons principales de refaire son application web est de diminuer la perte en ligne c'est à dire le pourcentage de visiteurs qui partent sans être "passés à la caisse". Il faut mettre en place une expérience utilisateur complète adéquate.
Bien gérer le projet de refonte du site internet
Les principales erreurs à surmonter :
- aborder la question de refonte sous un angle purement technique: la refonte est souvent motivée pour des considération de communication ou de stratégie
- traiter le projet selon une approche strictement graphique (relookage)
- bien définir vos nouveaux besoins et vos objectifs selon votre budget
Lorsqu'on se lance dans la création et la refonte d'un site internet, il est nécessaire de suivre quelques étapes clefs :
- l'architecture de l'information : ce que j'ai à dire, comment je le structure ; Ce qui était principal avant ne l'est plus forcément;
- la production ou la reprise de contenus : en cohérence avec la nouvelle structure prédéfinie et le nouveau positionnement marketing;
- les approches graphique et ergonomique : la charte a-t-elle changée? ;
- l'architecture technique et la phase de développement: les technologies web évoluent vite ;
- le référencement (naturel et payant).
Les 10 étapes pour réussir la refonte de votre site internet
La refonte d'un site internet est un processus complexe qui nécessite une planification et une exécution minutieuses. Voici les 10 étapes essentielles pour réussir la refonte d'un site web, développées en un texte de 500 mots environ.
Évaluation des besoins et objectifs : Avant de commencer, il est crucial de comprendre pourquoi la refonte est nécessaire. Déterminez les objectifs spécifiques tels que l'amélioration de l'expérience utilisateur, l'augmentation du trafic, ou l'optimisation pour les mobiles. Analysez le site actuel pour identifier les points forts à conserver et les faiblesses à améliorer.
Analyse de l'audience et de la concurrence : Comprendre votre public cible est fondamental. Analysez les données démographiques, les comportements des utilisateurs, et leurs besoins. Étudiez également vos concurrents pour découvrir des opportunités d'innovation et de différenciation.
Identification des concurrents : Tout d'abord, il est important d'identifier les principaux concurrents dans votre domaine d'activité. Cela peut inclure des entreprises offrant des produits ou services similaires ou ciblant le même public.
Analyse des sites concurrents : Une fois les concurrents identifiés, il est temps d'analyser leurs sites internet. Cela comprend l'examen de leur design, de leur contenu, de leur structure de navigation, de leurs fonctionnalités, etc. Il est également utile d'examiner leur présence sur les réseaux sociaux et leurs activités de marketing en ligne.
Analyse de l'audience cible : En parallèle, il est important de comprendre le public cible de votre propre site internet. Cela peut inclure des recherches démographiques, des analyses comportementales, des études de marché, des sondages, etc.
Comparaison des fonctionnalités et des points forts : En analysant les sites concurrents, notez les fonctionnalités et les points forts qui pourraient être pertinents pour votre propre site. Cela peut inclure des fonctionnalités de navigation, des outils de personnalisation, des options de paiement, etc.
Identification des lacunes et des opportunités : En examinant les sites concurrents et en comparant avec votre propre audience cible, identifiez les lacunes dans leur approche et les opportunités que vous pourriez exploiter. Par exemple, vous pourriez remarquer qu'un concurrent ne cible pas efficacement un segment de marché spécifique, ce qui pourrait être une opportunité pour vous.
Élaboration de recommandations : Enfin, utilisez les informations recueillies pour élaborer des recommandations spécifiques pour la refonte de votre site internet. Cela peut inclure des suggestions pour améliorer le design, le contenu, la navigation, les fonctionnalités, etc., en tenant compte des attentes de votre audience cible et des meilleures pratiques observées chez les concurrents.
Planification du projet : Établissez un plan détaillé incluant les objectifs, les échéances, et les ressources nécessaires. Cela comprend le budget, l'équipe de projet, et les outils et technologies à utiliser. Un calendrier de projet bien défini aide à suivre les progrès et à gérer efficacement les ressources.
Définition des objectifs : La première étape consiste à définir clairement les objectifs de la refonte. Cela peut inclure l'amélioration de l'expérience utilisateur, l'augmentation du trafic et des conversions, l'actualisation du design, etc. Il est important que ces objectifs soient alignés sur les besoins de l'entreprise et les attentes des utilisateurs.
Identification des parties prenantes : Il est important d'identifier toutes les parties prenantes impliquées dans le projet, y compris les membres de l'équipe interne, les clients, les utilisateurs finaux, les fournisseurs de services externes, etc. Cela garantira une communication efficace tout au long du processus.
Analyse de l'existant : Une évaluation approfondie du site internet existant est nécessaire pour comprendre ses forces, ses faiblesses et les domaines nécessitant des améliorations. Cela peut inclure une analyse de la conception, de la structure de navigation, du contenu, des performances, de l'accessibilité, etc.
Étude de marché et de la concurrence : Il est important de comprendre le paysage concurrentiel et les tendances du marché dans le domaine d'activité du site. Cela permettra d'identifier les meilleures pratiques, les opportunités et les menaces potentielles à prendre en compte lors de la refonte.
Définition du budget et des ressources : Un budget doit être établi pour le projet, en tenant compte des coûts liés à la conception, au développement, à la gestion de projet, au marketing, etc. De plus, les ressources nécessaires, qu'elles soient internes ou externes, doivent être identifiées et allouées en conséquence.
Élaboration du calendrier et des livrables : Un calendrier détaillé doit être établi, définissant les différentes étapes du projet, les délais de livraison, les jalons importants, etc. Cela permettra de garder le projet sur la bonne voie et de s'assurer que toutes les parties prenantes sont informées des attentes en matière de délais.
Définition des critères de succès : Il est important d'établir des critères de succès clairs pour évaluer l'efficacité de la refonte une fois terminée. Cela peut inclure des indicateurs de performance tels que le taux de conversion, le temps moyen passé sur le site, le taux de rebond, etc.
Élaboration du plan de communication : Un plan de communication doit être mis en place pour informer toutes les parties prenantes des progrès du projet, des changements planifiés et des éventuels obstacles rencontrés. Cela garantira une transparence et une collaboration efficace tout au long du processus.
Conception de l'architecture de l'information : Développez une structure claire pour votre site. Cela implique de planifier la navigation, la hiérarchie du contenu, et la façon dont les différentes pages s'interconnectent. Une bonne architecture facilite la navigation pour les utilisateurs et améliore le référencement.
Analyse des besoins des utilisateurs : Il est essentiel de comprendre les besoins, les attentes et les comportements des utilisateurs potentiels du site. Cela peut être réalisé à travers des enquêtes, des interviews, des analyses de données existantes, etc.
Identification des objectifs du site : En fonction des besoins des utilisateurs et des objectifs commerciaux, il faut définir clairement les objectifs du site internet. Cela peut inclure la génération de leads, la vente de produits, la fourniture d'informations, etc.
Élaboration des personas : Les personas sont des représentations fictives des différents types d'utilisateurs du site, basées sur des données démographiques, des comportements et des besoins. Ils aident à mieux comprendre les utilisateurs cibles et à concevoir une architecture de l'information adaptée à leurs besoins.
Cartographie des parcours utilisateur : En utilisant les personas comme référence, il est important de cartographier les différents parcours que les utilisateurs peuvent emprunter sur le site. Cela permet de déterminer les flux de navigation les plus efficaces pour atteindre les objectifs définis.
Structuration des contenus : Sur la base des parcours utilisateur identifiés, les contenus du site doivent être organisés de manière logique et hiérarchique. Cela implique de regrouper les informations connexes, de définir des catégories et des sous-catégories, et de créer une structure de navigation claire.
Création de wireframes : Les wireframes sont des schémas simplifiés qui représentent la structure et la disposition des pages du site, sans se concentrer sur le design graphique. Ils permettent de visualiser l'organisation de l'information et la navigation du site de manière plus concrète.
Validation et itérations : Une fois les wireframes créés, ils doivent être soumis à des tests auprès des utilisateurs pour recueillir des feedbacks et des suggestions d'amélioration. En fonction des retours, des ajustements peuvent être apportés aux wireframes pour mieux répondre aux besoins des utilisateurs.
Finalisation de l'architecture de l'information : Une fois que les wireframes ont été validés et approuvés, l'architecture de l'information finale du site peut être définie. Cela inclut la création de spécifications détaillées pour chaque page du site, décrivant la disposition des éléments, la navigation, les fonctionnalités, etc.
Création de maquettes et prototypes : Avant de coder, créez des maquettes et des prototypes pour visualiser le design final du site. Cela permet de tester et d'affiner l'interface utilisateur, l'expérience utilisateur, et le design général avant de s'engager dans le développement.
- Compréhension des besoins et objectifs : Tout d'abord, il est crucial de comprendre les besoins et les objectifs de la refonte du site internet. Cela peut inclure des réunions avec les parties prenantes, des analyses de données existantes, des études de marché, etc.
- Recherche et inspiration : Les concepteurs commencent souvent par rechercher des inspirations, examiner les tendances actuelles du design web, et étudier les sites concurrents ou similaires. Cela leur donne une base pour commencer à concevoir.
- Création de wireframes : Les wireframes sont des schémas de base qui représentent la structure et la disposition générale des pages du site. Ils mettent l'accent sur la disposition des éléments plutôt que sur le design graphique. C'est une étape importante pour s'assurer que la navigation et l'architecture du site sont intuitives.
- Design visuel : Une fois que les wireframes sont approuvés, les concepteurs commencent à travailler sur le design visuel. Cela comprend le choix des couleurs, des polices, des images et autres éléments graphiques qui donneront au site son apparence finale.
- Création de maquettes : Les maquettes sont des représentations statiques des différentes pages du site avec le design visuel appliqué. Elles permettent de visualiser à quoi ressemblera le site une fois terminé. Les maquettes peuvent être créées à l'aide de logiciels de conception graphique tels que Adobe XD, Sketch, Figma, etc.
- Prototypage interactif : Les prototypes sont des versions interactives des maquettes. Ils permettent aux concepteurs et aux parties prenantes de tester la navigation, les interactions utilisateur, les animations, etc. Les prototypes peuvent être créés avec des outils spécialisés comme InVision, Marvel, ou directement dans des outils de conception comme Adobe XD ou Figma.
- Révision et itérations : Une fois que les maquettes et les prototypes sont prêts, ils sont souvent soumis à des révisions et des tests auprès des utilisateurs pour recueillir des feedbacks. En fonction des retours, des ajustements et des itérations peuvent être nécessaires pour améliorer le design et l'expérience utilisateur.
- Validation et approbation : Une fois que les maquettes et les prototypes ont été raffinés et que les parties prenantes sont satisfaites, ils sont prêts à être approuvés pour le développement.
Développement du site : Avec un design en place, commencez le développement. Cela inclut la programmation front-end et back-end, l'intégration de bases de données, et la mise en œuvre de fonctionnalités spécifiques. Assurez-vous que le site est responsive et compatible avec différents navigateurs et appareils.
Choix de la technologie : Tout d'abord, il faut décider des technologies à utiliser pour le développement du site. Cela peut inclure le choix d'un système de gestion de contenu (CMS) comme WordPress, Drupal, ou la construction d'un site sur mesure en utilisant des frameworks comme Django, Ruby on Rails, Laravel, etc.
Configuration de l'environnement de développement : L'équipe technique met en place l'environnement de développement nécessaire, y compris les serveurs, les bases de données, les outils de gestion de code source (comme Git), et d'autres logiciels ou services requis pour le développement.
Développement front-end : Cette étape implique la création de l'interface utilisateur du site, en utilisant les maquettes et les prototypes comme référence. Les développeurs front-end travaillent sur le HTML, le CSS, le JavaScript et d'autres technologies pour rendre le site interactif et attractif pour les utilisateurs.
Développement back-end : Pendant ce temps, les développeurs back-end se concentrent sur la création de la logique serveur, la gestion des bases de données, l'intégration de systèmes externes, et d'autres aspects techniques nécessaires au bon fonctionnement du site.
Intégration du contenu : Pendant que le développement se poursuit, le contenu du site est créé ou transféré à partir de l'ancien site vers le nouveau. Cela peut inclure la rédaction de textes, la création ou la sélection d'images et de vidéos, etc.
Tests : Une fois le développement terminé, une série de tests est effectuée pour s'assurer que le site fonctionne correctement sur différentes plateformes et navigateurs, qu'il est accessible et qu'il offre une expérience utilisateur optimale. Cela peut inclure des tests de compatibilité, des tests de performance, des tests de sécurité, des tests d'accessibilité, etc.
Correction des bugs et optimisations : Les problèmes détectés lors des tests sont corrigés et des optimisations sont apportées pour améliorer les performances, la sécurité et l'expérience utilisateur du site.
Optimisation pour les moteurs de recherche (SEO) : Intégrez des pratiques SEO dès le début du processus de refonte. Utilisez des mots-clés pertinents, optimisez les méta descriptions, et assurez-vous que le site a une structure URL logique. Le SEO améliore la visibilité et le classement du site dans les résultats de recherche.
Test et assurance qualité : Avant le lancement, testez minutieusement le site. Cela inclut des tests de fonctionnalité, de compatibilité, de performance, et de sécurité. Recueillez des retours d'utilisateurs tests pour peaufiner l'expérience utilisateur.
Planification des tests : Il est important de commencer par établir un plan détaillé pour les tests, en identifiant les différents scénarios à tester, les fonctionnalités critiques à vérifier, les navigateurs et appareils à prendre en charge, etc.
Tests de fonctionnalités : Les fonctionnalités du site doivent être testées pour s'assurer qu'elles fonctionnent correctement. Cela inclut la vérification des formulaires, des liens, des boutons, des menus, des fonctionnalités interactives, etc.
Tests de compatibilité : Le site doit être testé sur différents navigateurs web (Google Chrome, Mozilla Firefox, Safari, etc.) et appareils (ordinateurs de bureau, tablettes, smartphones) pour garantir une expérience cohérente sur toutes les plateformes.
Tests de performance : Les performances du site doivent être évaluées, notamment sa vitesse de chargement, sa réactivité et sa stabilité sous charge. Cela peut être fait en utilisant des outils de test de performance en ligne ou en simulant un trafic élevé sur le site.
Tests de sécurité : La sécurité du site doit être vérifiée pour s'assurer qu'il est protégé contre les attaques potentielles telles que les injections SQL, les failles XSS, les attaques par force brute, etc. Des scans de sécurité et des tests de pénétration peuvent être réalisés pour identifier les vulnérabilités.
Tests d'accessibilité : Le site doit être conforme aux normes d'accessibilité web (comme les WCAG) pour garantir qu'il est utilisable par tous, y compris les personnes handicapées. Cela implique de tester la navigation au clavier, la lecture vocale, le contraste des couleurs, etc.
Tests de contenu : Le contenu du site doit être examiné pour s'assurer de son exactitude, de sa cohérence et de sa pertinence. Cela inclut la vérification des textes, des images, des vidéos, des liens externes, etc.
Tests de validation : Une fois tous les tests effectués, une vérification finale est nécessaire pour s'assurer que toutes les corrections ont été apportées et que le site est prêt à être lancé. Des listes de contrôle peuvent être utilisées pour s'assurer que rien n'a été oublié.
Rapport de bugs et corrections : Tout problème détecté lors des tests doit être documenté dans un rapport de bugs et corrigé par l'équipe de développement. Les corrections doivent être rétestées pour vérifier qu'elles ont été effectuées avec succès.
Validation finale : Une fois que tous les problèmes ont été corrigés et que le site a passé avec succès tous les tests, une validation finale est effectuée pour confirmer que le site est prêt à être déployé.
Lancement et suivi : Après avoir vérifié que tout fonctionne comme prévu, lancez le site. Planifiez une communication autour du lancement pour informer les utilisateurs existants et attirer de nouveaux visiteurs. Surveillez les performances du site en termes de trafic, d'engagement utilisateur, et de classement SEO.
Maintenance et mise à jour continue : La refonte d'un site web n'est pas un processus ponctuel. Après le lancement, continuez à surveiller, à mettre à jour, et à améliorer le site. Cela implique la mise à jour du contenu, la correction des bugs, et l'ajustement des stratégies SEO en fonction des nouvelles tendances et des retours des utilisateurs.
Surveillance continue : Il est essentiel de surveiller régulièrement les performances du site, y compris la vitesse de chargement, la disponibilité, les erreurs et les problèmes de sécurité. Cela peut être fait à l'aide d'outils de surveillance automatique et d'analyses de données.
Gestion des mises à jour : Les mises à jour logicielles sont publiées régulièrement pour les composants du site tels que le CMS, les plugins, les frameworks, etc. Il est important de les installer rapidement pour garantir la sécurité et la compatibilité avec les nouvelles technologies.
Ajout de contenu : Le site doit rester pertinent pour les utilisateurs, ce qui signifie que du contenu frais et de qualité doit être ajouté régulièrement. Cela peut inclure des articles de blog, des nouvelles, des mises à jour de produits ou de services, etc.
Optimisation des performances : Les performances du site doivent être continuellement optimisées pour garantir une expérience utilisateur optimale. Cela peut inclure l'optimisation des images, le nettoyage du code, la mise en cache du contenu, etc.
Gestion des commentaires et feedbacks : Les commentaires des utilisateurs doivent être surveillés et pris en compte pour apporter des améliorations au site. Cela peut inclure des ajustements de conception, des corrections de bugs, l'ajout de fonctionnalités demandées, etc.
SEO et marketing en ligne : Le référencement naturel (SEO) est crucial pour maintenir la visibilité du site dans les moteurs de recherche. Cela implique d'optimiser le contenu, les balises méta, les liens internes et externes, etc. De plus, des efforts de marketing en ligne peuvent être déployés pour attirer davantage de trafic vers le site.
Sécurité : La sécurité du site doit être régulièrement évaluée et renforcée pour protéger les données sensibles des utilisateurs et prévenir les attaques de sécurité. Cela peut inclure des mises à jour régulières des logiciels, la mise en place de pare-feu, la surveillance des activités suspectes, etc.
Évolution et adaptation : Les besoins et les attentes des utilisateurs évoluent avec le temps, donc le site doit également évoluer pour rester pertinent. Cela peut inclure des mises à jour majeures du design, des fonctionnalités ou de l'architecture du site en réponse aux tendances du marché et aux retours des utilisateurs.
En suivant ces étapes, vous pouvez assurer que la refonte de votre site web non seulement répond aux attentes actuelles, mais est également bien positionnée pour l'avenir.