taux de transformation

3 choses à faire pour votre baseline

La baseline d’un site est le slogan qui se trouve généralement en dessous du logo.

Tout d’abord, est-ce que vous avez besoin d’un baseline ? Quel que soit votre site, la réponse est : OUI.

Pour être plus précis, tant que chaque nouveau visiteur ne sait pas ce que votre site fait avant d’y aller, vous avez besoin d’une baseline. Les seuls sites qui n’en ont pas besoin seront les sites tels que Google, Amazon ou Wikipedia. Quoi que, même pour ceux là, Steve Krug argue qu’ils pourraient bénéficier d’une baseline.

En effet, pour tous les sites, en un coup d’oeil, l’internaute décide si oui ou non votre site correspond au service qu’il recherche. Et en un coup d’oeil, il décide ou non d’y rester plus longtemps. Le taux de rebond d’un site, qui mesure la proportion de visiteurs qui quittent quasi-immédiatement un site, est toujours au dessus de 50%, quel que soit le site. Cela peut sembler anodin : vous n’avez que peu d’intérêt à ce qu’un visiteur qui recherche un autre service reste sur votre site. Mais attention, ce que ça signifie avant tout, c’est qu’il y a une forte proportion de visiteurs qui quitte le site parce qu’au premier abord, il semble ne pas répondre à leurs recherches.

C’est là que la baseline intervient. Les études d’eye tracking montrent que le parcours naturel est un parcours en F : d’abord en haut à droite, puis vers la droite, puis cette opération se répète en descendant.

Le logo et la baseline sont donc naturellement les éléments les plus vus d’un site, et c’est à eux qu’il appartient de retenir le visiteur – au moins jusqu’au prochain élément qui confirmera la première impression.

Pour écrire votre baseline, 3 règles à suivre :

Soyez clairs

La baseline décrit votre service. Pas besoin d’un grand sens de la métaphore. Avant tout, cette phrase/expression doit permettre d’expliquer d’un coup ce que vous faites. Ne forcez pas l’utilisateur à chercher un sens caché

Soyez concis

La baseline se voit d’un coup d’oeil. L’utilisateur ne s’y attardera pas, qu’elle soit longue ou courte. Autant lui permettre de voir tout le message !

Soyez lisibles

Trop petite, ou avec une police mal choisie, elle ne sera tout simplement pas lue. La lecture doit être facile, sans obstacle.

Posté le par Yannick d'Appili dans Ergonomie des sites web 5 commentaires

Les 3 points importants du Wording sur vos sites web

Le wording, c’est l’ensemble de termes et formulations qui seront utilisés sur un site. C’est notamment ce qui va déterminer le texte des liens  et boutons.

Le wording est un des aspects les plus importants de l’ergonomie, mais aussi l’un des plus facilement oublié. Il est vrai qu’on se concentre beaucoup plus facilement sur le design, le point le plus « sexy » d’un site web, et que les formulations proposées par le designer sont souvent reprises sans se poser de question. Les « lorem ipsum » sont géré plus tard par le webmaster, et voilà.

C’est bien sûr une erreur. Le wording est fondamental car c’est par les mots écrits que le message du site web passe. Bien sûr, choisir la bonne couleur et la bonne icône pour un lien ou un bouton, cela aide à la compréhension. Mais c’est avant tout le texte qui permet à l’utilisateur d’être sûr qu’il entreprend la bonne action.

Le wording devrait donc être réfléchit parallèlement au reste de l’ergonomie, et être vu comme une action à part entière dans la création d’un site web. Comment obtenir le wording le plus ergonomique ?

Soyez concis, mais explicite

Un trop gros bloc de texte est facilement sauté. Pour les informations les plus importantes, les actions les plus rentables, c’est un risque qu’on ne peut pas prendre. Pour éviter cela, il est important de rester concis. « Témoignages » voire « Témoignages client » sera plus intéressant que « Ce que disent de nous nos client ».

Attention à rester explicite. L’utilisateur doit avant tout savoir à quoi s’attendre en entreprenant une action.

Soyez en adéquation avec le reste du site

Les mots doivent convenir au public visés. Sur un site parlant au jeunes, mieux vaut tutoyer l’utilisateur par exemple. Sur un site technique, il ne faut pas hésiter à utiliser du vocabulaire poussée.

Le wording doit aussi convenir au design du site : certains mots familiers sont à éviter si le design projette une image de luxe, et inversement, si l’on veut avoir l’air pas cher, des mots d’un registre trop élevé auront un mauvais résultat.

Soyez consistant à travers tout le site

