Les travaux préparatoires en 5 étapes pour concevoir un site internet

TUTORIEL : Comment préparer la refonte ou la création de son site internet

ajouter article wordpressVous avez un projet de refonte ou de création d’un site internet ; comment s’organiser afin de préparer les différentes phases de conception de votre projet ?

Ce tutoriel vous propose une méthode pour commencer à imaginer votre charte graphique, anticiper votre référencement SEO, rassembler vos contenus… La qualité d’un site va en grande partie dépendre de la réflexion en amont autour de ces thématiques, prenez le temps d’y réfléchir !

NOTE : Ce tutoriel a été mis à jour le 3 mars 2024


ÉTAPE 1 – Concevoir et regrouper les contenus graphiques

  • Regrouper les éléments de votre charte graphique (logo, polices d’écriture, affiches, plaquette, brochures, flyers, cartes de visite, …) et tentez de repérer ce que vous souhaitez garder et ce qui va évoluer
  • Trier vos photos qui vont jouer un rôle primordial dans le rendu final de votre projet. Il est important de les fournir de la meilleure qualité possible. Les photos les plus valorisantes sont celles prises en situation ; des images personnelles. Si c’est possible, évitez les photos des banques d’images.
A la fin de cette étape vous devriez avoir un dossier avec vos futurs contenus à intégrer et une idée un peu plus claire de l’orientation de votre future charte graphique.

ÉTAPE 2 – Préparer les contenus textes

  • Lister les objectifs de votre projet : au-delà des informations primaires nécessaires pour donner un sens au site Internet (coordonnées, avantages, certifications, partenaires…), il est important de réfléchir sur l’objectif de votre futur site internet (Pour qui ? Pourquoi ?…). Cette étape vous aidera à rédiger vos arguments commerciaux sur les forces de votre projet, ses spécificités…
  • Rédiger une première version des textes que vous désirer intégrer sur votre site.
  • Lister l’arborescence de votre projet en donnant un titre à chacune de vos pages et sa place en tant que page parent ou enfant (page ou sous-page). Cette arborescence va être le reflet de votre menu principal.
A la fin de cette étape vous devriez connaitre toutes les pages de votre futur site ainsi que les majorité de leur contenu textuel

ÉTAPE 3 – Regarder chez les voisins pour mieux connaitre vos envies et vos besoins

  • Lister des sites internets (concurrents et de domaines diverses) qui répondent plus ou moins à vos besoins pour mieux connaitre les fonctionnalités dont votre projet aura besoin. Si possible commencez à lister les fonctionnalités « spéciales » de votre projet (formulaire, newsletter, carte interactive, paiement en ligne, réservation, calendrier…)
  • Lister des exemples de sites web dont l’esthétique, le concept, l’ambiance retiennent votre attention.
Une fois cette étape réalisée vous devriez être en possession d’une liste d’une dizaine de sites dont vous souhaitez vous inspirer et avoir une idée des fonctionnalités qu’il va falloir développer sur votre site.

ÉTAPE 4 – Imaginer l’ergonomie des pages principales en dessinant de manière sommaire l’organisation des informations et des images(Mock-up)

  • En fonction de vos contenus vous pouvez imaginer le positionnement (zonage) de votre information page par page – plus d’infos pour savoir comment créer un mock-up.
    CONSEIL : Au plus votre mock-up sera précis au plus vous réduirez le temps d’intervention de votre prestataire web et donc votre budget, sauf bien entendu si vos propositions demandent de nombreuses adaptations car pas suffisamment réalistes. Si vous débutez, tentez de rester simple et pensez à travailler en colonne afin de faciliter l’affichage sur mobile.
  • Si vous connaissez les contraintes du webdesign et que le « Responsive design » n’a pas de secret pour vous, vous pouvez vous lancer sur les mock-up des versions smartphone. Dans le cas contraire, votre développeur wordpress s’occupera de cette phase.

Exemple mock-up zoning

Au terme de cette phase vous devriez pouvoir proposer une vision schématique de vos pages principales qui peut être de simples brouillons sur feuilles papier sur lesquelles vous avez dessiné des zones avec vos futurs textes, images, diaporamas, formulaires…

ÉTAPE 5 – Rédiger un cahier des charges

Si vous l’avez déjà réalisé, vous pouvez très certainement compléter votre cahier des charges avec les informations supplémentaires que les étapes précédentes ont dû vous apporter.
Comment rédiger un cahier des charges pour votre projet WEB ?

LES ÉTAPES SUIVANTES – avec vos prestataires web, rédacteur·rices, consultant·es SEO, graphistes…

  1. Réalisation des maquettes graphiques
  2. Codage et développement du site internet
  3. Travail sur les textes avant intégration pour un contenu performant
  4. Intégration des contenus texte et médias validés par le client
  5. Mise en ligne public du site sur le nom de domaine final
  6. Prestations complémentaires éventuelles par la suite (SEO, maintenance…)

Pour voir des exemples de blog wordpress rendez-vous sur la page des créations de la bécane WEB – voir des exemples

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *