Méthodologie de production de site internet

-
Légende
Découvrez notre méthode pour la création de site internet par étapes successives.
Produire un site Internet sur mesure n’est pas facile, il faut obligatoirement suivre une méthode étape par étape afin d’obtenir un résultat de qualité et conforme aux attentes.
Produire un site internet de qualité professionnelle nécessite la maîtrise de plusieurs disciplines : prototypage, graphisme, codage, base de données, système de gestion de contenu…
Pour cette raison il est indispensable d’établir une méthode de travail. La méthode a pour but d’organiser et de mener à bien un projet de bout en bout. Il s’agit pour la personne en charge du projet, d’utiliser la méthode de travail définie et de conduire le projet en s’assurant que celui-ci est mené à bien dans les règles préalablement définies.
Avant d’expliciter notre méthodologie, il convient de préciser quelques points concernant le type de projet correspondant le plus à cette méthode. En effet, cette méthode s’applique à des projets sur mesure où le système de gestion de contenu (CMS) ne sera pas trop contraignant, pour que le projet s’adapte aux objectifs du client. Cette méthode convient spécifiquement aux projets qui nécessitent de produire un site internet à partir de prototypes .
Un site internet sur mesure c’est quoi exactement ?
On peut considérer qu’à partir du moment où le projet comporte la création d’une interface graphique originale dessinée dans Photoshop, il s’agit d’un site sur mesure. Le projet peut comporter des étapes avant la conception graphique comme un organigramme, des prototypes, mais dès que celui-ci comporte une interface conçue spécifiquement pour le client il s’agit bien d’un site sur mesure. À partir du dessin, le projet va suivre d’autres étapes en aval de la méthode afin d’aboutir à un site internet fonctionnel correspondant au dessin original et avec toutes les fonctionnalités proposées par le codage web.
Dans la description de cette méthode nous avons omis la partie rendez-vous client et nous partons du principe que le projet est validé avec un devis signé.
01 - Étape de définition de projet
Analyse du contexte
Avant de proposer des solutions adaptées au projet, il convient d’analyser le contexte. S’agissant de projets dans le domaine de l’internet, une immense source d’informations est disponible en quelques clic. Mais celle-ci restera complémentaire par rapport au client qui connaît mieux que personne son secteur d’activité.
Identification du public visé
Il s’agit ici d’envisager le plus précisément possible les futurs utilisateurs du site web. Il est en effet essentiel de savoir à quel public sera destiné le site internet. Sans cette information, le projet a de fortes chances de ne pas aboutir au résultat attendu et de manquer sa cible.
Identification des objectifs marketing
Pourquoi le client souhaite réaliser un projet web? Quel sont les objectifs du site internet à moyen et long termes et quelles sont les attentes du client? Toutes les réponses à ces questions dépendent évidemment du type de projet : e-commerce, site d’informations, etc. Les objectifs marketing une fois définis sont prioritaires pour la personne en charge de la conduite du projet et celui-ci doit impérativement les atteindre.
Identification de la concurrence
Les concurrents qui ont déjà un site internet dans le même domaine d’activité sont une source d’inspiration importante. Cela permet d’emblée de répondre à de nombreuses questions : utilisateurs, architecture du site, environnement graphique, etc., il s’agit de prendre en compte tous ces éléments pour imaginer un projet plus ambitieux.
Comme pour le contexte, le client est la meilleure personne pour identifier ces sources et définir les éléments pertinents pour son projet. Mais il faut aussi prendre en compte l’expérience accumulée par la réalisation d’autres projets dans le même domaine d’activité par l’agence, qui parfois est un excellent atout.
Analyse des forces et faiblesses du site internet actuel
Si il s’agit de procéder à la refonte d’un site internet, cette opération sera facilitée par une version en ligne même si celle-ci est ancienne. C’est un très bon point de départ pour travailler à la conception d’un nouveau site. Cela va offrir un point d’encrage pour imaginer la suite, avec les éléments à reprendre ainsi que ceux qui n’ont pas fonctionné.
Orientations graphiques
À la fin du briefing de projet, il est déjà possible d’envisager quelques pistes de réflexion au sujet des orientations graphiques. Celles-ci seront ensuite travaillées pour aboutir à un cahier des charges graphique qui sera inclus dans le cahier des charges global. Les orientations graphiques se décomposent en plusieurs éléments :
- Les contraintes graphiques qui ont pour but de définir les limites des pages, les marges, le fond, etc.
- Les gammes de couleurs possibles en fonction du logo ou d’autres éléments graphiques déjà disponibles
- L’apparence du site: professionnel, clair, simple, etc.
- La charte graphique si celle-ci est déjà définie
- Le logo et les documents qui l’accompagnent
- Les notes prises lors du briefing de projet
Mise au point du cahier des charges
Le cahier des charges est un document de synthèse des éléments évoqués précédemment : analyse du contexte, identification du public visé, identification des objectifs marketing, identification de la concurrence, analyse des forces et faiblesses du site Internet, cahier des charges graphiques avec pour compléter un plan sous la forme d’un organigramme qui explicite les modèles des pages à réaliser. Le cahier des charges peut également être complété par d’autres éléments de normes et d’éléments graphiques à reprendre comme le logo, etc. Cela varie en fonction des projets. Une fois élaboré, le cahier des charges va servir de guide tout au long de la conception du projet et cela pour tous les intervenants.
Création du compte de suivi de projet
À ce stade, tous les éléments sont en place pour travailler au projet. Il faut cependant prévoir un espace pour suivre les différentes étapes de la conception du projet côté client. Pour cela, un espace privé au sein d’un site internet peut être un très bon outil. Celui-ci peut proposer d’avoir un aperçu de l’avancement global du projet, mais aussi de voir et de valider les différentes propositions graphiques, les prototypes, etc. L’espace privé peut aussi afficher le temps alloué au projet ainsi que l’attente entre les différentes validations du client.
02 - Étape de développement de l'architecture du site
Inventaire des contenus existants sur le site actuel et hors web
Avant de travailler à la conception du projet il est préférable de posséder tous les éléments du client. Il peut s’agir des textes, du logo, d’éléments graphiques d’autres projets, flyer, brochures, catalogue… Le but est de gagner du temps pour ne pas reproduire un logo déjà réalisé précédemment. Mais aussi de s’inspirer de ce qui a déjà été produit pour aller plus loin en terme graphique.
Élaboration de la structure générale du site
Pour faciliter le travail de tous les intervenants, un plan sous la forme d’un organigramme est un vrai plus. Même quand il s’agit d’un projet avec seulement quelques pages, cela aide à la compréhension du travail à réaliser. On peut considérer deux types de plan, un pour les sites statistiques et un pour les sites dynamiques. Dans le premier cas il sera question de prévoir les pages du projet, pour un site dynamique on parlera plus de modèles de pages.
Agencement du contenu
Définir concrètement ce qu’il convient d’ajouter dans chacune des pages du site. Ici aussi, cela va dépendre du type de site. Pour un site statique, il faudra imaginer le contenu pour chacune des pages du site en plus du haut et bas de page. Pour un site dynamique, ce sera également le cas mais pour chaque modèle de page. Quoi qu’il en soit, il s’agit de noter précisément dans un document le contenu que chaque page ou modèle de page doit comporter.
Convention de nommage des pages
Quant il s’agit de travailler sur des projets de grandes envergures, nommer chaque page ou modèle de page avec un nom approprié est indispensable. En effet, cela facilite les échanges avec chaque intervenant du projet et permet de gagner du temps. Chaque page ou modèle sera nommé avec un identifiant unique et celui-ci sera indiqué sur le plan préparatoire et sur l’organigramme ensuite.
Création des gabarits de page
Étape incontournable pour réussir un projet web, un gabarit ou prototype est un schéma dépourvu d’éléments graphiques indiquant l’emplacement des zones de contenu : logo, menus de navigation, boutons, images, pictogrammes, textes… En fonction du type de projet : site d’information, e-commerce…, plusieurs prototypes pourront être réalisés pour la page d’accueil et les autres pages intérieures du site. Pour cette étape, il est très important de travailler en concertation avec le pôle développement, cela afin d’être sûr que le gabarit puisse être exploité lors de la phase de codage du projet.
Création de scénarios utilisateur
Pour les sites internet de grande envergure, il peut être envisageable de prévoir des scénarios utilisateur. La création de scénarios utilisateur vise à décrire les différentes étapes et interactions qu'un utilisateur pourrait avoir lorsqu'il interagit avec le site. Un scénario utilisateur est une narration détaillée qui décrit les actions, les besoins et les objectifs d'un utilisateur spécifique tout au long de son parcours sur le site.
Définition des mots clés pour le référencement
Les mots-clés pour le référencement d'un site internet sont des termes ou des expressions spécifiques qui sont utilisés pour décrire le contenu et le thème du site de manière à le rendre plus facilement identifiable par les moteurs de recherche. Ces mots-clés sont sélectionnés en tenant compte des requêtes que les utilisateurs sont susceptibles de saisir dans les moteurs de recherche lorsqu'ils recherchent des informations pertinentes.
03 - Etape de conception graphique
Elaboration des concepts
Avant de réaliser l’interface graphique du site internet qui concerne l’ensemble des modèles de page, il peut être judicieux de créer des concepts. Un concept est une page d’inspiration graphique qui a pour but d’imaginer un style graphique particulier en fonction des objectifs définis dans le cahier des charges. Celui-ci peut être composé d’une gamme de couleurs, un choix typographique, des images et pictogrammes. L’objectif est de valider un style graphique avant de lancer la conception graphique.
Elaboration de la charte graphique
L'élaboration de la charte graphique d'un site internet consiste à définir un ensemble de directives visuelles cohérentes et uniques qui guideront la conception et l'apparence graphique du site. La charte graphique joue un rôle clé dans l'identité visuelle de la marque et contribue à la reconnaissance et à la mémorabilité du site.
Création de l'interface graphique de la page d'accueil
La création de l'interface graphique de la page d'accueil d'un site internet consiste à concevoir visuellement cette première page que les utilisateurs voient lorsqu'ils accèdent au site. L'objectif principal de la page d'accueil est d'attirer l'attention des visiteurs, de communiquer efficacement le message de la marque et de faciliter la navigation vers les différentes sections du site.
Création de l'interface graphique des pages types
La création de l'interface graphique des pages types d'un site internet fait référence à la conception visuelle et interactive des différentes pages qui composent le site, en dehors de la page d'accueil. Ces pages types comprennent souvent des modèles de mise en page réutilisables pour différents types de contenu ou sections du site.
Création de l'interface graphique de la newsletter
Dans la continuité de la conception du site, il peut être envisageable de réaliser un modèle de newsletter. Pour cela la charte graphique du site sera utilisé. La création de l'interface graphique d'une newsletter fait référence à la conception visuelle de la mise en page et du contenu d'un email envoyé périodiquement aux abonnés d'une liste de diffusion. L'objectif principal de l'interface graphique de la newsletter est de rendre le contenu attrayant, facile à lire et à comprendre, et de favoriser l'engagement des abonnés.
Validation graphique avant production
La validation graphique fait référence au processus de vérification et d'approbation de l'apparence visuelle de l’interface graphique avant sa mise en production ou sa diffusion. Elle vise à s'assurer que le travail graphique correspond aux attentes, aux exigences et au cahier des charges préalablement établie.
04 - Etape de production et intégration
Création du code source des pages-types
Il s’agit du développement des fichiers de code nécessaires pour construire et rendre fonctionnelles les différentes pages d'un site internet. Processus réalisé a l’aide de code en HTML, CSS et JavaScript.
Découpage et optimisation des éléments graphique sur les pages
Il s’agit du processus de conversion des éléments visuels, tels que les images, les icônes, les logos, les boutons, etc., en fichiers adaptés à l'affichage sur un site web. Cette étape est essentielle pour améliorer les performances du site en réduisant la taille des fichiers graphiques, tout en maintenant une qualité visuelle optimale.
Insertion des contenus statique textes, images, animations…. (Pour les sites statiques)
Concernant les sites statiques, il s’agit de la création et de l’intégration des éléments visuels dans le code HTML d'une page web. Ces contenus sont affichés de manière fixe et ne sont pas modifiés dynamiquement en fonction des actions de l'utilisateur.
Création des bases de données pour les contenus dynamiques
Cette étape consiste à concevoir et mettre en place une structure de stockage organisée pour les données qui seront affichées et gérées de manière dynamique sur le site. Cette base de données permet de stocker et de récupérer les informations nécessaires pour alimenter les fonctionnalités interactives et personnalisées du site.
Création du back Office d'administration (CMS)
Le CMS (Content Management System), fait référence à la conception et au développement d'une interface conviviale permettant de gérer et de mettre à jour facilement le contenu et les fonctionnalités du site.
Production des pages-types en php pour rendre le site dynamique
Il s’agit ensuite du procéder au développement des fichiers PHP qui génèrent dynamiquement le contenu des pages web en fonction des données stockées dans une base de données ou d'autres sources de données externes.
05 - Etape de référencement et optimisation
Optimisation technique des pages pour le référencement
Le SEO technique, désigne l'ensemble des actions visant à optimiser la structure, le code et la performance d'un site web afin d'améliorer sa visibilité et son classement dans les résultats des moteurs de recherche.
Optimisation des mots clés
Il s’agit de l’élaboration d’une stratégie visant à sélectionner et à intégrer judicieusement des mots clés pertinents dans le contenu du site, afin d'améliorer son classement dans les résultats des moteurs de recherche.
Création d’un plan de site pour indexation Google avec mise à jour dynamique
Afin de faciliter l'indexation par Google et les autres moteurs de recherche, nous adressons un plan complet des pages du site internet au format XML avec mise à jour automatique.
Inscription dans les moteurs de recherche
Il s’agit pour nous de soumettre le site aux moteurs de recherche afin qu'ils le connaissent et l'indexent dans leur base de données. Cela permet au site d'apparaître dans les résultats de recherche lorsque les utilisateurs effectuent des requêtes liées à son contenu.
Réécriture du nom des pages dynamiques (option dynamique)
Egalement connue sous le nom de URL rewriting, la réécriture est un processus qui consiste à modifier les adresses URL des pages générées dynamiquement par le site. L'objectif principal est de rendre les URL plus lisibles, conviviales et compréhensibles pour les utilisateurs et les moteurs de recherche.
06 - Etape de statistique et maintenance
Statistiques complètes depuis l’hébergement
Votre hébergement bénéficies de statistiques sur l'utilisation et la performance d'un site web à partir de l'infrastructure utilisée. Cela inclut généralement les statistiques de trafic, les données de chargement des pages, les informations sur les visiteurs et d'autres mesures de performance clés.
Statistiques avec le CMS
Le CMS dispose généralement de statistiques sur le trafic, les pages les plus visitées, les mots clés, les commandes, etc.
Statistiques avec Google Analytics
La plateforme d'analyse web gratuite proposée par Google permet de collecter et d'analyser des données détaillées sur l'activité de votre site web.
Notre méthodologie de travail est inspirée du livre sur la conduite de projet « Redesign web 2 » , de Kelly Goto &Emily Colter au édition Eyrolles.

