21Oct
Les règles de base du Webdesign
Lors de la conception d’un site web, il est important de prendre en compte un certain nombre d’éléments pour définir les fonctionnalités et le design, au même titre que l’aspect esthétique et le design pur.
Loi de Hick
Plus les choix proposés au visiteur sont nombreux, plus l’utilisateur augment son entropie par rapport à l’information délivrée (+ le message est brouillé).
En d’autres termes, au niveau de la vente par exemple, plus on donne de choix, moins les achats sont nombreux.
NB: voir également entropie de Shannon sur la récurrence.
Loi de Pareto (80/20)
Les visiteurs agissent globalement peu sur l’application/site web (20% seulement vont déclencher une action comme remplir un formulaire, lancer une recherche, s’inscrire à newsletter, laisser un commentaire, réaliser un achat etc..).
De la même façon, seul 20% du contenu d’un site web est généralement consulté. D’où l’importance apportée à l’ergonomie, comme les menus ou encore les dispositifs de mise en avant de contenus pour cibler/varier les actions visées.
Règle des tiers
Il s’agit de décomposer l’image en 3 dans le sens de la longueur et de la largeur, ce qui donne 9 portions d’images.
Il est préférable de :
- placer les éléments à important à l’intersection des lignes
- placer les éléments secondaires le long des lignes
- éviter de placer les éléments dans les zones « mortes » (sans ligne ni intersection)
- placer l’élément central sur les 1/3 ou 2/3 de l’ensemble.
Proximité
Les éléments placés les uns côté des autres sont perçus comme « allant de pairs », comme les “en savoir plus” placés juste en dessous des paragraphes par exemple.
Il s’agit ici de bien définir les zones de chaque application pour ne pas perturber la lisibilité.
Feedback
C’est la visibilité des déclencheurs d’actions qui est le point-clé de l’ergonomie, comme par exemple les barres de chargement, les décorations de liens (actifs, visités, survolés), la conception des formulaires etc .
Le fait de ne pas prendre en compte ces éléments reviendrait à avoir une voiture avec une clé de contact difficile, voire impossible à trouver.
Loi de Fitt
La loi de Fitt peut être décrite comme suit « le temps nécessaire à l’utilisateur pour pointer la cible est fonction de la taille de la cible et de la distance vers la cible”.
En d’autres termes, plus le déclencheur d’action est gros et près de la souris à un moment T, plus il a de chance d’être actionné. Comme par exemple le fait de mettre le bouton « sauver » d’un formulaire en gros et mettre des petits liens textes pour « supprimer » ou « annuler », augmentera la proportion de formulaires complétés.
Nombre d’or
C’est le ratio considéré comme « esthétique » par l’œil humain correspondant à 0,618. Sur un rectangle, le résultat des points liés en courbes donnera un coquillage.
Rasoir d’Ockham
« Les multiples ne doivent pas être utilisés sans nécessité » (« pluralitas non est ponenda sine necessitate »), ce qui revient à dire au niveau du web que « la solution la plus simple est la meilleure ».
Une autre phrase clé serait « un design est terminé non pas lorsqu’il n’y a plus rien à ajouter, mais davantage lorsqu’iul n’y plus rien à supprimer ! ».
Suite de Fibonacci
La suite de Fibonacci est une suite d’entiers au sein de laquelle un des nombres est la somme des deux nombres précédents. Ainsi dans photophop par exemple, les patterns (sont des motifs respectant la suite de Fibonacci) permettent de créer des figures, formes, grilles et d’en respecter des ratios.
Modèles mentaux
On considère que les utilisateurs ont plus de facilité à apprendre de nouvelles choses lorsqu’elles ressemblent à quelque chose qu’ils connaissent déjà.
Par exemple, les pictogrammes employés dans les sites web comme la maison pour organiser pour la page d’accueil, la loupe pour la recherche, le dossier etc.
