18 étapes pour bien préparer une refonte de site web (modèle, conseils..)

Refondre un site ou une partie d’un site, c’est un projet souvent long et fastidieux dans lequel beaucoup de métiers et d’expertises interagissent à des moments différents afin d’atteindre un objectif commun. Autant d'intéractions qui multiplient donc les risques de retards de livraison, d’incompréhensions ou de non-atteintes des objectifs initiaux. ‍
Discutons refonte de site!
This is some text inside of a div block.
This is some text inside of a div block.
Oups! Une erreur est survenue...

Dans cet article, nous partageons notre expérience sur les projets de refonte de site et nous vous donnons un maximum de clés pour mettre en place vos projets de refonte avec le plus de sérénité possible

La définition d’une refonte de site 

Une refonte de site peut répondre à plusieurs objectifs et provenir d’un contexte spécifique, mais elle implique la plupart du temps une revue de ce dernier à deux niveaux :

  1. L’apparence du site (le front) : ce qu’on appelle plus communément le design d’interface/UI. 
  2. La structure du site (le back) :  des modifications du back office qui auront un impact sur les parcours, les composants et plus globalement sur la structure du site.

Quels sont les écueils fréquemment rencontrés lors des refontes de site?

  1. Des objectifs mal définis : trop d’objectifs différents, des KPIs pas bien définis, pas S.M.A.R.T (Spécifiques. Mesurables. Acceptables. Réalistes. Temporellement définis)
  2. L’existant et les résultats du site actuel qui ne sont pas pris en compte dans la réflexion : qu’est ce qui ne marche pas actuellement ? Que faut-il supprimer ou modifier ? Qu’est ce qui marche aujourd’hui ? Que faut-il conserver ?
  3. Vouloir faire rentrer tout son catalogue d’offres et de services dans le site au risque de rendre le site incompréhensible pour l’utilisateur
  4. Intégrer les équipes SEO seulement au moment de la création/rédaction des contenus
  5. Tout mettre dans le design, vouloir faire un site beau et moderne au détriment du contenu et de la cohérence 
  6. Réfléchir à la promotion du site, aux actions de communication et de growth une fois que le site est prêt à être lancé (trop tard) 

 

Focus sur chaque phase et détails des actions 

une loupe

Phase d’analyse et discovery

Etape 1 :  Introduction au projet

Présentation ou rappel à l’équipe projet des objectifs de la refonte, explication de la méthodologie, présentation d’un macro planning et planification des premiers ateliers. Il peut être nécessaire de réaliser, au préalable, un atelier d’alignement des parties prenantes sur les objectifs de la refonte si ces derniers ont besoin d’être affinés. 

Nos tips et conseils : si possible, avoir lors de cette réunion toutes les personnes qui seront amenées à intervenir dans le projet, même dans un laps de temps qui paraît éloigné, permet d’embarquer l’équipe, de fédérer et de donner la possibilité à tout le monde d’anticiper sur leur plan de charge pour être disponible. 

Etape 2 : Le choix de la méthodologie projet

Dans ce type de projet il est important de bien définir le choix de la méthode, en effet ce dernier aura une grande incidence sur le rythme du projet et les rôles de chacun dans la refonte de site. 

Nos tips et conseils : On peut choisir parmi plusieurs méthodes existantes plus ou moins agiles. Dans un premier temps, les organisations choisissent souvent la méthodologie de cycle en V qui permet de sortir rapidement une première version de son site et de concrétiser le projet de refonte. Ensuite, lorsque le site est lancé, on passe la plupart du temps à une méthodologie plus itérative sur des cycles plus courts (la méthode agile). Le but étant d’intégrer des briques de fonctionnalités, ou de nouvelles user stories (en réalisant des sprints) que l’on teste au fur et à mesure et que l’on ajuste afin de délivrer toujours la meilleure expérience utilisateur possible. 

Etape 3 : Recueil & analyse de données (internes & externes)

Recueil et analyse quanti des sources de données existantes : données de trafic, parcours et conversion, mobile ou desktop (Google Analytics, Contentsquare...), analyses existantes, études marketing sur le site. Analyse quali : à ce stade, il peut également être opportun de mener une courte phase de user research pour comprendre quels usages vos utilisateurs ont avec votre site aujourd’hui, et ce qu’ils en attendent exactement pour demain. Réalisation ou recueil d’étude(s) de marché : analyse de la concurrence (positionnement, présentation et contenu des offres...), analyse des  tendances et comportements au niveau marché, secteur, produit…

