Mis à jours 11 décembre 2017 C’est la facilité d’utilisation et l’utilité mais non le design visuel qui détermine le succès ou l’échec d’un site web. Puisque le visiteur de la page web est la seule personne qui clique sur le souris, c’est-à-dire celle qui décide de tout, les designs de site web centrés sur l’utilisateur sont devenus l’approche standard pour le succès et la profitabilité d’un site web. Après tout, si l’utilisateur ne peut pas accéder à une fonctionnalité du site, elle ne sert quasiment à rien.
Nous n’allons pas parler des détails concernant la mise en place du design (comme, par exemple, où placer la boîte de recherche). Nous allons plutôt nous concentrer sur les principes généraux et approches à suivre pour avoir un design efficace. Des approches qui utilisées proprement, peuvent induire des décisions complexes à propos du design mais qui vont simplifier la présentation d’information sur le site.
Liste de contenu
Les principes d’un bon et efficace design de site web
Pour appliquer les principes suivants de la bonne manière, nous devons d’abord comprendre comment les utilisateurs interagissent avec les sites web, comment ils pensent et quels sont les traits généraux de l’attitude des utilisateurs.
La façon avec laquelle les utilisateurs pensent
Généralement, les habitudes des utilisateurs sur le web ne sont pas si différentes de celles des clients dans un magasin. Les visiteurs jettent un coup d’œil sur chaque nouvelle page, font défiler la page et cliquent sur le premier lien qui capte leur attention ou qui ressemble vaguement à ce qu’ils cherchent. Effectivement, ils ne regardent même pas une grande partie de la page.
La plupart des utilisateurs recherchent quelque chose d’intéressante (ou utile) sur laquelle ils peuvent cliquer. Aussitôt qu’ils trouvent quelque chose de ce genre, ils cliquent. Si la nouvelle page ne correspond pas à ce qu’ils s’attendaient, le bouton retour est très souvent cliqué et ils recherchent ailleurs.
• Les utilisateurs apprécient la qualité et la crédibilité. Si la page fournit un contenu de grande qualité, ils seront prêts à faire abstraction des contenus avec publicité ou du design du site. C’est pour cette raison que les sites web qui n’ont pas forcément un design élégant mais qui publient des contenus de qualité gagnent beaucoup de trafic, tout au long de l’année. Le contenu est plus important que le design
• Les utilisateurs ne lisent pas, ils font défiler la page. Lorsque les utilisateurs analysent une page, ils recherchent un point fixe ou un repère pour les guider à travers le contenu de la page.
Les utilisateurs ne lisent pas, ils font défiler la page. Notez sur cette photo que les parties que l’utilisateur lit, sont concentrées sur le début et milieu des textes. C’est une attitude typique chez les utilisateurs.
• Les utilisateurs sont impatients et espèrent être gratifiés de suite. Un principe très simple : Si le site web ne correspond pas aux attentes des utilisateurs, cela veut dire que le designer n’a pas fait un bon travail et la compagnie risque de perdre de l’argent. Plus un site fait appel au sens cognitif d’un utilisateur ou moins il est concis, plus l’utilisateur veut quitter la page et trouver d’autres alternatives.
• Les utilisateurs ne considèrent pas tous les choix, ils choisissent le premier venu qu’ils aiment. Les utilisateurs ne recherchent pas le moyen le plus rapide pour trouver ce qu’ils recherchent. Ils ne lisent pas, non plus, la page web d’une façon linéaire, c’est-à-dire passer consécutivement de section en section. Au lieu de cela, ils se satisfassent facilement : ils choisissent la première option satisfaisante.Une fois qu’ils trouvent un lien qu’ils pensent être une solution pour leur recherche, il y a de bonnes chances qu’ils cliquent immédiatement. C’est difficile d’optimiser (considérer tous les choix) et ça prend beaucoup de temps. C’est pour cela que les utilisateurs se satisfassent rapidement. Il faut alors les donner ce dont ils ont exactement besoin.
Les utilisateurs ne lisent pas linéairement. Cette photo montre l’attitude des utilisateurs quand ils lisent une page web.
• Les utilisateurs suivent leur intuition. Dans la plupart des cas, les utilisateurs ne lisent pas le contenu que le designer a fourni. Au lieu de cela, ils regardent les choses comme un ensemble. Selon une source, la raison est que l’utilisateur ne se soucie pas du contenu. Il explique que ‘s’ils trouvent quelque chose qui marche, ils vont forcément l’utiliser. Ce n’est pas un problème pour eux s’ils ne comprennent pas comment ça marche, le plus important pour eux c’est qu’il marche. Il faut faire en sorte alors de donner exactement ce qu’ils veulent’.
• Les utilisateurs veulent avoir le contrôle. Ils veulent être capables de contrôler leur navigateur et de compter sur la présentation constante d’information à travers le site. Par exemple, ils ne veulent pas avoir des onglets qui apparaissent soudainement et ils veulent un bouton retour pour retourner à une page précédente. Par conséquent, il n’est jamais bon d’ouvrir les liens dans un nouvel onglet.
1. Faites en sorte que les utilisateurs n’aient pas besoin de se casser la tête pour comprendre
La première loi à suivre pour qu’un site web soit facile à utiliser est que ses pages soient évidentes, concises et ne nécessitent pas d’explication. Quand vous créez un site web, votre but devrait être de ne pas susciter des questions. C’est-à-dire que c’est l’utilisateur qui doit prendre les décisions en considérant eux-mêmes les avantages, les inconvénients et les alternatives.
Si la navigation et l’architecture du site nesont pas intuitives, le nombre de questions va augmenter. Il sera aussi difficile pour les utilisateurs de comprendre comment le site marche et comment aller d’un point A à un point B sur le site. Une structure claire, des visuels modérés et des liens facilement reconnaissables vont permettre aux utilisateurs de trouver facilement ce qu’ils cherchent.
Regardons un exemple. Beyondis.co.uk affirme qu’ils sont “beyondchannels, beyondproducts, beyond distribution” (‘au-delà des chemins, au-delà des produits, au-delà des distributions’). Mais ça veut dire quoi au juste ? Vous avez tout de suite compris, vous ? Et dire que ces trois éléments sont ce que les utilisateurs voient en premier sur la page.
Même si le design est plutôt simple et intuitif, l’utilisateur est forcé de trouver la réponse à cette question pour comprendre le but de la page. C’est le genre de questions nullement nécessaires qu’on doit éviter. C’est la tâche du designer de faire en sorte que le nombre de questions soit à peu près au nombre de 0. Sur l’exemple, le support visuel qui explique l’affirmation est à droite, alors que simplement échanger la place de l’image et celle de l’affirmation rendrait la chose plus facile à comprendre.
Expression Engine a presque la même structure que Beyondis, mais évite les questions inutiles. En plus, le slogan devient fonctionnel parce qu’il propose des options pour que l’utilisateur puisse essayer le service et télécharger la version gratuite.
En faisant en sorte que l’utilisateur n’utilise pas trop son sens cognitif, vous leur permettez de facilement connaitre le but de la page. Une fois que vous avez réussi cela, vous pouvez leur expliquer pourquoi la page est utile et comment ils en bénéficieront. Les gens ne vont pas utiliser votre site web s’ils ne savent même pas ce qu’il est vraiment et comment y naviguer.
2. Ne testez pas la patience des utilisateurs
Avec chaque projet où vous voulez offrir des services ou outils à vos visiteurs, essayez de minimiser les actions qu’ils doivent faire. Moins de choses ils doivent faire pour pouvoir tester un service, plus il y a de chance qu’ils l’essaient vraiment. Ceux qui visitent pour la première fois votre site, veulent jouer avec les services, et non remplir un long formulaire pour un service qu’ils ne vont peut-être même pas utiliser. Laissez-les explorer le site et découvrir ce que vous faites sans les forcer à partager leurs informations personnelles. Il ne serait pas raisonnable de forcer les utilisateurs à écrire leur adresse email pour qu’ils testent un de vos services.
Les utilisateurs seront plus désireux de donner leur adresse email, si vous leur demandez après qu’ils aient pu voir vos services. Ainsi, ils auront une idée de ce qu’ils vont avoir en retour.
Stikkit est le meilleur exemple d’un service convivial parce qu’ils ne demandent rien du visiteur ou qu’ils les forcent à faire quelque chose. Par conséquent, le visiteur se sent très confortable sur le site. Et c’est aussi ce que vous voulez pour votre site.
Apparemment, Mite demandent plus de leurs visiteurs. Mais la souscription peut être faite en moins de 30 secondes : Puisque le formulaire a un format horizontal, l’utilisateur n’a même pas besoin de faire défiler la page.
Autrement dit, ne demandez pas à vos visiteurs de se souscrire ou de s’abonner dès que votre site s’ouvre. Evitez tout ce qui peut les empêcher de visiter votre site.
3. Attirez l’attention des utilisateurs
Puisque les sites web montrent à la fois des contenus statiques et dynamiques, certains aspects de l’interface utilisateur attirent plus l’attention que d’autres. En effet, les images sont plus attirantes que les textes, tout comme les textes en gras attirent plus que les textes normaux.
L’œil humain est un organe incroyablement non-linéaire. Par conséquent, les utilisateurs peuvent instantanément reconnaitre les rebords, les formes et les mouvements. C’est pour cela que les publicités vidéo sont extrêmement énervantes et dérangeantes, mais d’un point de vue marketing elles capturent remarquablement l’attention.
Humanized utilise parfaitement ce phénomène. Le seul élément qui est directement visible par les utilisateurs est le mot « free » (gratuit). C’est attractif et attrayant, mais reste aussi sobre et purement informatif. Après, les indications subtilement placées donnent l’information nécessaire pour que les utilisateurs puissent savoir plus à propos du produit gratuit («free»).
Attirez l’attention des utilisateurs sur des zones spécifiques du site, en utilisant modérément des éléments visuels. Cela aidera vos visiteurs à aller d’un point A vers un point B sans avoir à comprendre comment ça devrait être fait. Moins de questions ils se posent, plus ils s’orienteront facilement et plus ils auront confiance en la compagnie que le site représente. En d’autres termes, moins ils ont besoin de se casser la tête, plus ils seront satisfaits. Ce qui est exactement le but!
4. Efforcez-vous de rendre les fonctionnalités du site facilement visibles.
Les sites web modernes sont souvent critiqués pour leur approche visant à guider les utilisateurs avec des étapes de type 1-2-3, avec de beaux effets visuels, de grands boutons, etc. Mais du point de vue du design, ces éléments ne sont pas de mauvaises choses. Au contraire, ce sont des indications très efficaces puisqu’elles aident les visiteurs à facilement naviguer sur le site.
Dibusoft combine un visuel attrayant et une structure claire. Le site a neuf (9) menus de navigation qui sont visibles dès le premier regard. Par contre, la couleur est un peu trop légère.
Permettre aux utilisateurs de voir clairement les fonctions disponibles est la clé fondamentale pour un design d’interface utilisateur réussi. La façon dont vous allez le faire importe peu. Ce qui est important est que le contenu soit clair et que les visiteurs soient confortable avec la façon dont ils interagissent avec le site.
5. Ecrivez efficacement
Puisque le web est différent des documents imprimés, il est nécessaire d’ajuster le style d’écriture en fonction des préférences et habitudes des utilisateurs. Ils lisent rarement les textes publicitaires. De même pour les longs articles sans images ou sans mots clés marqués en gras ou italique. Ils ignoreront aussi les langages exagérés (difficiles à comprendre, trop verbeux).
Gardez les choses concises. Evitez les mots ‘mignons’, les mots tirés du domaine marketing, les noms spécifiques aux compagnies et les mots techniques non-familiers. Par exemple, si vous décrivez un service et que vous voulez que le client crée un compte, « s’inscrire » est mieux que « commencez maintenant !» qui est lui-même mieux que « explorez nos services ».
Eleven2.com va tout droit au but. Pas de mots mignons, ni des phrases exagérées. Au lieu de cela, juste ce que les visiteurs cherchent : le prix.
Des solutions pour écrire efficacement :
- Utilisez des phrases courtes et concises (allez directement vers le cœur du sujet),
- Utilisez une disposition de page claire (catégorisez le contenu, utilisez différents menus, utilisez des éléments visuels et des listes à puces pour ne pas avoir des paragraphes trop uniformes)
- Utilisez un langage simple et objectif (une promotion ne doit pas avoir l’air d’une publicité. Donnez à vos utilisateurs des raisons raisonnables et objectives pour qu’ils utilisent vos services ou pour qu’ils restent sur votre site web)
6. Cherchez toujours la simplicité
Le principe visant à garder les choses simples, devrait être votre premier but pour le design de votre site. Les utilisateurs vont rarement chez un site pour profiter de son design. D’autre part, dans la plupart des cas, ils cherchent les informations malgré le design (bon ou pas). Essayez de faire un design simple et pas complexe.
Du point de vue d’un visiteur, le meilleur design est un contenu sans publicités ou annonces, un contenu qui correspond à la recherche qu’il a fait. C’est l’une des raisons pour lesquelles une bonne version imprimée de la page est excellente pour satisfaire les utilisateurs.
Finch présente clairement les informations à propos de son site et donne aux visiteurs le choix des options, sans montrer un contenu excessif et inutile.
7. N’ayez pas peur des espaces vides
Il est difficile de croire que les espaces vides (blancs) peuvent avoir un quelconque avantage. Par contre, non seulement ils réduisent l’activité cognitive des visiteurs, mais ils clarifient aussi les informations présentées sur la page. La première chose qu’un visiteur fait en voyant une page, est d’essayer d’avoir une idée globale de la page et de diviser les sections en différentes sources d’informations.
Quant aux structures complexes, elles sont plus difficiles à lire, à percevoir, à analyser et à naviguer. Si vous avez le choix entre séparer les différents segments par une ligne visible ou un espace vide, il a été démontré que l’espace vide est la meilleure solution. Une structure hiérarchique réduit la complexité : plus vous arrivez à donner à vos utilisateurs un sens de hiérarchie visuelle pour votre page, plus il sera facile pour eux de percevoir son contenu.
N’ayez pas peur de ces espaces vides. Par exemple, Cameron.io utilise ces espaces vides comme un élément central de leur design. Ayant comme résultat une disposition claire avec des contenus facilement perceptibles et distinguables.
8. Communiquez efficacement avec un « langage visible»
D’après plusieurs sources parlant de communication visuel efficace, il y a trois choses à faire pour avoir ce qu’on appelle un « langage visible » ou, en d’autres termes, le contenu que les utilisateurs voient sur l’écran.
- Organisez : Fournissez une structure conceptuelle claire et constante. La constance, la disposition de la page, la cohésion et la navigabilité sont des concepts importants de l’organisation. Ces concepts devraient être les règles à appliquer pour chaque élément de la page.
- Economisez : Essayez de faire beaucoup avec le minimum de signes et d’éléments visuels. Les quatres choses majeures à considérer : simplicité, clarté, distinction et accentuation. Simplicité : n’inclure que les éléments qui sont les plus essentiels à la communication. Clarté : tous les composants devraient être publiés, en évitant toute ambiguïté. Distinction : les propriétés des différents éléments devraient être distinctes des uns des autres. Accentuation : les éléments les plus importants devraient être facilement perceptibles
- Communiquez : Faites correspondre la présentation et la capacité de l’utilisateur. Pour pouvoir communiquez efficacement, l’interface utilisateur doit garder une certaine balance en termes de lisibilité, typographie, utilisation de symbole, vue multiple et couleur ou texture. N’utilisez au maximum que 3 polices d’écriture et 3 grandeurs de police (si vous en avez besoin). N’écrivez pas plus de 18 mots ou 50-80 caractères par ligne.
9. Les conventions sont vos amies
Il y a déjà des designs conventionnels à suivre pour certains éléments des sites web, mais cela ne veut pas dire que votre site sera ennuyeux. En fait, les conventions sont très utiles parce qu’elles réduisent les choses qu’on doit apprendre, et on n’a pas besoin de savoir comment certaines choses marchent. Ce serait un cauchemar, par exemple, si chaque site web devait avoir une présentation virtuelle différente pour les fils RSS. Ce n’est pas si différent des principes de bases qu’on suit dans notre vie quotidienne pour classer des dossiers, par exemple, ou pour faire les courses.
Avec les conventions, vous allez gagner la confiance des utilisateurs et prouver votre crédibilité. Agissez en fonction des attentes des utilisateurs, essayez de savoir ce qu’ils attendent de la navigation sur un site, de la structure des textes, de la recherche, etc.
On vous suggère d’innover, seulement quand vous avez vraiment une meilleure idée, sinon prenez avantage des conventions si vous n’en avez pas.
10. Testez très tôt et testez souvent
Ce principe devrait être appliqué à chaque projet lié au design, parce que les tests concernant la facilité d’utilisation révèlent souvent des détails cruciaux. Comme des détails concernant des problèmes considérables ou d’autres problèmes liés à la page.
Ne testez pas trop tard, ne testez pas trop peu de choses et ne testez pas pour les mauvaises raisons. Pour ce dernier, il est important de comprendre que la plupart des décisions concernant le design ne dépendent que de vous. Ça veut dire qu’il n’y a pas une formule universelle pour affirmer qu’un design est meilleur qu’un autre, parce que chaque design doit être analysé et réalisé en fonction de divers facteurs très spécifiques (les exigences locales, partenaires,budget, etc.).
Quelques points importants à garder en tête :
- Tester avec un utilisateur est à 100% mieux que de tester avec aucun, et tester avec un seul utilisateur tôt durant le projet est mieux que de tester avec 50 utilisateurs vers la fin. Selon la première loi de Boehm, les problèmes sont les plus fréquents durant le design et coûtent de plus en plus chers au fur et à mesure qu’on met du temps à les régler.
- Les tests sont des procédures itératives. Cela signifie que vous créez un design,vous le testez, puis vous résolvez ses problèmes, et vous refaites encore et encore ce test. Il se peut que vous n’ayez pas vu un certain problème durant le premier test parce que vous étiez concentrés sur d’autres problèmes.
- Les tests sur le design donnent toujours des résultats utiles. Soit vous allez voir les problèmes du design soit vous allez voir que tout va bien, et dans les deux cas, ça vous donne un aperçu utile pour votre projet.
- Selon la loi de Weinberg, un développeur est mal placé pour tester ses propres codes. Cela s’applique aussi aux designers. Après que vous ayez travaillé sur le site pendant quelques semaines, vous ne pouvez plus l’observer d’un point de vue nouveau. Vous savez comment il est créé et, éventuellement, vous savez exactement comment il marche. Vous avez la connaissance qu’une personne extérieure ou un visiteur du site n’a pas.
Pour résumer : Si vous voulez avoir un excellent site, vous devez le testez.
Auteure des blogs, Aina Strauss préfère penser à « carrière » comme un verbe plutôt qu’un nom. Elle est journaliste indépendant depuis les débuts du Web et écrit sur tout, de l’informatique, de nouvelles technologies au voyage. Son but n’est autre que d’apporter plus d’informations à tous ceux qui souhaitent adopter les nouvelles technologies du Web et de les aider à sélectionner le meilleur hébergement de manière pratique et rentable.
