Assurance & Mutuelle
15 avril 2020
16minutes

Architecture de site web | En création ou refonte de site, une phase à ne surtout pas manquer | Comment réussir la conception d'un site web en 4 étapes ?

 

 

Bien concevoir l’architecture de son site web. Les étapes indispensables

 

Première étape, le cadrage

Ce cadrage a lieu le plus souvent au cours d’un atelier de travail d’1/2 journée en vos locaux ou à distance via Klaxoon (voir plus bas). Il sert à comprendre précisément le contexte de la demande, les enjeux business, les objectifs. Il permettra aussi de commencer la travail sur le contenu : re-structurer et ventiler le contenu existant. Il doit aussi être le point de départ à identifier les process clefs de création et de mise à jour du contenu. Idéalement le cadrage est le miroir digéré et enrichi par l’architecte de l’information de votre cahier des charges.

Ce cadrage permet de mettre en cohérence votre stratégie digitale et votre stratégie d’entreprise. En quoi votre futur site web va accompagner vos enjeux de développement, votre stratégie commerciale, vos axes de communication, votre marque employeur.

 

Deuxième étape, la conception générale proprement dite. La clef de voute de votre futur site

Suite au cadrage, la phase de conception pourra commencer. C’est une phase en création de site qui peut sembler longue, parfois improductive car on ne voit pas de livrable concret pendant plusieurs semaines. Mais c’est une phase absolument fondamentale car elle conditionne le succès de la refonte de votre site. C’est une phase où des intervenants de premier plan sont nécessaire. 10 ans d’expérience dans le métier avec un fort background rédactionnel et une appétence pour le digital en général) sont clés. Des partis pris structurants pour le design du site seront posés et il ne faut pas se tromper car le site va durer des années !

Socle de l’architecture de l’information, du système de navigation, de l’agencement de la page d’accueil et de la ligne éditoriale, la conception générale a pour vocation de formaliser ex-nihilo dans un document unique référent, et utilisé tout au long du projet, le macro-plan de votre site web. C’est à la fois le plan de masse de l’architecte, la feuille de route du co-pilote de rallye, et le sommaire général de l’écrivain.

Le but est surtout de structurer en grandes typologies, les contenus disponibles, pour proposer un contrat de lecture clair et immédiat et aider au repérage et à la recherche avancée, au sein de ce contenu riche.

architecture-site-web-arborescence

Une architecture bien conçue et équilibrée. La clef de succès pour le SEO

 

Ensuite, le rythme de production des recommandations s’accélère avec la fourniture des livrables suivants :

 

LES DOCUMENTS FONDATEURS

  • Document de conception générale issu du cadrage
  • Exemple d’arborescence détaillée, l’architecture du site, le squelette du site web
  • Système de navigation (plus communément appelés menus)
  • Principes de direction artistique digitale (application de la charte ou identité visuelle existante ou à créer)
  • Charte rédactionnelle accompagnée parfois d’une stratégie de refonte éditoriale
  • Recommandation de stratégie SEO

 

LES GABARITS INITIAUX

  • Structure de la home page
  • Zoning avancé wireframe de la home page
  • Zoning HD de tous les gabarits avec prise en compte des breakpoints

 

Cette étape doit permettre aussi de prioriser les tâches suivantes :

  • Peu de contenus sont disponibles ? Commencez par cela.
  • UX et parcours compliqués ? Allouez du temps à cette phase. Il faut avoir un plan de site clair et structuré avant de commencer.
  • Changement d’offres ? Il faut penser Service Design. Quand votre produit n’est plus seulement ce que vous vendez, mais comment vous le vendez via le digital

 

Troisième étape, le suivi aval

Votre conception est calée. Les wireframes sont posés. Tout semble se dérouler correctement ! Mais vous n’avez pas terminé. Car tout se joue maintenant. En effet, votre concepteur de site – architecte de l’information a une idée assez précise du site, des parcours et même de la DA.

Mais si vous transférez trop tôt le document à une équipe plus orientée production, il y a toutes les chances que le résultat soit décevant. A travers des réunions de suivi hebdomadaire le concepteur doit s’assurer avec le chef de projets que sa vision initiale est bien respectée. C’est particulièrement vrai en phase intégration où tout peut déraper si les délais sont tendus ! Très vite le cahier des charges fonctionnel doit être rédigé et communiqué à toutes les parties prenantes.

 

Une approche futée et novatrice en 2020, le service design

Le design de service est au croisement d’une étude centrée sur l’utilisateur, la collaboration entre les différents acteurs du projet et une approche de co-créationIl s’agit d’identifier non seulement les services à proposer à l’utilisateur mais surtout comment l’utilisateur va les identifier, sélectionner, acheter, utiliser. Une véritable approche « user centric ». On parle aussi de Design de service, de Design d’expérience utilisateur ou de Customer experience design.

 

Cette petite video est assez parlante sur le sujet (merci à Usabilis pour l’inspiration)

 

Note de culture digitale : Service Design et Design System est-ce la même chose ?

Surtout pas ! Le Service Design comme expliqué plus haut vise à inspirer la création des produits et des services en mettant l’utilisateur au centre. Le digital est bien sûr fondamental dans cette approche notamment quand le produit est le site web lui même. Amazon par exemple a une grande partie de son expérience client liée à son site. Itérer en permanence pour inventer une nouvelle expérience web ou améliorer des parcours existants est donc su Service Design.

Le Design System se situe lui à la croisée de l’UX et de la direction artistique. Il vise à modulariser à l’extrême la conception des pages web (on va jusqu’à l’Atomic Design) pour une meilleure efficacité. Un article sur UX Design explique cela très bien.

 

design system animation

 

La conception de site web à distance, c’est possible. Visio, co-création et ateliers remote avec Zoom, Teams et Klaxoon

Avant même le début de la pandémie, il y avait une demande forte pour améliorer l’efficacité des ateliers de co-création amont. Mais voyons d’abord :

  • Quel est l’objectif des ateliers ?
  • Qui participe aux ateliers ?
  • Les livrables attendus
  • Les ateliers en mode 100% digital. Comment cela se passe-t-il ?

 

atelier co-conception UX design assurance UI

 

 

Méthodologie et planning

En résumé, voici la méthodologie que nous suivons afin de livrer un site web prêt à l’emploi. Vous pouvez la télécharger librement. Grâce à cela et à ses étapes à suivre, vous aurez une idée claire du rétro-planning à mettre en place.

 

methodologie refonte site web

 

 Je télécharge

 

Téléchargez gratuitement un cahier des charges prêt à l’emploi (PDF de 4 pages)

Ce cahier des charges servira de base à votre processus d’appel d’offres. Vous pouvez télécharger ici un gabarit de cahier des charges de refonte de site web.

 

gabarit cahier des charges

Ce cahier des charges a une coloration sur le secteur assurance car c’est la spécialisation de l’agence. Mais 95% des éléments contenus peuvent s’appliquer à d’autres secteurs.

 

Estimez rapidement le tarif de mise à jour de votre site internet, phase de conception incluse

Avec notre calculateur, estimez-vous même le budget de refonte d’un site Internet

 

Calculez votre budget personnalisé en 6 clics

Chargement en cours...

 

Pour toute autre demande, contactez-nous et pensez aussi à consulter notre grille tarifaire.

 

 

Vous avez aimé ? Notez-nous !