Nos tips et conseils : Combiner les sources de données, les croiser pour obtenir des résultats objectifs. Se limiter à des sources de données datant de 1 à 2 ans mais pas plus, afin d’avoir des données à jour. Pensez au quanti et au quali conjointement : l’un vous permettra de repérer des faiblesses, l’autre vous permettra de comprendre pourquoi ! La préparation de la trame d’interview et le choix du protocole sont des étapes très importantes dans la collecte des insights utilisateurs. Il faut s’assurer que l’on obtiendra bien la donnée nécessaire pour pouvoir établir nos profils utilisateurs et balayer l’ensemble du parcours.

Etape 4 :  Création des personae & identification des parcours

Définition des personae : ils représentent les différents utilisateurs qui fréquentent le site, ils ont des profils, des souhaits et des objectifs différents. Idéalement, vous aurez rencontré ces profils en user research et il vous sera ainsi très facile de dresser leurs portraits robots. C’est en remettant ces profils au centre de la réflexion sur les parcours que vous pourrez avoir une meilleure vision de la structure que doit avoir votre site, des parcours à mettre en avant afin d’apporter une réponse adaptée à chacun de vos utilisateurs. 

Nos tips et conseils : Pour construire vos personae vous pouvez lister, pour chacun : leurs objectifs, les points de souffrance qu’ils rencontrent aujourd’hui, les solutions et recours actuels qu’ils utilisent aujourd’hui pour contourner ces problèmes, ainsi que les limites de ces solutions.

À la fin de la phase de discovery

Vous connaissez votre environnement, vos utilisateurs et les pain points à résoudre. Vous êtes prêt pour commencer à délimiter le périmètre de votre projet et trouver des solutions aux problèmes que vous avez identifiés.

un chemin avec des étapes et des obstacles

Phase de cadrage et stratégie

Etape 5 : Définition de la stratégie

Revue de tous les insights (quanti et quali) collectés, mise à jour des objectifs macro du sites, premières prises de positions sur les orientations de contenus et la ligne directrice visuelle mais aussi sur les premières actions de growth afin de bien adresser les cibles identifiées.

Nos tips et conseils : Il faut déterminer des objectifs macros, des objectifs mesurables et atteignables (ex : générer plus de leads, rentrer dans les 5 premiers liens sur google sur une recherche spécifique…). A la fin de cet atelier vous devez avoir un consensus du métier car ce sont ces objectifs qui régiront toutes les décisions. Vous pourrez, à cette étape du projet, initier et formaliser une roadmap qu’il faudra mettre à jour au fur et à mesure avec les délais que vous affinerez au fil des ateliers pour donner de la visibilité à toutes les parties prenantes. 

Etape 6 :  Définition de l’arborescence

A cette étape du projet, on définit les différentes entrées du site (les menus et les sous-menus : bref, les parcours utilisateurs). Il s’agira maintenant de rentrer dans la matérialisation des objectifs en définissant la structure et en définissant les différents niveaux du site et parcours (3 à 4 niveaux de profondeur idéalement). Il faut à ce moment se demander : comment peut-on amener l’utilisateur, de la façon la plus naturelle et la plus simple possible, vers l’information qu’il souhaite trouver ? Ou l’objectif qu’il souhaite accomplir en venant sur votre site ?

Nos tips et conseils : Demander de l’aide à un expert de réaliser un audit SEO ou utiliser des outils comme Semrush pour favoriser le référencement naturel. Il peut être également judicieux de faire une réunion de présentation de la future arborescence à l’équipe analytics afin qu’ils puissent prendre la mesure des efforts à fournir pour créer le plan de taggage. Idéalement, nous vous recommandons également dès maintenant de réaliser de courtes sessions de tests utilisateurs afin de tester la pertinence des nouveaux parcours que vous proposez. En effet, c’est maintenant que vous commencez à définir l’expérience de vos utilisateurs !

Etape 7 : Mise en place du site et de la structure des pages

En parallèle de la tâche précédente, il est important, une fois qu’on a le listing de toutes les pages, d'embarquer la direction informatique le plus tôt possible afin qu’ils puissent mettre en place la “coquille du site”. Cette étape ne se fait pas en un jour, il faut donc l’adresser le plus tôt possible afin que la structure soit prête lorsque les contenus seront disponibles pour ne pas prendre de retard sur la livraison.

Nos tips et conseils : en cas de changement de solution (wordpress, webflow, prestashop…) pour l’implémentation du site il sera impératif d’aborder ce sujet bien plus tôt (pendant l’étape 4. Définition de la stratégie)  

À la fin de la phase de cadrage