Surtout, sur l’ensemble du site, les mêmes actions doivent avoir la même formulation,  et les mêmes formulations doivent donner les mêmes actions. Si à un endroit du site, le bouton du moteur de recherche est « Rechercher » et à un autre « Trouver des produits », l’utilisateur est en droit de se demander si cela revient au même. Dans les cas extrèmes, on court alors le risque que l’utilisateur soit confus et reviennent en arrière, voir ait l’impression de ne pas avancer vers son objectif et abandonne.

Le site doit aussi être consistant avec les habitudes générales sur internet : « Mon compte » est la formulation la plus courante pour l’accès d’un utilisateur à ses propres pages ou informations. Il vaut mieux éviter d’autres formulations du genre : « Mon espace », « Mon projet », etc.

Posté le par Yannick d'Appili dans Ergonomie des sites web 3 commentaires

Les 3 étapes de rédaction d’un scénario de tests utilisateurs

Vous vous êtes enfin décidé à vous lancer dans une série de tests utilisateurs. Cependant vous vous doutez, que la qualité de rédaction de vos tests aura une forte influence sur les résultats que vous allez obtenir. Il convient donc de se demander sous quelle angle vous aller demander à vos utilisateurs de réaliser vos tests afin d’optimiser vos résultats.

scénario test utilisateur

Appili vous fourni un mini-guide en 3 étapes pour que vous vous posiez les bonnes questions et que vos tests utilisateurs soient un succès.
 

Première étape : identifiez le contexte d’utilisation de vos tests utilisateurs

 
Avant de démarrer un test utilisateur, il faut que vous déterminiez la manière dont les utilisateurs vont trouver votre site :

  • - Pour un site déjà en ligne, grâce à vos outils analytiques vous savez comment il vont généralement atteindre votre site et depuis quelle type de page
  • - Pour un site pour lequel vous avez déjà défini une stratégie pour attirer vos clients, la landing page est un excellent point de départ
  • - Pour un site en développement, une estimation de la page appropriée suffira

Ces informations vous permettront de donner un point de départ et un contexte d’utilisation aux testeurs. Par exemple, pour le site CDiscount.com :

Page de départ : http://www.cdiscount.com/informatique/achat-pc-ordinateur/v-10708-10708.html (résultat de la recherche « acheter un ordinateur pas cher »)

Exemple de contexte préconisé : Vous cherchez à acheter un ordinateur. Vous disposez pour cela d’un budget de 600 Euros.
 

Deuxième étape : identifiez les points primordiaux à faire tester

 
Il s’agit de définir les actions que vous souhaitez que vos utilisateurs entreprennent sur votre site. En conservant le même exemple, la priorité ira au processus de vente car c’est le point critique d’un site e-commerce. Pour CDiscount, on peut imaginer 3 points à travailler en priorité :

  • - L’impression générale que donne le site
  • - La facilité à trouver un produit spécifique (recherche, comparateur, etc.)
  • - Le tunnel de conversion

Pour une application métier où l’on cherche à améliorer la productivité des utilisateurs à l’aide de tests utilisateurs, les actions les plus courantes seront les plus importantes à faire tester.

Quand on a déjà une idée des problèmes qui sont rencontrés (grâce à des donnés analytiques par exemple), les tests utilisateurs permettent ainsi de confirmer vos hypothèses ou bien de les infirmer.
 

Troisième étape : rédigez les tâches de vos tests utilisateurs

 
Une fois les points principaux définis, il ne reste plus qu’à écrire les tâches de vos tests. Il est important de rester explicite et succint, afin de ne pas être trop directif avec vos utilisateurs.

Evitez : En utilisant le comparateur et le moteur de recherche, essayez de trouver l’ordinateur de votre choix

Préférez : Trouvez l’ordinateur qui vous convient

Pour CDiscount, voici les 3 tâches qui pourraient être à préconiser:

  • - Décrivez le site et l’impression qu’il vous donne
  • - Trouvez l’ordinateur qui vous convient
  • - Achetez cet ordinateur (arrêtez vous avant de valider le processus d’achat)
Posté le par Yannick d'Appili dans Tests utilisateurs 1 commentaire

Comment créer des formulaires Web ergonomiques ?

Que ce soit pour s’enregistrer sur un site ou finaliser un processus d’achat, le formulaire est omniprésent sur le Web et est souvent considéré à raison comme un levier pour améliorer son tunnel de conversion.

Formulaires Web ergonomiques

Appili profite d’un article complet publié par Smashing Magazine pour refaire le point.

Le formulaire comme point d’entrée de la relation avec votre utilisateur

