Je vous rappelle quand même cet article sur l’ergonomie qui parle également des formulaires et incite à placer les étiquettes des champs à remplir au-dessus de ceux-ci.

25 Ultimate Useful Form Tutorials Using CSS and Javascript | Smashing Buzz.

Beaucoup d’études ont été faites au cours des ans sur différents aspects du design des interfaces pour le web, et ces découvertes sont un atout pour nous aider à améliorer notre travail.

Voici donc 10 conseils ou découvertes sur l’ergonomie et la lisibilité qui pourront vous aider à améliorer l’expérience utilisateur de vos visiteurs.

Dans un formulaire, mieux vaut mettre l’étiquette au-dessus du champ

Une étude de UX Matters a relevé que la position idéale des étiquettes de champ pour un formulaire se trouve au-dessus de ces champs. Sur beaucoup de formulaires, les étiquettes sont mises à gauche du champ, créant ainsi une présentation en deux colonnes. Ceci peut sembler correct, mais ce n’est pourtant pas la présentation la plus efficace.

Pourquoi donc ? Car les formulaires sont généralement orientés verticalement. Les utilisateurs remplissent le formulaire de haut en bas. Ils le lisent de haut en bas, et il est donc plus logique d’avoir le champ à remplir en dessous de l’étiquette qui lui correspond.

Un autre problème se pose lorsqu’on positionne les étiquettes à gauche des champs. Alignerez-vous ces étiquettes à  gauche ou à droite ? Les aligner à gauche facilite le repérage rapide, mais déconnecte l’étiquette du champ qui lui correspond, ce qui peut rendre certains formulaires plus compliqués à lire. Mais aligner à droite les étiquettes a l’effet inverse. Le repérage des différentes informations demandées est plus compliqué, mais c’est plus joli. Les étiquettes au-dessus du champ à remplir sont mieux indiquées dans la plupart des cas.

L’étude montre aussi que le fait que les étiquettes soient en caractères gras n’est pas essentiel, même si cette recommandation est nettement moins définitive que la première.

Les utilisateurs se concentrent sur les visages

Les gens repèrent automatiquement les autres personnes quand ils apparaissent. Sur des pages web, nous tendons à d’abord voir les visages et les yeux des gens, ce qui donne aux commerciaux et publicitaires une bonne technique pour attirer l’attention.

Mais notre attirance pour les visages va plus loin. Nous tendons aussi à regarder dans la même direction que le personnage représenté.

Voici une étude de suivi du regard qui démontre ça. Nous sommes instinctivement attirés par les visages, mais si ce visage regarde dans une autre direction que la nôtre, nous regardons aussi dans cette direction. Prenez avantage de ce phénomène en attirant l’attention de vos utilisateurs sur les parties les plus importantes de votre page, ou de votre publicité.

La qualité du design est un indicateur de crédibilité

Différentes études ont été conduites pour découvrir exactement ce qui influence la perception des utilisateurs concernant la crédibilité d’un site web :

• Ce qui rend les sites crédibles aujourd’hui
• Qu’est-ce qui rend un site crédible ?
• Les éléments de la crédibilité en informatique

Une découverte intéressante de ces études est que les utilisateurs jugent vraiment un livre à partir de sa couverture… ou plutôt un site web à partir de son design.

Des éléments comme la mise en page, la typographie, les couleurs et les mises en forme affectent comment l’utilisateur perçoit votre site web, ou se représente votre projet. Votre site ne doit pas seulement projeter une belle image, mais aussi la bonne image.

D’autres facteurs qui influencent la crédibilité sont la qualité du contenu, la quantité d’erreurs, la fréquence des mises à jour, la facilité d’utilisation et l’aura médiatique des auteurs.

La plupart des utilisateurs ne scrollent pas

Une étude de Jakob Nielsen a révélé que seuls 23% des utilisateurs scrollent lors de leur première visite. Ce qui signifie que 77% des visiteurs ne scrollent pas et ne voient donc que ce qui se voit directement à l’écran. De plus, seulement 16% des visiteurs scrollent à leur seconde visite. Cette donnée met en exergue à quel point il est important de mettre votre contenu principal le plus haut possible.

Cela ne veut pas dire que vous devez essayer de tout entasser dans la partie supérieure de la page. Vous devez seulement utiliser au mieux cette partie. La bourrer de contenu rendrait ce contenu inaccessible; quand les utilisateurs voient trop d’informations, ils ne savent pas où commencer à regarder.

Ceci est évidemment encore plus important pour la page d’accueil. Celle-ci doit contenir des éléments essentiels :

• Le nom du site
• La proposition faite à l’utilisateur (quel bénéfice les utilisateurs vont ils en retirer)
• La navigation vers les parties principales du site qui vont intéresser l’utilisateur.

Toutefois, les habitudes des utilisateurs ont assez bien changé depuis cette étude. Des études plus récentes prouvent que les utilisateurs sont plus enclin à scroller, et que dans certaines situations, ils ont envie de scroller jusqu’en bas de la page. Bien des utilisateurs sont plus à l’aise avec le fait de scroller qu’avec la pagination et pour beaucoup d’entre eux, l’information ne se trouve pas spécialement tout en haut de la page. C’est donc une bonne idée de diviser votre espace pour un meilleur scan des informations, avec beaucoup d’espace autour des éléments pour une lecture facilitée.

Le bleu est la couleur idéale des liens

Même si donner un design unique à votre site est essentiel, quand il s’agit de lisibilité, faire ce que tout le monde fait est la meilleure solution. Suivre les conventions, car quand les utilisateurs visitent un grand nombre de pages, ils cherchent d’abord à trouver des informations là où on les trouve habituellement sur la plupart des sites ; ils utilisent leur expérience pour donner sens à ce nouveau contenu. Les gens s’attendent à ce que certaines choses soient toujours pareilles, comme la couleur des liens, la position du logo, l’habitude de la navigation, etc.

Quelle devrait être la couleur de vos liens ? Le plus important est le contraste : vos liens doivent être suffisamment clairs ou foncés pour contraster avec l’arrière-plan du site. Deuxièmement, ils doivent se détacher du reste du texte : pas de lien noir dans un texte écrit en noir. Et enfin, les recherches montrent que si la lisibilité est votre priorité, en rester au bleu est la meilleure chose à faire, car c’est ce à quoi les utilisateurs s’attendent. Choisir une autre couleur n’est pas un problème du tout, mais ça pourrait affecter la vitesse à laquelle les utilisateurs trouvent vos liens.

Ceci est la fin de la première partie de cet article, traduit de cet article de Smashing Magazine.

Hosted Solutions For Front End Developers / Designers | W3Avenue.

How AJAX Works: 10 Practical Uses For AJAX | Noupe.

AJAX Hotel Reservation Form 2.0 Released « Martin Ivanov.