Vous avez déterminé les objectifs et vous avez la ligne directrice du projet, les idées, les concepts à faire passer, l’arborescence et le listing des pages que contiendra le futur site.

un site web

Phase de conception, UX, design et tests utilisateurs

Etape 8 : Atelier : Maquette, design, UI et contenus des pages du site

A ce moment du projet, il s’agit de structurer en détail chacune des pages en UX. Il va falloir maintenant guider les métiers à poser les objectifs (1 page = 1 objectif), à cadrer plus précisément le discours et les orienter dans la mise en forme macro des différents contenus. Pour cela, il est d’usage de commencer, pour les pages les plus importantes de votre site, parce que l'on appelle les gabarits (ou type de page : page blog, page formulaire, page offre…) : l'intérêt des gabarits est que vous gagnerez du temps lorsque vous aurez besoin de décliner vos pages. C’est comme un moule qui pourra vous servir pour différents types de contenus (votre site peut contenir 4 gabarits, qui serviront de base pour vos 25 pages).

Ensuite, c'est le moment de les structurer sous forme de wireframe, une première incarnation qui permettra au métier de se projeter. Ils peuvent être réalisés en atelier (sur des plateformes comme figma, whimsical ou encore Miro…), ou en chambre, selon la complexité des gabarits et le temps que les métiers peuvent allouer au projet. Vous pouvez maintenant effectuer des tests, c’est un excellent moyen de repérer des bloquants majeurs parmi les fonctionnalités, le parcours, l’interface, etc… avant de les valider définitivement. 

Vous avez intégré les retours? Vous êtes donc prêts à construire le design d’interface (UI) : quel look & feel souhaitez-vous donner à votre site ? Comment va-t-il, visuellement, incarner votre branding ? En créant votre wireframe, vous avez posé des fondations et des murs (UX). En créant votre design d’interface, vous posez maintenant l’identité et l’atmosphère de chacune de vos pages (UI). 

Nos tips et conseils : Selon la complexité de votre site et des objectifs que vous souhaitez atteindre, il est possible de réaliser cette étape n°7 sous forme de sprints, durant lesquels la conception et les tests seront réalisés au fur et à mesure, sur des temps très courts, et avec une forte implication des métiers. et bien sûr on n’oublie pas de penser dès maintenant à construire un design responsive (mobile, desktop, tablet).

Etape 9 : Création des contenus

On a l’ensemble des pages ainsi qu’une idée des contenus que l’on veut inscrire sur chacune. Il faut maintenant concrétiser cela avec un des termes qui font écho sur les moteurs de recherche pour optimiser son référencement. Pour initier cette partie il faut créer des templates de briefs les plus détaillés possibles (H1, H2, meta description, CTA avec urls et wording...), mettre en place un espace de travail partagé et un document centralisant tous les liens des documents, un planning précis, revu et mis à jour lors d’une réunion hebdomadaire ou quotidienne en fonction des projets.

Nos tips et conseils : Prenez le temps que vous aviez initialement prévu, multipliez le par 1,5 et vous aurez le temps effectif pour cette étape. La création de contenu est très chronophage, il est possible de se faire accompagner par des agences de rédaction mais cela nécessite un temps de préparation et des briefs plus longs, afin d’éviter des aller-retours sur les livraisons de pages (V1, V2, V3, V4...Vdef). 

Etape 10 : Optimisation SEO

Nous vous recommandons d’intégrer l’optimisation du SEO dans la phase de création des contenus au fur et à mesure qu’ils sont livrés. Le filtre des experts SEO est indispensable afin de mettre toutes les chances de son côté et s’assurer qu’on a fait le maximum du point de vue référencement pour optimiser la visibilité du site sur les plateformes de recherche. 

Etape 11 : Protection des données et conformité

La protection des données est un sujet très sensible aujourd’hui et vraiment pris au sérieux par les utilisateurs et les organismes de surveillance. Pensez donc à solliciter assez tôt les équipes juridiques ou un expert RGPD afin de réaliser des actions comme : la création des contenus sur la protection des données, l’utilisation des cookies ou encore les CGUs de votre site mais aussi pour réaliser un check de la conformité du site (d’autant plus quand vous avez des parcours transactionnels avec des utilisateurs).

Etape 12 : URLs et plan de redirection

Il ne s’agit pas de mettre les pages de votre site et tout le contenu actuel à la poubelle, certains de vos utilisateurs ont peut être enregistré l’ancienne URL dans leurs favoris ou vous avez peut être des pages de contenu qui performaient déjà très bien. Il faut donc capitaliser dessus et conserver ce trafic. Pour cela il faut préparer un plan de redirection pour que les anciennes urls redirigent bien vos utilisateurs vers les nouvelles pages du site et ainsi garder ce trafic existant.