Le formulaire est un moyen d’établir une relation privilégiée entre l’utilisateur et une organisation. Lorsque c’est mal fait, cela peut mettre fin à cette relation.
- Commet dans toute relation, établir la confiance de l’utilisateur est primordiale, cette confiance peut-être gagnée par la formulation, l’utilisation de couleur ou la typographie
- Donnez comme titre au formulaire son but intrinsèque, ce qui indiquera à vos utilisateurs la raison du formulaire et pourquoi ils doivent le remplir
- Demandez-vous si les questions que vous posez ont du sens et s’il elles sont formulées au bon moment, pour cela bien sûr vous devez connaître vos utilisateurs
- Comme vous le feriez avec une personne, utilisez un langage approprié en fonction de vos utilisateurs et évitez tout le superflu
- N’apportez pas un soudain changement d’apparence lors des différentes étapes de votre formulaire, vous vous devez d’être constant

Le formulaire conçu comme un échange

Le formulaire est un échange entre vous et votre utilisateur, l’utilisateur utilisant le formulaire pour rentrer en communication avec votre organisation.
- Ordonnez de manière logique vos étapes comme vous le feriez pour une conversation
- Comme dans une conversation, si les questions sont posées de manières directives, elles pousseront vos utilisateurs à vous dire ce que vous voulez entendre plutôt que ce qu’ils pensent
- Lors d’un échange à l’oral vous ponctuez naturellement vos phrases par des silences pour mieux vous faire comprendre. Une pause (indiquée par un espace blanc en l’occurrence) montrera, dans le cas d’un formulaire, à vos utilisateurs l’enchaînement logique de vos parties
- Lors d’une conversation il est aisé de se laisser distraire par des bruits sonores. De même, pour un formulaire, supprimez tout ce qui parasiter visuellement l’attention de votre utilisateur (comme des bannières par exemple)

Les différents éléments d’un formulaire

Intitulés

- Optez pour un mot plutôt qu’une phrase à la condition bien sûr que toute ambiguïté soit levée
- Evitez d’utiliser des majuscules sur l’ensemble de vos intitulés, le style phrase est souvent à préférer : « Prénom et nom » plutôt que « Prénom et Nom »
- Contrairement à la croyance populaire, placez l’intitulé au dessus du champ n’est pas la meilleure solution, à part si vous voulez délibérément ralentir votre utilisateur.

Champs à saisir

- Il n’y a pas de restriction aux types de champs de saisi, ils peuvent être variés comme de la saisie libre ou des cases à cocher
- Si vous souhaitez restreindre les champs de saisi, faites le d’une manière qui n’irrite pas vos utilisateurs. Par exemple, au lieu d’imposer de remplir un champ du type JJ/MM/AAAA utilisez plutôt 3 menus déroulants ou même mieux un calendrier
- Indiquez clairement quels sont les champs qui sont obligatoires, un symbole clair comme un astérisque (*) suffira à l’indiquer à vos utilisateurs

Actions

-Distinguez les actions primaires des actions secondaires. Les actions primaires sont des boutons et des liens qui enclenchent la finalité des formulaires tels que « Sauver » ou « Envoyer ». Les actions secondaires permettent à l’utilisateur de retirer des données tel que « Annuler ». Il est important de donner moins de poids visuel sur les actions secondaires.
-De même, personnalisez les textes de vos boutons est préférable à utiliser des termes génériques tel que « envoyer ».

Aides

- N’utilisez des textes explicatifs que lorsque c’est strictement nécessaire à la compréhension de votre formulaire.
- Plutôt que de mettre un texte explicatif sur le côté de votre intitulé, préférez l’utilisation d’un système d’aide dynamique, qui apparaît lorsque l’utilisateur clique sur le champ texte.

Messages

- Les messages d’erreurs doivent être utilisés en amont pour éviter à vos utilisateurs de continuer le formulaire et de se rendre compte d’une erreur de saisie qu’en fin de formulaire. Utilisez du rouge et des icônes familières.
- Les messages de succès doivent être utilisés lorsque le formulaire est long afin d’encourager vos utilisateurs à la complétion du formulaire.

Source
Smashingmagazine.com

Posté le par Florian d'Appili dans Ergonomie des sites web 2 commentaires

3 outils ergonomiques en ligne pour améliorer votre taux de conversion

Appili avait déjà mentionné les outils les plus populaires de tests utilisateurs en ligne dans un article paru précédemment; Rebelote donc, mais en élargissant la gamme en vous proposant des outils plus divers qui ont récemment retenu notre attention.

3 outils ergonomiques en ligne pour améliorer votre taux de conversion

En avant la musique pour la présentation de 3 outils ergonomiques pertinents avec comme objectif final de booster votre taux de conversion.

GazeHawk

GazeHawk permet de mettre en place des études d’eye-tracking à bas prix sur vos designs ou sites Web. Le principe de l’eye-tracking étant d’indiquer où vos utilisateurs posent leurs regards sur une image et/ou un site, ce qui vous indique les changements conduisant à une amélioration de votre taux de conversion.

GazeHawk