Commentaires(12)
Vous souhaitez pouvoir ajouter un commentaire à l'article Méthode de création ou de refonte de site internet, ou faire profiter de votre expérience avec les internautes, ajoutez votre commentaire il sera mis en ligne après validation par notre équipe
Votre commentaire a bien été prise en compte, notre équipe vous envoi un mail de confirmation une fois mis en ligne.
Votre commentaire est en attente de modération. Voir votre commentaire
Derniers commentaires
zouhair - 1 réponse
Bonjour ce sont les étapes que je cherche depuis toujours sur internet, je ne trouve que des articles faibles en contenu. Par contre le vôtre traite exactement du fond des enjeux. Maintenant ce qui reste c'est le suivi en détail. Merci
Réponse - Olloweb
Cher Zouhair, nous sommes ravis que notre contenu ait pu répondre à vos attentes. Nous nous efforçons de fournir des informations de qualité et approfondies sur les sujets qui vous intéressent. En ce qui concerne le suivi en détail, notre équipe est là pour vous accompagner et répondre à toutes vos questions. N'hésitez pas à nous contacter pour obtenir plus d'informations ou pour discuter plus en détail de vos besoins. Merci de votre confiance et de votre soutien !
Eléonore - 1 réponse
Quelle est l'étape initiale dans la méthodologie de production d'un site Internet sur mesure ?
Réponse - Olloweb
La première étape pour créer un site Internet sur mesure est de comprendre les besoins et les objectifs de votre entreprise. Chez Olloweb, nous commençons par une phase de consultation approfondie pour comprendre vos attentes et définir les fonctionnalités nécessaires.
Mathis - 1 réponse
Pourquoi est-il important d'identifier le public visé lors de la création d'un site Internet ?
Réponse - Olloweb
L'identification du public cible est essentielle lors de la création d'un site Internet. Cela nous permet de concevoir une expérience utilisateur adaptée à leurs besoins et préférences. Nous effectuons une analyse approfondie de votre marché cible pour garantir que votre site atteigne les bonnes personnes.
Léa - 1 réponse
Quelles sont les informations nécessaires pour définir les objectifs marketing d'un projet web ?
Réponse - Olloweb
Pour définir les objectifs marketing d'un projet web, nous avons besoin d'informations telles que votre positionnement sur le marché, vos concurrents, vos produits ou services, et vos objectifs commerciaux. Ces éléments nous aident à déterminer les meilleures stratégies de marketing en ligne pour atteindre vos objectifs.
Hugo - 1 réponse
Comment la concurrence existante dans le même domaine peut-elle être utilisée comme source d'inspiration ?
Réponse - Olloweb
La concurrence existante dans votre domaine peut être une source précieuse d'inspiration. En analysant les sites Internet de vos concurrents, nous pouvons identifier les tendances du marché, les bonnes pratiques et les opportunités d'amélioration. Cela nous permet de vous proposer une solution qui se démarque et répond aux attentes de vos clients potentiels.
Clara - 1 réponse
Quelles sont les étapes clés de la conception graphique d'un site Internet ?
Réponse - Olloweb
La conception graphique d'un site Internet passe par plusieurs étapes clés. Tout d'abord, nous recueillons vos préférences en matière de design et nous effectuons des recherches pour trouver des inspirations. Ensuite, nous créons des maquettes et des prototypes pour visualiser l'apparence du site. Enfin, nous affinons les détails du design en travaillant étroitement avec vous pour obtenir un résultat final qui correspond à votre identité visuelle et qui séduit vos utilisateurs.