À la fin de la phase de conception

Vous avez donné une forme concrète au projet, vous avez tous les éléments textuels et visuels finalisés en votre possession et vous pouvez commencer à rentrer dans la phase d’implémentation du site. 

un site avec des balises html

Phase d’implémentation et delivery

Etape 13 : Finalisation des pages et intégration des contenus

Les contenus et les designs sont validés. On est prêt à intégrer tous les contenus aux bons endroits, à ajuster les derniers visuels, s’assurer que les pages correspondent bien aux objectifs posés en début de projet, et que les meta descriptions sont bien présentes partout. Vous n’avez pas oublié le footer, la page 404…

Nos tips et conseils : À cette étape on ne revient plus en arrière, n'acceptez-plus de nouveaux contenus pour le lancement de votre site, cependant ajoutez-les à votre backlog pour ne pas oublier de vous en occuper pour les prochaines releases. Il vaut mieux lancer un site stable et fonctionnel avec un ou deux contenus en moins (qui n’étaient sûrement pas prioritaires sinon ils ne seraient pas arrivés si tard) que continuer d’ajouter des éléments et se lancer dans une mise en production bancale qui entraînera l’apparition de bugs plus critiques.

Etape 14 : Plan de taggage & tracking

Au début du projet, l’équipe s’est fixé des objectifs. Pour savoir si on les a atteint, ou même surpassés, il faut être en mesure de les piloter et donc de suivre les résultats sur votre nouveau site. Pour cela, dès que vous aurez vos parcours avec vos designs et contenus définitifs, il est impératif de réaliser un atelier avec les équipes analytics pour qu’elles puissent définir le nouveau plan de taggage et assurer le tracking de vos indicateurs de performance (trafic, comportements, événements...) et configurer les outils analytics qui suit les objectifs définis dans la phase de cadrage et stratégie.

Nos tips et conseils : Il sera nécessaire de faire une recette analytics indépendamment de la recette fonctionnelle (que nous vous détaillons juste après en à l’étape 12.). Il faut donc s’assurer que les équipes seront prêtes le jour où les environnements de recette seront disponibles.

À la fin de la phase de delivery

La première version de votre site est disponible sur un environnement de test, sur lequel vous allez pouvoir solliciter une équipe afin de réaliser la recette (UAT) et déceler tous les bugs et anomalies qui pourraient subsister sur le site avant le lancement.

une checklist

Phase de recette ou UAT

Etape 15 : Tests fonctionnels et recette

Consultez régulièrement votre équipe pour avoir une date approximative de mise à disposition de l’environnement de recette : car à cette date, il vous faudra avoir à disposition une équipe (plus ou moins grande) de testeurs pour votre nouveau site. Nous vous recommandons également de préparer en amont un document pour centraliser les retours, des scénarii prêts à l’emploi et un processus de remontée des bugs et corrections bien huilé avec les équipes techniques afin d’être le plus efficace possible.

Nos tips et conseils : Dans le choix des testeurs, si possible, prendre à la fois des personnes qui ont participé au projet de refonte (les experts) mais aussi des personnes extérieures au projet (contributeurs externes que vous aurez par exemple déjà sollicités lors de précédents tests utilisateurs). Ces personnes permettent souvent d’apporter un regard plus frais sur les pages. En effet, au bout d’un certain temps à travailler sur un sujet et le voir quotidiennement, vous pourrez avoir un peu de mal à détecter des coquilles dans un texte, des petits bugs visuels, ou bien des soucis de responsive.

À la fin de la phase de recette

Vous avez un GO ou un NO GO pour le lancement du site. Il se peut qu’il reste encore des bugs mineurs à régler et cela pourra se faire post-lancement. Votre backlog n’est pas vide, elle ne doit JAMAIS être vide car un projet de ce type doit constamment vivre et évoluer.

un siteweb

Lancement du site 

Etape 16 : Teasing et communication

Le site est prêt, la date de lancement est fixée mais afin d’être sûr que la mise en production de votre belle vitrine digitale soit un succès, vous devez la promouvoir comme il se doit. Vous aurez en amont du lancement réalisé un “ plan de com’“ avec les experts du marketing et de la communication, Vous pouvez tout à fait paralléliser cette phase avec la phase "Finalisation des pages et intégration des contenus”. Il s’agira de bien définir les actions de communication : 

