Un plan des rues sans indication "Vous êtes ici !", c'est comme un voilier sans voile.

Sur un site web, le "Vous êtes ici" passe par l'éclairage des menus actifs (en jaune sur le site de la ville d'Arlon) :

Source : www.arlon.be

Ou bien le sentier de navigation (appelé souvent "fil d'Ariane"), qui permet aussi de se situer dans la géographie du site :

Source : www.belgium.be

Il y a un peu plus de 4 ans, je vantais les qualités de dvdpost.be sur le plan de l'ergonomie incitative. J'entends par là la capacité à créer une interface simple et tranchante qui conduit tout droit le visiteur à se transformer en client.

Prise d'écran: dvdpost.be - septembre 2006

Cette première version restait pourtant imparfaite:

• Trois boutons "call-to-action" qui se font concurrence
• Des arguments de vente, certes concis, mais encore dispersés

La nouvelle version a résolu ces problèmes:

• Un seul gros bouton, renforcé par une flèche incitative
• Des arguments de vente rassemblés
• Un graphisme confortable, avec une présence maximale

Notez que dans les tests que j'ai opérés avec mes étudiants, d'aucuns restent gênés par le champ d'insertion du "Code Promo", trop proche de l'action principale et libellé d'une manière obscure pour les personnes qui ne sont pas concernées par cette opération.

Prise d'écran: dvdpost.be - février 2010

Les concurrents, comme netfilm.be, adoptent une structure de service et des interfaces assez similaires.

J'aime assez bien ici, l'effet de rayonnage créé dans la partie inférieure de la page.

En revanche, les arguments de vente ("en 24 heures par la poste", "pas d'amende de retard", etc.) ne ressortent pas très bien, en gris sur fond noir, sans indentation.

Prise d'écran: Netfilm.be - février 2010

Ce type d'interface (un call-to-action majeur, trois arguments de vente et un effet de rayonnage) pourrait s'exporter à d'autres entreprises et secteurs, à mon avis.

Voyez, par exemple, comme l'offre de Be tv, dans un domaine connexe, semble extrêmement compliquée et peu équipée de "call-to-action" tranchants.

Source: betv.be - février 2010

La dernière version de Firefox intègre la possibilité contextuelle d'ajouter un onglet.

Le petit "+" semble très intuitif. J'adore ce genre d'amélioration, peu spectaculaire, tellement elle semble naturelle. Mais il fallait y penser.

En réalité -une fois n'est pas coutume-, c'est Internet Explorer qui avait innové. Seule différence: le petit "+" n'apparaît pas avec Internet Explorer. Une icône moins évidente apparaît uniquement au survol de la souris. Firefox s'est donc inspiré de son concurrent, en rendant les choses encore un cran plus claires.

L'ergonomie, c'est ce sens du détail. Ces mini raccourcis qui facilitent la vie.

Les professionnels du Web ont très vite intégré la nécessité de fournir des mécanismes de navigation à travers un site.

Cependant, le besoin de navigation a souvent été hypertrophié. Les utilisateurs ne demandent pas à se retrouver devant un cockpit de Boeing. Autant les fonctions clés seront appréciées (fil d'Ariane, retour à la page d'accueil, moteur de recherche, têtes de chapitres,...), autant il n'est pas forcément indispensable de tout étaler en permanence dans l'interface.

Ci-dessous, sur le site officiel de la Région de Bruxelles-Capitale, le contenu est cerné, de toutes parts, par une quantité impressionnante de liens de navigation. Ce qui augmente les distractions, diminue le confort de lecture et complique l'expérience utilisateur.

Source : http://www.bruxelles.irisnet.be/....

Ci-dessous, dans une version récente du site de la BBC, la navigation est complètement ciblée. L'utilisateur a choisi "Sports", puis "Tennis"... et le menu de navigation est complètement centré sur le tennis. Le contenu est parfaitement mis en situation. La navigation ne crée pas de digression.

Source : http://news.bbc.co.uk/....

Un bouton, bien visible mais peu envahissant, donne accès aux autres contenus de la chaîne.

Certains sites, moins connus que la BBC, c'est vrai, auront intérêt à présenter l'étendue de leur offre aux visiteurs. Mais le problème est toujours le même, à force de tout vouloir montrer, on assomme l'utilisateur, qui ne regarde plus rien.

Les utilisateurs d'Internet ont totalement acquis le réflexe d'utiliser l'ascenseur (barre de défilement vertical) pour explorer les pages web. Depuis 8 ans, je diffuse ce message, à travers mes formations "écrire pour le web", sur le site redaction.be ou via ce blog.

Et voilà la chose encore confirmée dans un excellent article d'une agence d'ergonomie basée à Bristol (UK) : The myth of the page fold: evidence from user testing.

Source : CX Partners.

Leur opinion se base sur une expérience de quelque 800 tests utilisateurs.

Le point intéressant de l'article est qu'il identifie quelques paramètres qui, dans certains cas, peuvent malgré tout décourager le scrolling. Il s'agit de :

• L'utilisation de lignes horizontales, qui brisent la page.
• La surcharge du premier écran, qui assomme tellement qu'elle décourage toute exploration supplémentaire.
• L'utilisation de zones de défilement intérieures, qui s'ajoutent à l'ascenseur principal et en compliquent l'utilisation.