Vous fournissez l’url ou l’image à tester, Gazehawk s’occupe de trouver les testeurs et de vous renvoyer vos résultats sous forme de dashboard pour environ 50 dollars par participant et avec des délais d’environ 1 semaine.

GazeHawk a fait un réel buzz en tant que « la » start-up à suivre aux US, le succès de cet outil ergonomique repose cependant sur la capacité de sa technologie propriétaire à réellement fournir des résultats cohérents d’eye-tracking à partir d’une simple webcam… A suivre de très près donc.

Ethnio

Ethnio est un outil ergonomique qui permet de recruter des participants de recherche directement à partir de votre site Web. Au travers d’une interface très user-friendly, vous pouvez afficher un bandeau invitant vos utilisateurs à participer à une étude de recherche concernant votre site.

Ethnio

Une fois qu’ils ont cliqué sur le bandeau, vos utilisateurs répondent à un questionnaire qui vous permet de sélectionner les participants qui correspondent aux critères que vous désirez, pour cela vous pouvez mettre des incitatifs tel que des coupons Amazon. Vous obtiendrez des rapports détaillés sur les personnes qui répondent à vos efforts de recrutement. A noter que l’outil est gratuit dans la limite de 250 réponses et pour moins de 10000 pages vues.

Une fois recruté, il ne tient qu’à vous de les recontacter pour des études de tests utilisateurs, de focus group ou toute autre discussion que vous souhaiteriez réaliser. Ethnio permet aussi de relier facilement cet outil de recherche de participants à d’autres outils tels qu’Usabilla, Chalkmark et UserTesting. Il fonctionne même avec GoToMeeting pour la mise en place de partage d’écran.

FiveSecondTest

FiveSecondTest vous permet de comprendre la première impression de vos utilisateurs dès la phase de conception/design.

FiveSecondTest

FiveSecondTest vous aide à mieux concevoir vos pages d’atterrissage et vos « Calls to Action » en vous assurant que votre message est communiqué aussi efficacement que possible. Il suffit de télécharger une copie d’écran ou une maquette, sélectionner jusqu’à 5 réponses par test, et puis attendre que les utilisateurs effectuent les tests. Cet outil ergonomique propose de plus un pricing très léger avec environ 250 réponses pour environ 50 dollars.

FiveSecondTest recueille les réponses pour vous et les regroupe sous forme de mots-clés communs, qui sont représentés visuellement sous forme de nuages de tag. La mise en place est simple, les résultats arrivent rapidement, le service est peu cher et au final redoutablement efficace… Que demande le peuple ?

Source
Comprehensive Review Of Usability And User Experience Testing Tools

Posté le par Florian d'Appili dans Ergonomie des sites web 2 commentaires

La valeur ajoutée d’une vidéo

De plus en plus, les pages d’accueil et les pages de landing se trouvent agrémentés d’une vidéo. Parfois, il s’agit d’une vidéo « d’introduction », qui « met dans l’ambiance du site », comme on peut le voir sur le site de Cartier : http://www.cartier.fr/. Parfois, il s’agit d’une vidéo de présentation, comme sur la page d’accueil du système de gestion de bug FogBugz : http://www.fogcreek.com/fogbugz/.

Le but de ces vidéos change suivant les sites : présenter, vendre, agrémenter… La durée change également : de quelques minutes pour Dropbox à plus d’une heure pour FogBugz. Suivant les cas, elle se lance de manière automatique ou se lance suite à un clic de l’utilisateur. Elle peut être en plein écran, s’insérer dans le site ou s’ouvrir dans une popin.

Alors, est-ce qu’une vidéo est appropriée sur votre page d’accueil ? Et si oui, de quel type de vidéo doit-il s’agir ?

Malheureusement, pas de réponse toute faite… Ca dépend. Quelques points à prendre en compte cependant.

Une vidéo, cela demande un certain engagement de la part de l’internaute : il faut y focaliser son attention pendant de longues minutes. Impossible de faire autre chose pendant ce temps… Il est très courant que l’utilisateur quitte la vidéo pendant son déroulement. Aussi, une vidéo courte peut avoir du sens. Ceci dit, ce n’est pas un règle universelle. Si FogBugz a mis une vidéo aussi longue, c’est suite à une série de tests A/B qui ont révelé que plus la vidéo était longue, plus le taux de conversion s’améliorait.

Il faut par contre absolument éviter un long temps de chargement au départ : les utilisateurs sont habitués au vidéos démarrant immédiatement ; une attente au début en fera fuir un grand nombre.

Pour savoir comment placer la vidéo, si elle doit démarrer immédiatement, le mieux est de prévoir des tests utilisateur, voire idéalement des tests utilisateurs croisés : difficile de prévoir ce qui rebutera les utilisateurs, et cela dépendra grandement de l’agencement de votre site.