Nos tips et conseils : Dans le plan de communication, assurez-vous de partager des timings réalisables pour les équipes en interne. En effet, cela peut avoir un effet de pression positive pour sortir le site mais alignez vous avec les équipes techniques, afin de ne pas promettre l’impossible et devoir faire une communication corrective en cas d’imprévu. 

Etape 17 : Validation & lancement

Il est important de se garder la journée assez libre (prévoyez-vous une journée sans réunion) afin de pouvoir être sur le pont en cas de problèmes le jour du lancement. Un bug est vite arrivé et il peut nécessiter de la réactivité de votre part afin de pouvoir remonter l’anomalie, la corriger ou apporter les éléments permettant à la DSI de la corriger si ce n’est pas à votre main.

Les tests sont concluants, les corrections ont été faites, les bugs sont réglés, il n’y a plus d’anomalies à corriger dans votre fichier de recette. Tous les voyants sont au vert. Vous allez pouvoir indiquer à la DSI que vous êtes prêt à passer le site en production. Lorsque la manipulation sera réalisée côté back office, ça y est votre site sera en production. Bravo pour le travail accompli !

Nos tips et conseils : Si vous le pouvez, n’effectuez jamais de mise en production le vendredi. En effet, nous vous recommandons de vous prévoir une journée assez libre le jour de la mise en production, ce conseil est également vrai pour le lendemain de la mise en production. En effet, si quelques anomalies sont passées entre les mailles du filet, il vous faudra être en mesure de les corriger avant que vos utilisateurs ne les repèrent.

Etape 18 : Analytics et suivi des résultats

Une fois votre site lancé, les données collectées via la mise en place préalable d’un plan de taggage vous permettront d’analyser le comportement des utilisateurs de votre site, et de confirmer l’alignement de votre site avec vos objectifs stratégiques. Nombre d’utilisateurs quotidiens/mensuels, durées moyennes de session, temps passé sur les pages, taux de rebond, taux de conversion …, autant de KPIs qui vous permettront d'identifier en vie réelle les forces et faiblesses de votre site, de définir les axes d'amélioration, et de prioriser les prochains chantiers à mener.

Nos tips et conseils : Il est toujours judicieux de réaliser un atelier de rétrospective ou post mortem avec l’équipe projet. Durant cet atelier, chacun pourra évoquer son ressenti, ce qui s’est bien passé ou ce qui pourrait être amélioré. On réfléchit ensemble afin d’écrire les processus de demain et être sûr qu’à l’avenir on prenne bien en compte les contraintes de tout le monde pour que le projet se passe le mieux possible. 

À la fin de la phase de lancement

Le site est disponible sur les environnements de production et accessible à ses utilisateurs. Vous avez également lancé vos actions de communication pour prévenir votre cible que votre nouveau site est en ligne et vous commencer à suivre les résultats sur vos outils analytics.

Post lancement du site : booster votre trafic, améliorer votre visibilité et générer du business additionnel 

La refonte ou le lancement d’un site n’est pas une fin en soi… au contraire, ce n’est que le début de l’histoire ! Votre site doit booster votre notoriété en permettant aux utilisateurs de mieux vous connaître, en apportant des réponses à leurs questions, mais doit aussi et surtout avoir un impact sur votre business. L’atteinte de ces objectifs passera par l'identification quotidienne de nouvelles idées de contenus, de cas d’usages, de parcours… Ces travaux devront être cohérents et complémentaires avec vos autres messages, contenus et canaux de communication (app, réseaux sociaux, …). Pour cela, d’autres équipes (marketing, expérience client…) seront à mobiliser et de nouveaux processus (lead generation, inbound marketing …) seront à mettre en place. En bref, un nouveau cycle de vie du site qui démarre !

Vous avez déjà fait une refonte de site et vous avez eu une expérience différente? Vous avez d’autres tips à transmettre? Ou vous prévoyez de passer par une refonte prochainement? N’hésitez pas à m’envoyer un message (clement.guichard@digilityx.com) et échangeons sur le sujet autour d’un café ☕

Discutons refonte de site!

La curation UX pour rester à la page !

Abonne toi à notre newsletter pour recevoir l’essentiel de l’actualité Design toutes les deux semaines dans ta boîte mail !

Merci pour ton inscription
Nous venons de t’envoyer un premier mail de bienvenue ! 💌
Oops! Something went wrong while submitting the form.

AUTEUR(S)

Clément Guichard
linkedin logo
Clément Guichard
Product Manager

ARTICLES SIMILAIRES

No items found.
Voir le blog