Le processus de création d’un site web

Dans un monde qui se dirige vers une digitalisation quasi totale, les entreprises ont plus que jamais conscience de l’importance de leur présence en ligne, à commencer par leur site web. Vitrine de leur activité aussi bien que de leur identité, le site est donc une étape obligatoire pour toute entreprise. Mais quelles étapes sont nécessaires pour la création de cette vitrine? Par où commencer et quelles questions se poser pour un résultat optimal?

 

La création d’un site web comporte plusieurs étapes à ne pas négliger pour livrer un support adapté, tant d’un point de vue technique qu’esthétique. N’oublions pas qu’un site doit être agréable à voir mais aussi à utiliser: c’est ce qu’on appelle l’UI design (=user interface, ce qui concerne les éléments perceptibles) et l’UX design (=user experience, qui prend en compte le parcours de visite, l’aspect responsive ou encore l’accessibilité). La combinaison de l’UI et de l’UX permet de créer un résultat esthétique et ergonomique pour offrir au visiteur la meilleure expérience possible.

 

Selon l’infographie créée par Magnus Revang, il est possible de classifier l’User Experience en 6 catégories principales :

1.     Visibilité : stratégie de référencement anticipée, objectifs marketing définis, choix efficace de nom

2.     Accessibilité : site responsive, compatibilité avec les navigateurs, temps de réponse courts

3.     Attractivité : choix de polices pertinent, couleurs harmonieuses, contrastes suffisent, éléments graphiques

4.     Facilité : le site ergonomique, logique, intuitif et consistant

5.     Crédibilité : la plateforme rassure les internautes sur la fiabilité, la conformité et le ton adapté à la marque

6.     Efficacité : le site est agréable, les fonctionnalités marchent et ne présentent pas de bug

Étape 1 : le type de site

Plusieurs aspects sont à considérer avant d’entamer le processus de création, et ce, afin de définir le type de site dont il est question: Quel est le but premier du site internet? Est-ce une simple vitrine, un canal de vente ou encore un complément des réseaux sociaux?

D’autres facteurs sont aussi à prendre en compte pour définir le type de site, comme par exemple le nombre de pages, les fonctionnalités techniques (site transactionnel, login) ou encore le nombre de langues dans lesquelles le site sera traduit. La conception doit également prendre en compte l’aspect responsive, anticiper les devices par lesquels le site sera majoritairement consulté: principalement via un mobile ou un ordinateur?

Étape 2: le plan du site

Une fois le type de site établi, place au plan du site ou site map en anglais. C’est un élément essentiel qui va définir l’arborescence du site et la hiérarchisation des contenus. La construction des menus contenant les différentes pages et sous-pages du site doit constituer un cheminement logique et pratique pour que le visiteur trouve facilement ce qu’il cherche.

Étape 3 : la maquette

Lorsque les fonctionnalités et le plan du site ont été définies, le maquettage peut commencer. Avant de passer à l’étape design, il est recommandé de passer par des maquettes de type wireframes – en français, fil de fer. Les wireframes sont des maquettes fonctionnelles et schématiques qui vont nous aider à définir l’emplacement des divers éléments et composants sur les pages. Ils permettent de visualiser les zones de contenus (textes, vidéos ou images), les en-têtes ou encore le menu: en bref, tout ce que le site doit contenir, hormis l’aspect esthétique.

Les wireframes sont un excellent support pour aider le client à définir les quantités de contenus qu’il doit produire (si ceux-ci n’existent pas encore). Rappelons que lors de la création d’un site web, le temps que prend la rédaction des contenus est souvent minimisé: attention donc à prévoir la planification en conséquence!

 

Les maquettes intègreront donc tous les éléments visuels de la charte mais aussi des images, les couleurs, des vidéos ou encore des illustrations. Le webdesigner crée un site esthétique, lisible et en accord avec l’univers graphique de la marque. Le design doit également être adapté pour être consulté depuis tous les terminaux existants (smartphone, tablette, etc).

Étape 5 : Le développement du site

Une fois terminées et validées, les maquettes sont transmises au développeur. C’est l’étape « technique » du processus : le développeur va se charger de coder le design afin qu’il prenne vie et qu’il devienne un site fonctionnel pour pouvoir le mettre en ligne.

Parfois, il peut y avoir des différences notables entre les maquettes validées et le site final, certains éléments devant être adaptés ou améliorés au fur et à mesure du développement. Cela inclut donc un bon nombre d’allers-retours entre le designer et le développeur afin de régler les détails esthétiques et techniques.

Et la durabilité dans tout ça ?

La dimension écologique est un sujet que l’on ne peut plus mettre de côté aujourd’hui. Les entreprises y ont un rôle important à jouer, y compris quand il s’agit de leur site internet et de leur présence en ligne. Choix de l’hébergeur, tailles et poids des éléments que contiennent le site ou encore accessibilité – il existe une multitude de bons réflexes à adopter pour qu’un site soit le plus durable possible.

Nous vous en parlerons tout prochainement dans un article dédié à la durabilité et à l’accessibilité des sites web – en attendant nous vous encourageons vivement à consulter le GR491, guide de référence de conception responsable de services numériques ainsi que le site de Green IT.