Evitez par contre les vidéo d’intro qui ne peuvent pas être sautées : si l’utilisateur ne peut accéder rapidement à ce qu’il cherche, le choix de fermer l’onglet s’imposera de lui même.

Dernier point : est-ce qu’une vidéo est un vrai plus ? La question est primordiale, surtout quand on voit l’investissement que cela peut représenter. Sur ce point, s’il est impossible de prévoir le résultat exact, la réponse semble tendre vers « oui ». Empiriquement, de plus en plus de sites utilisent des vidéos de vente (Dropbox, AirBnB, Unbounce ou encore 99designs). Il s’agit notamment de sites ayant un beau succès dans leur domaine, et le fait qu’ils gardent ces vidéos tend à dire qu’il y a un effet bénéfique. Plus concrètement, c’est aussi un moyen de s’approcher de l’utilisateur et de se présenter de manière contrôlé : plutôt que de risque un utilisateur qui ne comprend pas, on présente et explique les choses. Attention cependant, cela peut ne pas être approprié pour votre site : un site eCommerce gagnera plus a avoir une présentation claire de ses produits et ses prix qu’à avoir une vidéo d’accueil.

Posté le par Yannick d'Appili dans Ergonomie des sites web Commenter

Optimisation de site, design ergonomique et test utilisateur : l’interview de Lance Loveday

Dans cette interview, Lance Loveday (CEO de Closed Loop Marketing et co-auteur de « Web Design for ROI ») donne son point de vu pertinent sur les sujets qui le passionnent : optimisation de site, design ergonomique et test utilisateur.

Appili sélectionne pour vous les passages les plus intéressants de cette interview réalisée originalement par usertesting.com (leader sur le test utilisateur en ligne sur le marché anglo-saxon).

Usertesting.com – Est-il plus facile d’optimiser un site existant ou de repartir de zéro?

Lance Loveday – Le dernier. Notre slogan officieux: «Nous ne faisons pas des sites Web. Nous faisons des meilleurs sites. « 

Usertesting.com – A quel point le design affecte le succès d’un site web?

Lance Loveday – Si le design englobe les propriétés liées à l’utilisation de la couleur, la disposition et l’espace, alors il contribue à la première impression de l’utilisateur et joue un grand rôle dans la crédibilité et l’expérience globale des utilisateurs.

Mais vous pouvez avoir du succès avec un design «laid» en ayant un site qui est très clair, intuitif et fonctionnel.

Le design est important mais n’est pas en soi le facteur qui détermine le succès. Vous devez avoir tous les éléments travaillant de concert pour obtenir une expérience utilisateur exceptionnelle.

Usertesting.com – Avec un site ayant un design mal conçu mais qui marche bien, peut-on améliorer le design sans affecté négativement le site ?

Lance Loveday – Nous avons vu des exmples où le design et les améliorations esthétiques ont réellement nui au taux de conversion, en particulier lorsque vous avez une base d’utilisateurs larges et fidèles. Les gens sont habitués à un certain ton visuel; ce qui peut être une marque de fabrique. Y apporter des modifications l’est à vos risques et périls.

Est-il juste que les gens détestent le changement

Usertesting.com – Est-il juste que les gens détestent le changement?

Lance Loveday – Les gens détestent le changement quand ils inhibent leurs capacités à faire ce qu’ils font normalement sur un site. Si vous rendez plus difficile la navigation dans un contenu pour lequel ils ont des habitudes, ils peuvent vous le faire payer.

Usertesting.com – Quelles sont les erreurs les plus communes que vous voyez dans les sites Web?

Lance Loveday – Un manque de hiérarchie visuelle, qui doit permettre à des gens de visualiser et d’obtenir rapidement l’idée d’une page ou d’un site, avant même d’avoir commencé à lire des phrases complètes.

Tout d’abord, les gens n’aiment pas lire : ils n’ont pas un comportement de recherche. Il est important pour les entreprises de garder cela en tête. Par exemple, en augmentant la taille du titre ou le personnaliser pour parler à l’intention de l’utilisateur (en fonction de ce que nous savons à son sujet).

Lorsque les utilisateurs proviennent de campagnes de search marketing, nous savons déjà quels mots clés ils ont cliqué. Il est donc facile pour nous de concevoir le contenu en rassurant l’utilisateur qu’il est au bon endroit.

Usertesting.com – Sur quels éléments vous concentrez-vous lorsque vous évaluez un site pour la première fois?

Lance Loveday – Nous regardons les éléments qui sautent aux yeux d’un point de vue quantitatif et cherchons ensuite au niveau de l’interface quel en est la raison. La démarche est souvent de type exploratoire : pourquoi cette page a autant de trafic ? Pourquoi le taux de sortie est si élevé à cet endroit ? C’est un exercice alternant l’hémisphère gauche et l’hémisphère droit du cerveau.

