Share
Des conceptions à couper le souffle et utiles se produisent parce que l'interface utilisateur a été travaillée sans relâche. Il faut un vrai maître d'interface utilisateur pour comprendre comment créer une expérience utilisateur exceptionnelle sur un site Web. Voici 10 principes extrêmement utiles de la part des plus brillants esprits du domaine de l'interface utilisateur..
Les interfaces utilisateur (UI) sont ce qui sépare les sites Web haut de gamme des sites Web de merde. L'absence d'une interface utilisateur utile peut rendre une application Web extrêmement utile inutile. Pourquoi? Parce que l'interface utilisateur n'a pas été pensée et testée de manière approfondie. Si un utilisateur ne peut pas facilement naviguer sur un site Web, il se laissera guider par un autre site similaire offrant une meilleure expérience utilisateur..
Presque tous les développeurs Web ont entendu parler de 37 signaux. Ils sont des défenseurs acharnés des pratiques de développement agiles, mais plus important encore, ils créent des applications Web assez impressionnantes. Tellement génial, en fait, qu'ils sont généralement considérés comme les personnes les plus intelligentes pour ce qui est de se mettre dans la tête de l'utilisateur.
Le PDG de 37 Signals, Jason Fried, est un grand partisan de passer moins de temps sur les détails difficiles et de
des interfaces plus utiles, en pensant à l'utilisateur.
"Il est beaucoup trop question de CSS, de XHTML et de Standards and Accessibility, mais pas assez de personnes. CSS et Standards Compliant Code ne sont que des outils. Vous devez savoir quoi construire avec ces outils. Génial, je suis heureux que votre interface utilisateur ne N'utilisez pas de tables. Alors quoi? Qui s'en soucie encore, laissez les gens atteindre leurs objectifs. Les normes Web sont géniales, mais les normes de chacun incluent les choses à faire (et c'est encore trop difficile à faire en ligne). "
Les concepteurs d'interface utilisateur commettent les mêmes erreurs fondamentales et oublient l'être humain de l'autre côté pour que leur code soit plus esthétique. Les humains, pas les validateurs de code, utilisent des interfaces. "
Lorsque vous travaillez avec des couches de code pendant des semaines, il est parfois difficile de prendre du recul et de vous rappeler que nos sites sont utilisés par des humains, pas par des robots. Cela ne veut pas dire que nous ne devrions pas nous préoccuper des normes. Les normes sont excellentes et devrait être respecté. Nous ne pouvons tout simplement pas supposer que la conformité aux normes est tout ce qui est nécessaire pour créer une bonne interface utilisateur..
Les pages d'erreur sont le genre de choses que la plupart des développeurs Web, y compris moi-même, aiment balayer sous le tapis. C'est un détail infime qui n'affecte qu'une petite fraction des visiteurs de notre site, à droite?
Jakob Nielsen, expert en ergonomie, déclare que 404 pages d'erreur sont peut-être sous un mauvais jour. Peut-être devrions-nous afficher la page d'erreur en tant que outil pédagogique.
La violation des directives la plus courante est lorsqu'un message d'erreur indique simplement que quelque chose ne va pas, sans expliquer pourquoi et comment l'utilisateur peut résoudre le problème. De tels messages laissent les utilisateurs bloqués.
Les messages d'erreur informatifs aident non seulement les utilisateurs à résoudre leurs problèmes actuels, mais ils peuvent également servir de moment d'apprentissage. En règle générale, les utilisateurs ne consacrent pas leur temps à la lecture et à l'apprentissage des fonctionnalités, mais ils passent le temps nécessaire pour comprendre une situation d'erreur si vous l'expliquez clairement, car ils souhaitent surmonter l'erreur..
Jeffrey Zeldman est le fondateur de la société de conception Web Happy Cog, un auteur, et a également lancé A List Apart, une formidable ressource pour les développeurs Web. Si quelqu'un sait comment créer une interface utilisateur appropriée, c'est bien Zeldman..
Jeffrey fait remarquer que, dans le développement Web, le code néglige beaucoup l’absence de définition d’une couleur de fond..
Le nombre de concepteurs Web oubliant de spécifier une couleur d'arrière-plan sur leur site est stupéfiant. Ils passeront des mois à réitérer des structures filaires et à concevoir des compositions; écrire des hacks CSS pour les navigateurs antérieurs à ce siècle; testez leur travail sur tout, des Blackberry aux vieux Mac exécutant System 7; et bien sûr, ils valideront leur balisage et leurs feuilles de style. Mais après tout, ils oublieront d’appliquer une couleur de fond à leur site et ne penseront pas à la vérifier..
L'accessibilité est un élément fantastique pour les développeurs lors de la création d'une application Web. Cependant, il semble que nous puissions parfois nous laisser aller à rendre nos sites et formulaires accessibles. Le gourou de la conception, Roger Johansson, souligne qu'une accessibilité excessive peut parfois être coûteuse pour nos interfaces utilisateur..
Parfois, lorsque les gens découvrent l’accessibilité Web pour la première fois, ils recherchent des moyens rapides d’améliorer les sites qu’ils construisent. Cela conduit souvent à une mauvaise utilisation ou à une surutilisation de certaines fonctionnalités HTML destinées à faciliter l'accessibilité, mais si elles sont mal utilisées, elles n'ont aucun effet et peuvent même avoir l'effet inverse en rendant la page moins accessible et moins utilisable..
La plupart des fonctionnalités d'accessibilité mal utilisées sont des attributs HTML. J’ai le sentiment qu’ils sont utilisés de manière abusive soit par des développeurs mal intentionnés mais ne comprenant pas tout à fait l’utilité des attributs pour les utilisateurs finaux, soit par des développeurs qui les ajoutent simplement pour pouvoir cocher "Accessibilité" dans leur liste de tâches et les fermer. leur manager, client ou quiconque les harcelant pour rendre le site plus accessible.
M. Fried de 37 Signals fait une autre apparition sur notre liste, grâce à son excellent conseil sur la manière de s'assurer que l'aspect le plus important de la conception est toujours conçu en premier. Il a inventé cette méthode sous le nom de «Conception de l'épicentre».
Epicenter Design implique de se concentrer sur la véritable essence de la page (l '«Epicentre»), puis de la construire vers l'extérieur. Cela signifie ne pas commencer par la navigation / les onglets, ni le pied de page, ni les couleurs, ni la barre latérale, ni le logo, etc. Cela signifie en commençant par la partie de la page qui, si elle était modifiée ou supprimée, changerait tout le but de la page. C'est l'épicentre.
L’utilisation de la méthode Epicenter Design permet de centrer notre interface utilisateur sur notre site et de nous assurer que nous ne manquons pas de contenu..
Collis Ta'eed, le propre réseau de NETTUTS, propose un excellent conseil aux développeurs Web du monde entier: utilisez les tests utilisateur. Lorsque vous passez d'innombrables heures à regarder le même design sur votre moniteur, il est parfois facile d'oublier comment l'utilisateur peut utiliser le site Web. En fait, l'utilisateur moyen pourrait utiliser votre application de manière très différente de ce que l'on pourrait imaginer.
La première chose que vous devez savoir, c’est que, lorsque vous effectuez des tests d’utilisateur, vous devenez un meilleur concepteur de sites Web. Vous verrez exactement comment les gens utilisent vos conceptions Web et vous serez surpris de la façon dont ils le font. Les choses que vous pensez évidentes ne le sont souvent pas, le texte que vous pensiez expliquer, quelque chose n'est même pas lu, et les utilisateurs font en général des choses qu'ils n'étaient pas censés faire. Même si le seul utilisateur que vous testez est de demander à des amis d'utiliser un site pendant que vous les observez, vous serez déjà mieux, peu importe le projet lui-même..
Savoir comment les utilisateurs interagissent et utilisent votre site Web est une information extrêmement précieuse. S'il est utilisé correctement, il peut considérablement modifier votre interface utilisateur pour qu'elle soit mieux adaptée à vos utilisateurs..
Ce qui peut sembler une idée idiote, il est facile d’oublier que les utilisateurs du site ont besoin d’incitations pour remplir des formulaires comme pour interagir sur votre site Web. Personne ne comprend cela mieux qu'un spécialiste du marketing Internet performant. Jim Kukral fait remarquer que pour avoir une interface utilisateur réussie, les utilisateurs doivent en tirer parti pour remplir des éléments tels que des commentaires ou des formulaires d'inscription..
L'utilisateur doit sentir que la valeur ou le résultat l'emporte sur le coût (ou le temps) de devoir remplir le formulaire. Par conséquent, sauf si vous fournissez aux utilisateurs quelque chose de valeur en retour, les chances que l'utilisateur termine la tâche diminuent..
Les incitations peuvent être ce que vous êtes disposé à offrir. Voici des exemples d'incitations possibles:
- Donner un certificat-cadeau pour certains de vos produits en échange des informations de contact de l'utilisateur.
- Donner à l'utilisateur une chance de participer à un tirage au sort ou à un autre type de concours.
- Proposez un téléchargement gratuit de contenu spécialisé ou d'informations pertinentes pour votre entreprise..
Jakob Nielsen effectue des recherches sur les utilisateurs Web depuis plus de dix ans. Il a fourni d'innombrables conseils sur la création d'une interface utilisateur plus conviviale, mais l'un de ses meilleurs conseils est de préserver la cohérence des éléments de conception..
La cohérence est l’un des principes d’utilisation les plus puissants: lorsque les choses se comportent toujours de la même façon, les utilisateurs n’ont pas à s’inquiéter de ce qui va se passer. Au lieu de cela, ils savent ce qui se passera d'après l'expérience antérieure. Chaque fois que vous relâchez une pomme sur Sir Isaac Newton, elle tombe sur sa tête. C'est bon.
Plus les attentes des utilisateurs sont bonnes, plus ils se sentiront maîtres du système et plus ils l'aimeront. Et plus le système répond aux attentes des utilisateurs, plus ils ne se sentiront pas en sécurité. Oups, peut-être que si je lâche cette pomme, elle se transformera en tomate et bondira d'un mille dans le ciel.
Il est bien trop facile de déposer quelques mots à la mode ou une pincée de jargon dans votre copie d’UI. Pourquoi? Parce que nous savoir ce que ce morceau de jargon signifie. Toutefois, nous pouvons aliéner l’utilisateur moyen en utilisant des termes qu’il ne connaît peut-être pas. La stratège web Erin Kissane nous conseille de garder le jargon au minimum pour cette raison même.
Il y a un temps pour le jargon professionnel: lorsque vous savez que vous vous adressez à un public qui vous comprend, vous avez besoin de la spécificité et de la précision supplémentaires que peut offrir le jargon. Si vous l'utilisez en dehors de cette situation, vous ne communiquez probablement pas clairement, honnêtement ou efficacement..
Le jargon n'est pas vraiment le problème ici, cependant. Le problème avec la copie sur cette page - et tant d’autres qui font la promotion de produits d’information - est qu’il ne dit rien. Un jargon mal placé, des mots à la mode et d'autres types de duvet se précipitent car le manque de signification transposable crée un vide.
Lorsqu’il s’agit de construire notre interface utilisateur, de nombreux développeurs commencent par une structure filaire de ce à quoi le site ressemblera. Toutefois, comme les applications Internet riches (RIA) gérées par Ajax deviennent de plus en plus courantes, il n’a pas de sens de créer un site Web dynamique et en mouvement avec une simple structure filaire. Parfois, il est juste plus efficace de construire un prototype.
David Verba, CTO d'Adaptive Path, soutient que le cadre filaire n'est peut-être pas la meilleure solution pour la conception d'interfaces utilisateur, car il ne coupe pas la moutarde pour étoffer réellement une application complexe..
Le prototypage nous permet de voir les problèmes plus clairement - et souvent plus tôt - dans le processus de conception et de développement. Au-delà des sites de contenu d'entreprise et dans des applications dotées de fonctionnalités riches et complexes, nous ne sommes plus en mesure de nous asseoir au début du projet et de prévoir les interactions et les problèmes potentiels. Le problème est tout simplement trop complexe. C'est la raison pour laquelle nous avons commencé à utiliser des structures filaires en premier lieu. Souvent, le seul moyen de vraiment comprendre où les problèmes vont se poser ou de trouver des solutions potentielles est de les esquisser. Nous utilisons des structures filaires pour esquisser le contenu et la mise en page, mais à mesure que nous passons à des interfaces plus interactives, les structures filaires ne sont plus aussi efficaces. Nous devons dessiner avec des fonctionnalités réelles - esquisser dans le code, pour ainsi dire - afin de voir comment l'application se comportera réellement..
Glen Stansberry est un développeur et blogueur Web qui a eu beaucoup de difficultés à admettre avec CSS. Vous pouvez lire plus de conseils sur le développement Web sur son blog Web Jackalope.
Accentsconagua