Une erreur classique de conception reviendrait à surcharger le premier écran, soit toute la zone "above the fold", sous prétexte de la rendre immédiatement visible. Mieux vaut souvent aérer l'information, quitte à la placer plus bas.

Tout cela étant dit, je pense que la zone directement visible à l'arrivée sur une page (la zone au-dessus du pli) reste primordiale pour mettre les visiteurs en situation. Les titres et les chapôs qui apparaissent dans cette zone demeurent décisifs. Le taux d'attention s'avère tout de même supérieur dans la partie haute de la page.

Mais descendre sous le premier écran ("below the fold"), ce n'est pas descendre en enfer.

Lisibilité et densité d'information sont deux facteurs qui interagissent étroitement au sein d'un site web. Je veux dire par là que plus l'information est touffue, plus il devient nécessaire d'en soigner la présentation.

Je viens de tomber sur un exemple qui prouve que le bon sens ne court pas encore les rues... pas même toujours les grandes artères. Il s'agit de la lettre (électronique) des députés européens du groupe UMP.

Source : http://www.umpeurope.org/Lettre/2005-06/

Jugez par vous-même.

Et ce n'est pas la fonction "agrandir les caractères", au bas de la page, qui nous tirera d'affaire ! Elle ne fera qu'augmenter l'effet gruyère causé par le texte justifié dans une étroite colonne.

Bon exercice à soumettre aux étudiants en communication : revoir l'usage du gras dans le texte, dans le sens d'une bien plus grande sélectivité (à force de tout mettre en évidence, on ne met plus rien en évidence).

France - Serbie... en direct sur Yahoo! Sport...

Mais ce n'est pas des remplacements opérés par le sélectionneur Domenech dont je veux vous parler... ni de l'exclusion contestée de Lloris...

Non, sur ce blog, on parle typographie, ergonomie, architecture de contenu,... Et la petite idée qui m'a séduite, dans un flux de brèves, est d'utiliser une typographie décroissante : de gros caractères pour le dernier "post", de moyens caractères pour l'avant-dernier, et des caractères plus petits pour le reste de l'historique du flux d'information.

C'était tout bête. Comme toutes les grandes idées.

La question posée par Marina à la suite de mon billet précédent m'est régulièrement adressée en formation :

Est-ce que l'expérience utilisateur varie d'une langue à l'autre, d'une culture à l'autre ?

J'ai déjà lu un ou deux mémoires sur le sujet, mais n'y ai jamais vraiment puisé de données consistantes.

Certes, on peut trouver, ci et là, des recommandations sur la conception des sites web dans un environnement international. Mais ces recommandations portent davantage sur des conventions métriques et typographiques que sur des questions de mise en page.

Un coup d'oeil rapide sur les sites arabes, par exemple, permet de constater qu'ils affichent des standards d'ergonomie très semblables aux nôtres. Simplement, le site se construit en miroir, avec un sens de lecture de droite à gauche, et non de gauche à droite.

Source : http://www.aljazeera.net/Portal

Que pensez-vous de cette idée d'animer des boutons à l'aide d'éléments vidéos ?

Un exemple est accessible sur le site web de la société ACERTA, qui offre des services en création et gestion d'entreprise.

Source : www.prioritealhumain.be.

Outre leur mouvement, le fait que les personnages débordent du cadre strict du bouton attire évidemment l'attention.

Percutant ou perturbant ?

Futile gadget ou intéressante recette ?

Mon avis personnel : la formule se défend bien pour un choix simple (trois ou quatre options) et proéminent (choix de navigation centraux), comme c'est le cas ici. Les barres de menu permanentes (en haut ou à gauche) doivent rester sobres, je pense, pour ne pas perturber le contenu proprement dit. Le mouvement doit rester modéré, afin d'éviter une cacophonie nerveuse dans la page.

D'autres exemples dans la gamme ?

J'ai parlé avec de nombreux webmasters à ce sujet, et le constat reste toujours le même : très peu d'utilisateurs (moins de 1% bien souvent) prennent la peine de donner leur avis à propos du site dans les rubriques prévues à cet effet.

Les sites web qui prévoient une rubrique "Feedback" générique (comme ci-dessous, la rubrique "Réagir", au sein d'une barre d'outils de navigation) génèrent, la plupart du temps, un taux de participation décevant.

Source : EUlisses

En revanche, des formules beaucoup plus immédiates se développent de plus en plus. Voyez, par exemple, comment le manuel d'aide en ligne de Google Analytics évalue, sur le tas, la satisfaction des utilisateurs. L'interaction se fait dans la page même. Le formulaire, lui-même, réagit en temps réel sans exiger un rafraîchissement de la page ni l'encodage de quelconques données personnelles (que Google aura sans doute déjà néanmoins collectées).

Source : Google Analytics

Appréciable également : la précision des questions. Plutôt que de demander aux gens si le site, dans l'ensemble leur plait (ce qui ne nous apportera pas grand chose), on les interroge de manière beaucoup plus concrète et contextuelle : "Est-ce que cette page contient l'information que vous cherchiez ?", "Est-ce que nos explications sont compréhensibles ?", "Est-ce qu'il manque des précisions ?".

Feedback immédiat, feedback contextuel, feedback concis et feedback précis sont, à mon avis, quatre règles à respecter si vous désirez faire parler vos utilisateurs.

Connaissez-vous d'autres exemples à suivre en la matière ?