usertesting.com

Usertesting.com – Comment Usertesting.com aide votre entreprise?

Lance Loveday – Nous pouvons déployer des tests et obtenir des commentaires en quelques heures et pour des montants peu élevés.

D’un point de vue d’agence, la crédibilité que les vidéos nous donnent lors de la présentation d’information aux clients est très importante. Nous mettons en avant des problèmes conséquents, qui retiennent l’attention de la direction.

Usertesting.com – Quelle est votre réflexion sur le test utilisateur ?

Lance Loveday – Mon espoir est que plus de directions prennent conscience de l’importance du test utilisateur.

Malheureusement, certaines entreprises traitent le test utilisateur comme une check-list, en gros pour se rassurer qu’ils l’ont fait mais pas nécessairement en l’intégrant à leurs stratégies.

Source :
usertesting.com/blog/

Posté le par Florian d'Appili dans Interview 1 commentaire

Expérience utilisateur et vitesse : dopez votre ergonomie au speed

En guide d’introduction, on a décidé d’être un peu faignant et de s’appuyer sur une vidéo bien sympa de Google. A fond donc les bobines pour Google Chrome.

Poussons encore plus loin dans la faignantise et reposons nous sur quelques chiffres :
- 1 seconde de délai réduit le taux de conversion de 7% et la satisfaction client de 16%
- Un délai supplémentaire d’une demi-seconde réduit le traffic de Google de 20%
- 100 millisecondes de délai réduisent le chiffre d’affaire d’Amazon de 1%

Donc la vitesse c’est bien, mais comment je fais pour l’améliorer ?

Non seulement la vitesse améliore l’expérience utilisateur (pas juste pour les possesseurs d’un PC 256 couleurs) mais en plus la vitesse participe activement à votre SEO- en tout cas c’est bien le mot que fait passé Google.

Plus important encore… La vitesse est certainement un des points les plus faciles à améliorer dans l’ergonomie de votre site : gardez l’existant et accélérez-le ! Ahhhh s’exclame votre client en pensant à son retour sur investissement.

Commençons par le plus évident : le temps de chargement- beaucoup d’actions à mettre en place de ce côté :
- le temps d’exécution du script côté serveur
- le poids de la page
- le nombre de fichiers

Améliorez la vitesse de votre site, améliorez l'expérience utilisateur

On ne cite que les principaux, pour une liste exhaustive le mieux est d’installer Yslow et Google PageSpeed et de traiter un par un les points cités par ces plugins.

Allons plus loin avec un oubli fréquent : le temps d’exécution coté client. Les programmes Javascript embarqués peuvent être très lourds et effectuer des action extrêmement complexes. Il ne faut pas non plus oublier qu’il y a des limites coté client, et surtout que tous les navigateurs ne sont pas au même niveau.

Enfin, le rendu de la page par le navigateur peut prendre un certain temps pour des pages lourdes. C’est un point auquel Google s’est fortement attaqué, en développant un module Apache qui permet d’optimiser les pages en mettant en place un moteur de rendu extrêmement efficace (cf. la pub Chrome en introduction)

Maintenant je sais quoi améliorer, mais jusqu’à quel point ?

En effet, améliorer la vitesse c’est bien pour l’ergonomie. Il faut cependant savoir jusqu’où aller. Quelles sont donc les durée « acceptables » ?

Vitesse limite pour l'ergomie d'un site Web

Pour y voir plus clair, quelques métriques à avoir en tête :
- La page doit charger en moins de 20 secondes (trop facile me direz vous !) avec l’essentiel de la page chargé en moins de 2 secondes (au delà de cette durée, l’utilisateur a une facheuse tendance à quitter la page)
- En dessous de 100 millisecondes, le ralentissement est indétectable

Ce dernier point est principalement utile pour les interactions devant apparaître instantanément : tout ce qui modifie la page ou qui calcule sans la charge. Pour les chargements « partiels » (Ajax), mettre un indicateur pour indiquer que quelque chose est en cours est plus que conseillé (ajaxload.info.)

Sources
websiteoptimization.com
searchenginewatch.com
stackoverflow.com

Posté le par Yannick d'Appili dans Expérience utilisateur 1 commentaire

5 conseils pour cesser de haïr votre designer (comment obtenir un design ergonomique ?)

Votre site Web a de mauvais taux de conversion et le design ergonomique escompté n’est pas au rendez-vous ; c’est bien sûr la faute de votre designer- en tout cas c’est ce que vos amis du marketing vous disent. Ils ne cessent de mentionner que les designers font des choses déraisonnables, comme mettre tous vos textes sous formes d’images ou (pire) développer tout votre site en flash.

Design ergonomique

