Lab créa

Dis Papa, comment on fait les sites web ?

Comment créer un site web ? Les étapes clés
En moins de 10 secondes, un site web doit séduire le visiteur. Si ce dernier est perdu, ne trouve pas rapidement ce qu’il cherche, ou ne comprend pas l’objet du site, il n’aura aucun scrupule à partir immédiatement vers d’autres sites aux contenus mieux mis en valeur et à la navigation plus intuitive…

Bienvenue dans l’ère du zapping 2.0 ! Pour ne pas perdre toutes ses chances de séduction, voici un petit récapitulatif non exhaustif des bonnes pratiques à respecter lors de la création d’un site web.

1. Connaître les habitudes des internautes – La navigation en F

Une étude menée par le site useit a permis de mieux comprendre comment les internautes sxploraient une page web. Les couleurs sur les visuels permettent de bien se rendre compte de l’attention portée aux différentes parties d’une page web. L’œil “accroche” sur les titres et les sous-titres ainsi que sur toutes les parties de la page présentant un fort contraste de couleur ou de luminosité. L’œil a également tendance à explorer les éléments situés à droite des titres.

On constate que le premier balayage est horizontal et se situe dans la partie supérieure. L’œil entame ensuite un balayage vertical calé sur le côté gauche du contenu principal avant d’explorer tous les points à fort contraste. Ce “voyage de l’œil”, même s’il n’est pas à prendre comme une vérité absolue, permet néanmoins d’établir des lignes directrices lors de la création d’un site web.

2. Connaître sa cible et son secteur

Cela paraît évident, mais au vu de certains cahiers des charges qui nous parviennent régulièrement, un petit rappel semble s’imposer. Chaque secteur possède ses propres règles de communication, y compris sur le web. En effet, certains grands acteurs ont marqué de leur empreinte numérique le domaine d’activité dans lequel ils évoluent. Sauf à avoir une excellente idée, inutile de vouloir réinventer la roue ! Les visiteurs n’ont qu’une envie : trouver rapidement ce qu’ils cherchent. Ils connaissent les codes graphiques en vigueur pour les différentes catégories de sites (e-commerce, blog, comparateur, média, corporate…) mais aussi pour les différents secteurs. Un site web se basant sur une navigation éprouvée aura donc plus de chance de ne pas perdre un internaute. Bien évidemment, le design d’un site doit prendre également en compte la typologie de visiteurs visée.

3. Ne pas faire de l’esthétique à tout prix

L’esthétique d’un site web contribue à sa crédibilité autant qu’à sa popularité. Les visiteurs supposent naturellement qu’un site au design soigné aura un contenu tout aussi étudié, tandis qu’au contraire un site mal conçu présagera d’un contenu douteux. Toutefois, et même si la tentation peu parfois être importante, il ne faut pas “faire du beau pour faire du beau”.

Le choix d’un concept graphique fort, même s’il peut séduire par certains aspects, notamment différenciants, est bien souvent un trop grand risque à prendre face à des cibles sur-habituées aux conventions et n’a souvent d’autres attraits que de satisfaire à l’égo du graphiste (qui a dit que nous ne supportions pas la critique ?). Chaque choix esthétique doit être le fruit d’une réflexion poussée sur son utilité, sur son apport à la clarté du site ou à la navigation. En effet, la simplicité se doit d’être le maître mot lors de la création d’un site web. Ne pas surcharger les pages de gimicks graphiques ou de pictos plus ou moins explicites qui ne feront que perdre le visiteur via des circonvolutions esthético-2.0… (un peu comme cette phrase :p)

4. Respecter les conventions

Si internet évolue tous les jours et semble en perpétuel mouvement, il n’en demeure pas moins qu’une grande majorité des sites reposent sur un socle de conventions qui permettent à tout un chacun de se repérer facilement lors d’une première visite. Libre à vous de vouloir les transgresser (seriez-vous un rebelle dans l’âme ?), mais leur connaissance reste un pré-requis.

  • Le logo doit être en haut de page, le plus souvent à gauche et cliquable vers la page d’accueil quand le visiteur se trouve sur une page intérieure du site.
  • Des colonnes peu larges. Si une colonne est trop large, l’œil se perd et fatigue.
  • Les liens doivent être, le plus souvent possible, soulignés. Une étude récente a démontrée que les internautes cliquaient d’avantage sur les liens soulignés et encore plus quand ces derniers étaient bleus… une habitude directement héritée des moteurs de recherche.
  • Le menu de navigation doit toujours être au même endroit d’une page à l’autre.
  • Sur la page d’accueil, les informations importantes doivent être visibles sans avoir à scroller.
  • Sur les pages très hautes, un menu bas (dans le footer par exemple) viendra faciliter la navigation.
  • Les typos utilisées doivent être des typos web (arial, verdana, etc.) afin que tous les visiteurs puissent voir le site de même façon. À noter, ce dernier point risque de changer dans les années à venir avec l’arrivée de Google Font Directory.

5. Des textes lisibles

S’assurer d’une bonne lisibilité des textes est un facteur essentiel à une accessibilité optimisée. Nombre de sites proposent de véritables “expériences visuelles” dignes des années 80 fluorescentes. Un texte vert sur un fond jaune, des variations de couleurs intempestives plus improbables les unes que les autres… J’en passe et des pires… Outre le parti pris graphique qui peut être discutable, il est nécessaire de conserver un fort contraste entre le fond et la typo.

Le texte le plus lisible et le moins fatigant reste le texte noir sur fond blanc. Bien entendu, vous pouvez vous éloigner de ce grand classique à condition de toujours garder un bon contraste. Mais la lisibilité des textes passe également par leur taille. Heureusement, l’avènement des sites communautaires et du 2.0 a relégué les typos trop petites à une période de l’histoire du web.

6. Une navigation simple et intuitive

Comme je l’ai dit plus haut, le menu de navigation doit toujours être au même endroit de la page. En complément de cette règle, il faut impérativement que le visiteur puisse répondre immédiatement à ces quatre questions :

  • Où suis-je ?
  • Où suis-je allé ?
  • Où puis-je aller ?
  • Comment retourner sur la page d’accueil ?

Mais l’ergonomie d’un site web passe également par une réflexion poussée sur l’arborescence. Il faut notamment veiller à la fameuse règle des 3 clics. En effet, l’internaute doit pouvoir trouver n’importe quelle information se trouvant sur votre site web en 3 clics maximum.
Si cette règle est à respecter un maximum, il ne faut pas oublier le plus important : quel chemin souhaitez-vous faire faire à vos visiteurs ? Où souhaitez-vous les emmener (téléchargement, formulaire, événement…) ? Pour quelles raisons (génération de contacts qualifiés, achats, téléchargement, etc.) ? C’est ici que le savoir-faire d’une agence entre en piste…

La ressource pour aller plus loin

Refonte de site web : ce n’est pourtant pas si compliqué !

Refonte-site-web-smart-guide

Vous avez encore faim d’actus ?

Tous les mois, régalez-vous des dernières nouveautés marketing, directement servies dans votre boîte mail !