Et en effet, votre dernière relation avec votre ancien designer vous a laissé un goût amer… Vous traitez de tous les noms cet « artiste » à qui vous avez tant donné pour vous retrouver désormais tout seul avec, à votre charge, un site Web qui ne transforme pas.

Ne désespérez pas, l’amour est sans doute au coin de la rue… Quelques conseils pour remonter la pente et vos taux de conversion au passage.

Trouvez le partenaire idéal

De la même façon que vous appréciez que votre chauffeur de bus ne prenne pas les sens interdits à 200 Km/h, le bon designer est celui qui suit les bonnes pratiques du Web.

Trouvez le designer idéalVoici quelques règles (et il y a en pas mal) que votre designer doit prendre en compte :
- Si vous optez pour un framework pas très ouvert aux excentricités les plus folles (Magento en étant le parfait exemple), le design aura de très fortes contraintes sur les équipes de développement
- Les layout doivent être facilement découpables (cf. les petits arrondis « si jolis » disséminés un peu partout sur votre design)
- Une bonne partie des contraintes d’accessibilité ayant attrait directement à la partie design, vous risquez tout simplement de ne pas pouvoir atteindre le niveau requis par la norme que vous visez

Avant même le premier contact avec votre designer, faites un brainstorming avec vos équipes pour lister l’ensemble des contraintes liées au design. Après tout, rien de plus simple que de comparer ces contraintes aux portfolios des candidats, qui concourrent au design ergonomique de votre site.

Un beau dessin vaut mieux que tous les discours

Pour faire simple, un wireframe vous permet de générer une vue d’ensemble de vos différentes pages, et en particulier la disposition des différents blocs qui les constituent avec les fonctionnalités qui leurs sont associées. Le wireframe peut être simple ou complexe et les dimensions ne sont pas forcément exacts, mais le principe général d’agencement de vos pages est bien en place.

L’avantage principal d’utiliser un wireframe est de garantir que tout ce qui devrait être sur votre site est bien présent à la place voulue. L’avantage caché étant de mettre en avant les blocs essentiels de votre site et de vous poser les bonnes questions en amont de la phase créative. La résultat étant un design ergonomique.

L’avantage encore plus caché est que vous commenciez à vous lasser de jouer avec Microsoft Paint et que Axure est tout de même bien plus fun. Cependant, jouez collectif : associer votre designer à la réalisation de votre wireframe est une riche idée.

N’attendez pas pour partager votre intimité

Cela fait des mois que vous planifiez dans les moindres détails la réalisation de votre site Web, vous êtes prêt à passer à l’action : vous décidez donc de faire intervenir votre designer. Grosse erreur de logique !

Partagez votre intimitéAssociez votre designer au plus tôt dans la préparation de votre site pour ces 2 raisons :
- Un designer, de par son expérience, connaît les bonnes directions que doit prendre votre site Web ; il est donc un guide précieux dans la course contre le temps que constitue la réalisation d’un site
- Il est fort possible que tout ce dont vous aviez rêvé ne se révèle pas réalisable lorsque ce vous allez le confronter aux réalités du Web et aux bonnes pratiques de l’utilisabilité

Faire intervenir votre designer sur le tard n’est pas la manière la plus efficace et certainement la plus coûteuse. Optez pour un design ergonomique : associez toute votre équipe à la phase design pour assurer que tout le monde soit sur la même page, ainsi qu’une meilleure adhésion à votre projet.

Parlez-lui de vos amis

Au final, le bon design est celui qui marche pour vos clients et qui les orientent vers ce que vous aimeriez qu’ils fassent. Ce que vous préférez ne compte pas autant que votre taux de transformation.

C’est pour cette raison qu’il est essentiel de savoir qui est votre audience et d’identifier votre client idéal.

La plus part des gens imaginent que les designers sont plus créatifs si vous leurs donnez le minimum d’information, ce qui équivaut au final à réaliser une séance de shooting photo dans le noir !

Au contraire si vous exposer clairement la typologie de vos clients à votre designer, tout deviendra plus clair pour lui et votre design ergonomique par la même occasion. Et il est fort à parier que l’expérience utilisateur n’en sera que plus agréable pour vos visiteurs.

Ne cachez pas vos problèmes

Votre désigner est avide de résoudre les problèmes que posent votre site : ne lui gâcher pas son plaisir ! Au lieu de le driver en lui proposant des solutions toutes faites, allez au plus simple : confiez-lui vos problèmes et rendez par la même occasion votre design ergonomique.

Ne cachez pas vos problèmesCherchez bien, ça ne devrait pas être trop difficile de faire une liste aussi longue que celle que d’un enfant hyperactif à la veille de Noël… Quelques idées en vrac :
- Mes outils de Web analytique me révèlent que mes clients ont du mal à aller jusqu’au bout de mon entonnoir de conversion
- Les tests utilisateurs mis en place remontent que mon site Web est difficilement lisible
- Je dois mettre en avant un nouveau service, mais je ne souhaite pas pour autant que cela éclipse mes offres précédentes

Source
[HOW TO] Have a Gorgeous Website Design AND Great Conversion Rates at the Same Time

Posté le par Florian d'Appili dans Ergonomie des sites web 2 commentaires

5 choses à mettre en place lorsque votre entonnoir de conversion craint

Vous avez investi des sommes rondelettes dans vos campagnes Google et avez en conséquence un trafic qui fait pâlir d’envie vos concurrents. Tout se passe pour le mieux dans le meilleur des mondes… Tout, sauf que vous ne convertissez pas vos visiteurs en consommateurs. Pas besoin de chercher plus loin : votre entonnoir de conversion (ou tunnel de conversion) a un sérieux problème.

Visualisez votre entonnoir de conversion

Si vous n’avez pas déjà mise en place des objectifs de conversion sur Google Analytics (ou d’autres outil similaires), ne continuez pas à lire cet article, et revenez une fois que vous l’utilisez! Cet outil vous révèlera sur quelles pages vos visiteurs vous lâchent, et probablement où se trouvent les aberrations en terme d’expérience utilisateur que vous avez disséminé sur votre site sans vous en rendre compte.

Mais bien plus que quand vos visiteurs vous lâchent, ce type d’outils vous permettra de comprendre pourquoi ils quittent votre site et de réaliser statiquement un audit de votre site internet. Est-ce que vos visiteurs regardent d’autres sites pendant le processus de conversion parce que le tunnel que vous avez mis en place ne répond pas à leurs besoins ? Est-ce que vos visiteurs vous quittent lorsque vous leurs révélez vos prix ?

Si c’est du chinois pour vous, faite donc un tour sur le centre d’aide Google Analytics.

Mettez vos formulaires à la diète

FormulairesEst-ce que tous les champs que vous demandez à vos utilisateurs sont utiles ? Est-ce que vous pouvez enlevez le superflus pour ne garder que l’essentiel ? Réfléchissez-y… Avez-vous vraiment besoin de connaître la date de naissance ou la situation maritale de vos visiteurs ?

Si vous êtes un e-commerçant : est-ce que la page d’enregistrement et la page de livraison sont les mêmes? Mettez en place les bonnes pratiques d’utilisabilité que révèleraient sans doute l’audit de votre site internet.

Mettez votre mère à contribution

Rassurez-vous, on ne vous demande pas de revivre l’humiliation de porter le costume « désigné » par votre mère pour Mardis Gras. Appelez votre mère, et expliquer lui ce que vos visiteurs doivent accomplir. Ensuite mettez-là au défi de vous trouver sur Google et de passer par votre processus de conversion. Pourquoi votre mère ? Certainement une des seules personnes à accepter de réaliser un audit de votre site internet gratuitement.

Prenez des notes sur ce qu’elle dit et le temps qui lui est nécessaire pour accomplir les différentes étapes. Demandez-lui si le message a du sens : faites en sorte que vous communiquez à vos visiteurs d’une manière directe.

Si elle bloque sur le chemin aboutissant à une conversion, c’est que votre entonnoir a besoin d’une sérieuse refonte.

Investissez dans des tests utilisateurs

Tests utilisateursDepuis que les tests utilisateurs se démocratisent, il est désormais possible d’avoir des retours d’utilisateurs sur votre site (un peu plus objectifs que votre mère !). Pour quelques dizaines d’euros par test utilisateur ces startups vous permettent de réaliser un réel audit de votre site internet en expliquant leurs ressentis sur un site qui leurs est inconnu.

Vu qu’il y a encore quelques années, votre seul choix était de payer un test utilisateur complet en laboratoire pour environ 1500 euros, il serait dommage de s’en priver.

Pensez itératif : implémentez, vérifiez, implémentez…

Il n’y a pas de secret… En fait si, il y en a un : vous devez constamment vérifier analytiquement ce que vous avez perçu empiriquement. Cette façon de conjuguer statistique et empirique vaut mieux que le meilleur audit d’un site internet.

L’utilisation de Google Analytics vous permettra de comprendre statistiquement ce qui pose problème au niveau de votre site, puis les tests utilisateurs vous permettront d’affiner les soucis que vos visiteurs rencontrent. Ce dernier élément vous fera prendre des choix (bons ou pas) qu’il faudra vérifier statistiquement.

Les changements mis en place pouvant toujours être améliorés, il ne tient qu’à vous de rentrer dans le cercle vertueux de l’amélioration continue.

Source
7 Things You Can Do When Your Conversion Funnel Sucks

Posté le par Florian d'Appili dans Ergonomie des sites web 4 commentaires