Ergonomie des carrousels : 10 principes à respecter

Depuis quelques années déjà, le carrousel s’est imposé comme une excellente solution pour mettre en avant les actualités principales d’un site web. Le principe est le suivant : afficher des sujets en grand format qui « tournent » en alternance, l’un après l’autre. Une bonne manière de gérer l’espace limité de l’écran et d’en augmenter l’impact. C’est prouvé : un grand format attire davantage l’attention qu’un puzzle d’informations qui se font concurrence. Cependant, la qualité des carrousels que vous rencontrerez sur le web apparaît très variable. Certaines critiques régulièrement entendues, l’expérience de tests utilisateurs et le bon sens m’amènent à proposer 10 recommandations.


1. Le rythme

C’est la critique la plus fréquemment exprimée. « Le carrousel tourne trop vite ! ». Rarement l’inverse. Très souvent, l’utilisateur n’a même pas le temps de lire le quart du texte affiché que le diaporama l’entraîne ailleurs. Un carrousel qui tourne trop vite gêne également la lecture des autres éléments de la page. Les utilisateurs détestent le mouvement nerveux et les effets d’animation extravagants, qui sonnent trop publicitaires. Veillez à ce que le carrousel tourne calmement. 8 à 10 secondes d’affichage s’avèrent souvent nécessaires. Testez le rythme du carrousel dans plusieurs environnements, afin d’en jauger la fiabilité.


2. La transition

Dans certains cas, l’utilisateur n’aura même pas remarqué que l’affichage a changé. Un effet de transition explicite, sous la forme d’un fondu enchaîné par exemple, marquera plus clairement le mouvement de carrousel. La fluidité de la transition a de l’importance. Pour cette raison, le fondu enchaîné a ma préférence : il permet de quitter un sujet avec douceur et de glisser vers le sujet suivant. Un bref passage au noir peut également convenir. Évitez par contre les effets folkloriques, du genre « spirale » ou « bienvenue à la foire ».


3. Le contrôle utilisateur

Le mouvement imposé à l’utilisateur reste une attitude « offensive » susceptible de générer des frustrations. La seule manière de le compenser est de redonner ce contrôle à l’utilisateur sous la forme d’éléments d’interaction intuitifs et explicites.

L’utilisateur doit pouvoir :

  • Stopper l’animation. Y mettre une pause.
  • Revenir en arrière.
  • Parcourir le diaporama à son rythme et à sa manière.

Plusieurs solutions existent…

Ci-dessous, la barre de contrôle indique clairement le nombre de sujets disponibles et propose un contrôle sur la navigation. Le bouton « pause » est particulièrement précieux.

Les petites flèches latérales restent également un moyen de contrôler le défilement.

Les petits ronds sont devenus presqu’un standard. Je dis « presque », car ils restent moins explicites. Si vous en faites usage, veillez à les rendre suffisamment présents.



Ci-dessous, la barre de contrôle proposée sur Arte.tv présente le désavantage de dépendre de la couleur de fond. Sur fond clair, les petits ronds deviennent quasi invisibles.



Lorsque l’utilisateur fait le choix d’afficher un sujet, le carrousel devrait s’arrêter. De nombreux sites web relancent l’animation après quelques secondes, à la grande frustration des utilisateurs.

Un passage de la souris sur le sujet affiché devrait en stabiliser l’affichage. La plupart du temps, un utilisateur bouge sa souris sur un élément parce qu’il s’y intéresse.


4. Le nombre de sujets en alternance

Si les sujets sont trop nombreux, la navigation devient compliquée. Les sujets en fin de liste se retrouvent très déforcés et le cycle, trop espacé. Ci-dessous, le choix se disperse et les petits ronds en viennent à mordre le contenu du carrousel.



En-dessous de trois sujets, le carrousel perd son sens. Il m’est arrivé de voir des carrousels à un seul sujet, tournant sur eux-mêmes. Absurde.

Derrière un carrousel, il y a donc une ligne éditoriale.

Dans la plupart des cas, optez pour 3 à 5 sujets.

Certaines formules d’affichage des sujets à la verticale, comme ici sur Yahoo! Health, permettent de lister une dizaine de sujets.


5. La position du carrousel dans la page

Le carrousel, comme élément de l’interface, s’est imposé au centre de l’écran, dans la partie haute.

Lorsque le carrousel est positionné sous la ligne de flottaison, ou encore dans une zone latérale, il perd énormément de son impact et provoquera une expérience utilisateur déroutante.

Le but du carrousel est de focaliser le centre de l’attention.


6. La quantité de texte

En dix secondes, vos visiteurs liront 20 à 30 mots.

Ci-dessous, la quantité de texte moyenne affichée sur le carrousel d’Arte TV, pendant environ 10 secondes. Le texte peut être lu de bout en bout par un utilisateur attentif. Mais il ne faudrait pas faire plus long.



Ci-dessous, quel est le carrousel le plus lisible ?

« Wrath of Heroes » n’accroche pas aussi bien que « Truth About Beer ».
Car trop de texte induit aussi une police de caractère trop petite.
Notez aussi la redondance : « Wrath of Heroes » apparaît deux fois, dans le texte et dans la partie graphique. Une telle redondance ne devrait pas être permise dans l’espace limité du carrousel.




7. Le visuel

Mieux vaut un seul visuel impactant qu’un effet de montage.

Privilégiez les visuels concrets qui représentent le contenu plutôt que les effets de style.

Ci-dessous, sur le site officiel de la présidence française, le choix d’un visuel unique nous semble plus porteur que la tentation de réaliser un patchwork. Une mise en page en puzzle va à contre-sens de l’intérêt du carrousel qui consiste précisément à exploiter un large format.


8. La clarté de l’interaction proposée

En dehors de la possibilité d’interagir avec la navigation au sein du carrousel (voir point 3 ci-dessus), l’utilisateur peut généralement cliquer dans la zone de contenu pour accéder au détail de l’information.

Nous recommandons :

  • Une seule zone de clic de préférence
  • Visuellement présente (suffisamment grande et contrastée)
  • Offrant une interaction explicite (par exemple un bouton, une flèche,…)
  • Positionnée de préférence en bas à droite

Ci-dessous, le bouton « Play video » répond aux bonnes pratiques : contrasté, bien positionné dans le flux de lecture, libellé explicitement, invitant au clic.



Ci-dessous, le carrousel d’Umicore ne laisse pas apparaître la possibilité d’une interaction. Peu d’utilisateurs seront enclins à cliquer. Ce type de présentation avec du texte fondu dans le visuel et aucune zone de clic explicite sera reçu comme un placard publicitaire, même si le contenu mène en réalité vers de l’information.




9. La cohérence

D’un sujet à l’autre, mais aussi d’un jour ou d’une semaine à l’autre, il importe de respecter une cohérence pour créer des repères et la sensation d’un environnement éditorial maîtrisé.

La cohérence se vérifie à différents niveaux :

  • Cohérence graphique (typographie, coloris, traitement des photos,…)
  • Cohérence fonctionnelle (zones d’interaction, zones de clic,…)
  • Cohérence éditoriale (nature des contenus abordés, ton utilisé,…)

Ci-dessous, dans son carrousel, Arte TV fait varier la position de son descriptif texte, mais la typographie ainsi que le volume de texte restent cohérents. Une bonne manière de créer un fil rouge tout en s’accordant des variations visuelles qui relancent l’attention.


10. L’accessibilité de la technologie adoptée

Plusieurs moyens existent de créer un carrousel : Flash, CSS, Javascript,… Le choix de la technologie influencera plusieurs facteurs :

  • Accessibilité du contenu par les environnements les plus variés (mon iPad ne supporte pas Flash, par exemple)
  • Indexation par les moteurs de recherche (de nombreux carrousels présentent le désavantage d’intégrer du texte non reconnu comme tel, non indexable)
  • Facilité d’édition par le client (un carrousel en Flash avec des transitions méga fluides, c’est très bien, mais si les contributeurs de contenu sont incapables de l’alimenter, on perd en réactivité)

Pour l’entreprise qui ne dispose pas d’un graphiste sous la main, certaines solutions plus sobres ou plus formatées peuvent s’avérer intéressantes. Ci-dessous, Google Analytics propose un carrousel quasi full text.



Tenez, par rapport à ce dernier point (les solutions techniques), je suis preneur de vos avis et réactions !


Pour en savoir plus (en Anglais) :






Et si vous désirez établir une ligne éditoriale pour alimenter votre carrousel en contenus efficaces, contactez-moi !

Ergonomie des interfaces : cinquième édition actualisée

Catégories : Ergonomie - A lire

Jean-François Nogier, épaulé par Thierry Bouillot et Jules Leclerc, signent une cinquième édition de l’ouvrage « Ergonomie des interfaces » chez notre éditeur conjoint, les éditions DUNOD.

J’ai lu cette nouvelle édition, et je la conseille pour les raisons suivantes :

  • Elle est enrichie d’exemples actuels, notamment issus de l’évolution des téléphones mobiles et des tablettes numériques, qui font naître de nouvelles interactions.
  • Elle est très didactique, concise, centrée sur l’essentiel, sans la boulimie à laquelle nous habituent même certains ergonomes.
  • La table des matières est pragmatique et didactique : que des verbes d’action. Une belle manière d’appliquer au livre l’approche orientée utilisateur chère à notre métier.

Ci-dessous, une des contraintes ergonomiques nouvelles qui apparaissent avec les interfaces tactiles, c’est la gêne occasionnée par la présence des doigts sur la surface. Dans certains cas, la main occulte, au mauvais moment, une partie critique de l’écran. Par l’exemple si vous désirez faire apparaître une infobulle ou tout autre complément d’information lors d’un clic sur un objet de l’interface, il est important de positionner cette infobulle au-dessus et non en-dessous de l’objet. Autrement, le pouce ou l’index de l’utilisateur masquera l’effet visuel.


L’écriture a également toute sa place dans l’ergonomie d’un site web, d’un bouton, d’un menu ou d’une application. Ci-dessous, un tableau des différentes règles de construction des abréviations. Histoire d’assurer la concision dans la cohérence. Je trouvais la démarche intéressante.


L’ergonome averti réagira à certains passages délicats, comme la fameuse règle des trois clics, autant véhiculée que contestée, ou le parcours de l’œil en Z, très schématique face à la variabilité des comportements. Mais Jean-François Nogier y ajoute immédiatement d’intéressants bémols et reste didactique de bout en bout, quitte à gommer certaines nuances à des fins de clarté pédagogique.

Pour plus détails :

Ergonomie des interfaces
Guide pratique pour la conception des applications web, logicielles, mobiles et tactiles
Jean-François Nogier, Thierry Bouillot, Jules Leclerc
5e édition, octobre 2011, DUNOD, Paris
Broché: 320 pages
ISBN-10: 2100557920
ISBN-13: 978-2100557929

En vente chez Amazon

Le livre, présenté par ses auteurs

Je connais quelqu'un qui connaît quelqu'un qui connaît Google

Catégories : Référencement

Beaucoup de prose s'agite, sur Internet, autour de cette question passionnante et pleine d’enjeux : "Comment fonctionne Google ?".

Simplement, il m’arrive d’être étonné, hier matin par exemple, du caractère récurrent de certains débats et de leur nature incessamment contradictoire même à l'intérieur du petit monde du référencement.

Matt Cutts, le porte-parole de Google, vient de s'exprimer sur deux sujets : l'influence des Adwords sur les algorithmes de référencement naturel, ainsi que la notion de TrustRank. Dans les deux cas, sur abondance.com, le site incontournable d'Olivier Andrieu, le débat ricoche en commentaires polarisés ou nuancés, mais certainement pas unanimes.

Source : Youtube


Sur une base prétendue empirique, certains mettent directement en doute la parole officielle du moteur de recherche. D'autres nuancent en disant qu'il faut distinguer l'effet direct sur un algorithme de l'effet indirect. D'autres encore égratignent la parole floue de Google, portée par Matt Cutts, ce bonhomme sans cravate, sympathique, sans excès de séduction, qui incarne l'humanité du puissant moteur de recherche. Il est vrai que le message est parfois plus que vaporeux : le TrustRank ne serait pas un algorithme proprement dit, mais quand même une manière de calculer un indice de confiance important aux yeux du moteur,...

Soit !, mon but n’est surtout pas de lancer un débat qui a mieux sa place chez les référenceurs purs et durs. Ma position – celle que j’ai toujours tenue vis-à-vis de mes clients – est de prendre du recul par rapport à ce qui s’exprime, et l’utiliser de manière pragmatique, raisonnable et durable, à travers une stratégie de contenu ni naïve (bien renseignée tout de même sur la réalité de la mécanique d’indexation) ni acharnée (tant il est vrai que la sur-optimisation SEO peut prendre une énergie qui, dans certains cas, ferait mieux d’être dépensée dans le contenu proprement dit).


Comment expliquer tant de divergences ? Qui a raison ? Qui a tort ?

La question qui m'intéresse, donc, en arrière-fond de cette recherche du saint algorithme, est une question de mise en perspective : "Comment peut-on savoir comment Google fonctionne ?". Ou, dit plus simplement...


Quelles sont les sources d'information pour connaître les mécanismes de référencement ?


1. Google lui-même ?

Oui, bien sûr, Google est loin d’être une boîte noire. Il possède un centre pour webmasters, des guides didactiques pour ceux qui désirent améliorer leur référencement, un blog, un porte-parole en t-shirt,… Toute une artillerie dédiée à la communication, en somme.

Mais la parole de Google est limitée par le fait même de la concurrence. Pas question pour le moteur de livrer au grand jour ses recettes de cuisine. Google a construit son empire sur l’efficacité et la rapidité de ses calculs de pertinence ; pour rien au monde il ne se dénuderait devant Bing ou Yahoo! Ceci explique cette zone de flou, bien compréhensible, dans la communication du géant. Toute entreprise, dans le monde actuel, se pose cette même question : comment proposer un service transparent et perçu comme utile, sans pour autant livrer son savoir aux concurrents.


2. Wikipedia ?

Wikipedia est un projet génial et je vous invite, comme moi, à le soutenir financièrement (une campagne de don est en cours actuellement). Cependant, vous y apprendrez davantage sur les phases de grossesse de la baleine bleue que sur le TrustRank. Une encyclopédie collaborative n’est pas le lieu idéal pour traiter les thèmes très polémiques ou sujets à de gros enjeux commerciaux.


3. Les sociétés spécialisées en référencement ?

Bien entendu, il existe de l’expertise du côté des sociétés ou des consultants qui ont décidé de consacrer leur vie au référencement, un domaine qui bouge beaucoup et qui a d’énormes conséquences sur la performance des entreprises et le paysage de la concurrence (des conséquences encore souvent sous-estimées). Mais ces sociétés ne sont pas neutres non plus puisqu’elles vous vendent leur expertise. Le garagiste ou le plombier qui vous fait un devis est-il le plus proche de la vérité de vos problèmes d’humidité ou d’usure moteur ? C’est loin d’être sûr (les associations de défense des droits des consommateurs sont alarmantes à cet égard). Le savoir-faire SEO existe, ce n’est pas la question. Mais pour défendre leurs intérêts, les experts en référencement exagèrent parfois la portée de leur science dans les forums de discussion ou les salles de réunion. C’est comme pour les plombiers, pas facile de distinguer le bon grain de l’ivraie.


4. Les académiciens du référencement ?

Certains experts du référencement font passer la vocation didactique avant la vocation commerciale. Ce sont ceux qui ont le plus ma confiance. Et comme ils se comptent sur les doigts de la main, citons des noms (faisons-nous des amis et des ennemis, par la même occasion ;-) :

Sébastien Billard existe. Autrement il faudrait l’inventer. Sébastien diffuse une vision sage et consistante de l’évolution du référencement. Il a perçu, bien avant les autres, la place du contenu dans la mécanique SEO.

Olivier Andrieu possède une société commerciale, mais son discours a toujours été très didactique, très généreux, et emprunt du recul nécessaire. Je lui prête un grand respect.

Isabelle Canivet ne prétend pas être une pure experte du référencement, mais dans le monde du rédactionnel qui nous occupe, c’est probablement la personne qui s’est positionnée le plus explicitement et le plus concrètement sur la question du référencement naturel. Son expertise se situe parfaitement à la frontière des deux mondes. Nous faisons le même métier avec des clients et des accents un peu différents. Nos discussions sont passionnantes et balancent entre le référencement, l’ergonomie éditoriale et la stratégie de contenu comme colonne vertébrale.


5. Les clients qui disposent de chiffres

Rien n’est plus tangible que les statistiques de trafic, qui contiennent des données intéressantes sur les sources de trafic, les mots clés entrants,… donc le résultat tangible du référencement. Certaines personnes expérimentent et mesurent l’impact SEO de modifications apportées à leur site web.

Dans un contexte où Google ne communique pas tout et où, de toute manière, l’esprit critique reste souhaitable, la démarche empirique garde tout son intérêt. Vous verrez régulièrement passer des billets sur Internet, rédigés par des mordus de référencement ou d’analytique, qui vous expliqueront comment ils ont constaté que tel ou tel critère influençait beaucoup, un peu ou pas du tout le référencement.

Ici encore, il y a à boire et à manger. Les variables sont aussi nombreuses que les situations de test, de sorte que tout ce qui se dit n’a pas valeur scientifique. Vous resterez critiques et croiserez ces données avec le reste du discours ambiant.


Vous l’aurez compris, personne n'est neutre dans l'histoire. C'est pour cela que le référencement continuera d’offrir certaines plages d’ombre, sujettes à de passionnants débats contradictoires.


À découvrir aussi :

3 générations aux commandes du web

Catégories : Web culture - Réflexions - Humeur

Je poursuis ma petite série "3 générations"...

Les 10 dernières (ou premières) années du web, il s'est également passé ceci de notable : le coeur de métier du web a glissé du département informatique au département communication, aussitôt concurrencé par le département marketing.

Vous excuserez la caricature, nécessaire au propos...


1. L'ère des techniciens

Au début du web, les techniciens sont maîtres. Le langage est celui de l'informatique : HTML, FTP, DNS,... sont les clés de l'existence.

Le site web de première génération est édité à la main, dans un fichier texte, les mains dans le script.

Le site web de première génération se veut tape-à-l'oeil, "dernier cri", pur effet de démonstration.

Le site web de première génération utilise la dernière version de Flash. Celle que vous n'avez pas encore installée.

Voici un exemple de page d'accueil de première génération :

Source : MTV, à ses débuts.

Le contenu du site web de première génération est statique, et directement hérité du papier... les communicateurs n'ayant pas la main, ils sont amenés à mendier les "updates" auprès de l'équipe informatique et perdent vite courage.

Une page "dynamique" dans un site web de première génération, c'est une page avec du texte défilant, des menus déroulants et autres gadgets de foire.

Les sites web de première génération font le bonheur des managers, car ils font bonne figure dans la forme et n'engagent pas trop le contenu.

Oh, ne riez pas trop vite, ou riez jaune, car... j'en connais qui mendient encore leur autonomie auprès du sacro-saint département IT... le diktat de la technique menace toujours de revenir à la surface... à peine vous êtes-vous familiarisé avec votre éditeur qu'on vous vend les arguments d'une suite logicielle innovante, sensée vous rendre autonome... et nous voilà de retour à la case départ... que ceux qui n'ont jamais connu les affres d'un mauvais CMS me jettent la première critique.

En termes d'analyse de trafic, la première génération de sites web connaît un pic de fréquentation rapidement estompé. Elle échoue à fidéliser les visiteurs.


2. L'ère des communicateurs

Dans un second temps, les gestionnaires de sites web réalisent que les utilisateurs se ruent sur le bouton "skip" ("passer l'intro") dans l'espoir d'accéder, le plus rapidement possible, au contenu proprement dit, sans s'encombrer de prouesses techniques vécues comme une désagréable digression.

La deuxième génération de sites web ouvre les yeux sur le fait que les visiteurs ne reviennent sur un site que s'il y a quelque chose à manger : du contenu utile, intéressant, actualisé.

Le slogan de la deuxième génération de sites web est : "Content is king".

La deuxième génération de sites web se libère des contraintes techniques, adopte un bon CMS, et se met à produire du contenu spécialement pour le web (plus seulement la brochure d'entreprise au format PDF).

La deuxième génération de sites web appartient au département communication, qui instrumentalise l'informatique.

La deuxième génération pèche par excès de zèle : elle produit sans compter (aucune mesure de l'investissement éditorial) ; elle produit sans stratégie (un workflow aléatoire et pas de ligne éditoriale) ; elle produit des contenus qui rendront rapidement le site obèse et noieront les tâches principales ; elle produit sans suivi (les contenus ne sont pas nettoyés, peu actualisés après publication, et ne faisant l'objet d'aucune analyse de trafic).

Voici un exemple de page web de deuxième génération (le contenu est verbeux et n'est prolongé par aucun appel à l'action) :

Source : AG Insurance

La deuxième génération de sites web communique unilatéralement. Elle ne donne pas, ou très peu, la parole aux utilisateurs. Le journaliste prend le pouvoir. Sa "plume" est sacrée. Surtout pour lui-même. Aucune statistique de consultation ne devrait pouvoir remettre en cause son métier.

En termes de web analytics, la deuxième génération de sites web parvient à développer une forte présence dans les moteurs de recherche, mais le trafic qui en ressort est peu qualifié et peu converti.

Beaucoup de sites web actuels font encore partie de cette génération. Car pour en sortir, il faut sensibiliser le management, se recentrer sur le service et relativiser l'impact de la communication.


3. L'ère des utilisateurs

La troisième génération de sites web réalise que : produire du contenu, c'est bien, mais il serait sans doute utile d'en assurer la rentabilité.

La troisième génération de sites web s'organise : une ligne éditoriale, un calendrier éditorial, un outil de statistiques de trafic digne de ce nom, des responsables contenu bien désignés, etc.

Troisième génération rime avec "appel à l'action". Tout contenu doit mener à quelque chose d'utile. L'utilisateur comme l'entreprise doivent pouvoir y trouver leur compte.

Voici un exemple de site web de troisième génération :

Source : Ethias assurance

Ethias propose, moyennant une certaine audace graphique, une architecture très orientée client. Plusieurs actions sont mises en scène : "déclarer un sinistre", "obtenir un devis", "calculer ses impôts", etc.

En termes d'analyse de trafic, la troisième génération de sites web ouvre les yeux sur la réalité, ne se contente pas de compter les "hits", mais rentre dans une analyse détaillée et qualitative du trafic. Elle pratique la segmentation des données, le "in-page analytics", l'analyse des parcours de visite, des tunnels de conversion, des variations de taux de clic, des pics de fréquentation,... elle n'archive pas, elle optimise !


Quant aux moteurs de recherche, si vous y réfléchissez bien, vous constaterez qu'ils ont suivi pratiquement la même évolution :

1. Le référencement des premiers sites web était basé sur des balises techniques (les métadonnées).
2. Google a ensuite décidé de laisser la part belle au contenu proprement dit (les métadonnées mots clés ayant grandement perdu leur effet au profit du contenu visible).
3. Le référencement, aujourd'hui, évolue vers un paramétrage beaucoup plus variable et beaucoup plus dépendant du "client" (localisation géographique, habitudes de consultation, web social, etc.).


Et chez vous ?

Qui a la mainmise sur votre site web d'entreprise ? Le département IT ? Le département communication ? Le département marketing ? Les utilisateurs ?


A lire aussi : 3 générations d'architecture d'information

3 générations d'architecture d'information

A vrai dire, quand je regarde dans le rétroviseur du web, je vois ceci...

Première génération : le nombril

Développer la "notoriété" de l'entreprise. Montrer ses plus beaux bureaux, son passé glorieux. Avoir une belle "carte de visite". Regarder son nombril. Telle était souvent la caractéristique des premiers sites web.

Un site web qui commence par "historique" ou "organigramme" trahit, de facto, une forme d'égocentrisme. Ces rubriques n'intéresseront que le Président d'honneur, et encore.

La question qui occupe le centre d'un site de première génération est le "Qui sommes-nous ?".

Voici à quoi ressemble une architecture de première génération :

  • Qui sommes-nous ?
  • Organigramme
  • Historique
  • Fonctionnement
  • Structure
  • Présidence
  • Valeurs

Exemple d'architecture de première génération :

Source : www.electrochrome.fr


Deuxième génération : l'étagère

Mettre l'offre en valeur, les produits, les services,... telle est l'ambition du site web de deuxième génération.

On dépasse le stade de la carte de visite, on accepte de mettre l'entreprise en retrait derrière ce qu'elle vend. Le site web est déjà plus centré sur les besoins de l'utilisateur, mais il n'est pas à l'abri du jargon commercial (pour les produits) ou administratif (pour les services).

La question qui occupe le centre d'un site web de deuxième génération est : "Que faisons-nous ?".

  • Que faisons-nous ?
  • Nos produits
  • Nos services
  • Notre catalogue
  • Notre portfolio
  • Nos points de vente
  • Nos formulaires

Voici des rubriques typiques d'une architecture de deuxième génération :

www.sapagroup.com/...


Troisième génération : l'action

Le site web de troisième génération est entièrement tourné vers les utilisateurs. Il utilise des verbes d'action qui collent aux motivations pour lesquelles les gens sont venus ou pourraient décider de venir.

La question au centre d'un site web de troisième génération est : "Ce que vous pouvez faire ici".

  • Que pouvez-vous faire ici ?
  • Envoyer un fax en 2 clics
  • Réserver un hôtel
  • Publier, éditer et partager des photos
  • Remplir sa déclaration d'impôt en ligne
  • Crée une version raccourcie d'une URL
  • Commander le catalogue papier
  • Et des milliards d'autres choses utiles

Voici un exemple d'architecture de troisième génération (telle que je la définis ici... car ça nous ramène quelque part au web "2.0") :

Source : feedburner.com

Ci-dessous, le site LinkedIn exprime son offre dans la partie centrale de l'écran, exclusivement sous la forme d'arguments et d'actions.

Source : linkedin.com


Bien sûr, une rubrique "Qui sommes-nous" reste nécessaire (et même obligatoire dans le cas de l'e-commerce), mais les sites actuels (du moins les bons) laissent la part belle aux utilisateurs.


Y aura-t-il une quatrième génération d'architecture ? Celle que l'utilisateur dessine lui-même ? Notez que les expériences en la matière n'ont pas toujours été concluantes. La BBC, par exemple, après avoir tenté l'affaire pendant un an, est revenue vers une page d'accueil statique, non modulable.

Dans la foulée de notre récente publication "30 outils pour vos contenus web", Isabelle Canivet et moi-même proposons une toute nouvelle formation. J'ai le plaisir de vous en dévoiler le programme.

En deux jours, vous vivrez 10 mises en situation concrètes pour assimiler les meilleures techniques au service du contenu web :

1. Identifiez les forces et faiblesses de votre site par un focus groupe ludique
Idéal pour briser la glace et réveiller l'esprit critique, notre focus groupe sera rythmé par une succession de techniques ludiques que vous pourrez appliquer ensuite sur vos propres projets : le jeu de l'accusation et de la défense, le jeu de l'argent, le jeu des autocollants et le jeu du portrait chinois.

2. Développez votre stratégie "mots clés" à l'aide d'outils adaptés
Les mots clés que vous allez utiliser contribueront à votre visibilité sur Internet au travers des moteurs de recherche. Comment définir votre territoire sémantique ? Quels sont les mots clés à fort potentiel de trafic ? Où se situe la concurrence ? Quelles sont les tendances de recherche ? Nous vous proposons une méthodologie pour définir votre stratégie "mots clés".

3. Détectez les problèmes d'interface grâce au test utilisateur
Vous aurez l'occasion de vivre, sous forme de jeu de rôles, un véritable test utilisateur. La salle sera équipée d'un matériel d'enregistrement des mouvements de souris ainsi que des commentaires à voix haute des participants. Par la pratique, nous identifierons les précautions à prendre lors de la préparation, de l'animation et de l'interprétation d'un test utilisateur.

4. Validez votre architecture de contenu grâce au tri de cartes
Le test du tri de cartes permet de construire une architecture de contenu intuitive pour les utilisateurs. Nous le pratiquerons en mode collectif et en mode individuel. Quelques trucs et astuces seront partagés, qui vous permettront de tirer un maximum de profit de la séance. Les meilleurs logiciels de tri de cartes vous seront présentés.

5. Distribuez votre budget et vos ressources au départ de l'arborescence
Nous enrichirons l'arborescence de votre site web en y greffant des informations fondamentales à la gestion réaliste du projet : Qui est responsable de chaque rubrique ? De quel budget-temps dispose-t-on pour alimenter chacune d'elle ? A quel rythme ? Quels sont les mots clés à développer à chaque étage ? Vous ne verrez plus votre arborescence avec les mêmes yeux.

6. Dessinez vos maquettes fonctionnelles grâce à un outil en ligne
De très bons outils existent en ligne, qui vous permettent de dessiner vos pages web. Une quantité impressionnante d'éléments d'interface peuvent être glissés et déposés : fil d'Ariane, menus, graphiques, vidéos, texte "lorem ipsum", etc. Cet exercice sera l'occasion de discuter toute une série de notions d'ergonomie web.

7. Domptez votre CMS face aux exigences de l'ergonomie et du référencement
Les outils de gestion de contenu sont parfois de véritables usines à gaz du point de vue de la propreté du code source et de leur impact sur le référencement. L'ergonomie des interfaces d'administration contribue grandement au dynamisme éditorial. Nous jetterons un regard impitoyable sur les CMS et identifierons les points de blocage.

8. Soulevez le capot du moteur avec la boîte à outils du référenceur
Découvrez les Google Webmaster Tools, votre salle de réunion avec Google, mais également de nombreux autres outils destinés à mesurer et améliorer votre référencement. Auditez vos balises HTML. Détectez les freins au référencement et le contenu dupliqué. Auditez vos liens. De nombreux outils existent dans le domaine du SEO, gratuits ou payants. Nous dévoilerons les meilleurs d'entre eux.

9. Plongez dans les profondeurs Google Analytics
Ces derniers mois, Google Analytics s'est considérablement enrichi. Ne restez pas à la surface, vous n'y verrez pas grand chose. Apprenez à pêcher, avec un harpon aiguisé, dans les profondeurs de vos statistiques. Vous vérifierez le succès de vos campagnes, la qualité de vos visiteurs, les points de fuite du trafic, et plein d'autres choses encore.

10. Testez l'impact de micro-changements à l'aide de l'AB/testing
Très peu d'entreprises effectuent du AB/Testing, c'est-à-dire des comparaisons de performance entre différentes variantes d'interfaces. Pourtant, rien n'est plus concret et objectif que ce type de test. Changez la position ou la couleur d'un bouton, faites varier le libellé, et mesurez les variations du taux de clic en fonction des différents paramètres.


Détails et inscriptions

Ergonomie améliorée sous Windows 7

Catégories : Ergonomie - Innovations - Outils

J’aime l’ergonomie inventive. Les petits détails qui augmentent le confort sans perturber les habitudes. La barre des tâches de Windows s’est ainsi améliorée… il n’est plus nécessaire de cliquer sur l’icône de l’application concernée pour en observer le niveau de téléchargement. Désormais, la jauge apparaît directement dans la barre des tâches (voir les 36% ci-dessous).

Cette amélioration nous ramène à deux principes d’ergonomie décrits par Scapin et Bastien : les actions minimales (ne pas devoir cliquer) et le feedback immédiat (l’état du système est visible en temps réel).

Autre amélioration : l’outil de capture d’écran. Bien sûr, il existait déjà des petits logiciels de capture efficaces, mais à présent, cet outil fait partie intégrante de Windows 7. Et je m’en donne à cœur joie, moi qui aime épingler des morceaux d’interfaces à travers mes audits de sites web que je veux très visuels.

P.S. Oui, je sais, vous utilisez un Mac et ça fait 10 ans que vous profitez de tout ça ;-)

Actualisation des contenus : deux chiffres récents sonnent l'alerte

J'ai vu passer deux chiffres, ces derniers jours, qui, mis en parallèle, devraient claquer comme un coup de fouet dans les entreprises.

Google vient d'annoncer un nouveau changement dans ses algorithmes. L'évolution du système d'indexation, baptisé Caffeine, entend privilégier les contenus d'actualité. 35% des requêtes seront affectées par la fraîcheur de l'information dans ce nouveau mode de calcul.

Dans le même temps, un état des lieux du web français indique que 73% des sites web n'ont pas été mis à jour depuis un an !

Source : le lapin d'Alice au pays des Merveilles (Walt Disney)

Autrement dit, il est grand temps que les entreprises s'organisent pour gérer leur production de contenu.

Dans notre récente publication, "30 outils pour vos contenus web", Isabelle Canivet et moi-même abordons des concepts tels que le calendrier éditorial, la ligne éditoriale, le workflow de production des contenus,... bien nécessaires aujourd'hui.

Ce que ces chiffres ne disent pas, c'est qu'à l'autre bout, parmi les 20% d'entreprises qui investissent dans le contenu, la problématique est souvent inversée : les sites web sont boulimiques et il est urgent de les faire maigrir afin que les utilisateurs ne s'y perdent pas. L'archivage est le corollaire de l'actualisation des contenus.

"30 outils pour vos contenus web" : dès à présent disponible !

Catégories : A lire - Outils - Gestion de projet

Isabelle Canivet et moi-même avons investi beaucoup de temps, d'énergie, de confrontation d'expérience et de réflexion pour réaliser cette compilation à l'attention des chefs de projet web, responsables marketing et communication.

Il s'agit d'un document d'une quarantaine de pages au format PDF couleur, disponible à l'achat au tarif de 28 euros TTC.

Il se veut concis, visuel et pratique.

Rendez-vous sur le site de l'e-book : tools4webcontent.com !

Votre feedback est le bienvenu !


Table des matières

1. Les indicateurs de performance
2. Le suivi de la réputation
3. Le test de variantes d'interface
4. L'audit éditorial
5. L’audit d’ergonomie
6. L’audit de référencement
7. L’audit d'accessibilité
8. L'inventaire de contenu
9. Le focus groupe
10. Le sondage en ligne
11. Le test utilisateur
12. L’étude de la concurrence
13. Le choix de l'outil de gestion de contenu
14. Les personas
15. Les scénarios utilisateurs
16. La ligne éditoriale
17. Le brainstorming
18. L'arborescence
19. Le test de tri de cartes
20. Les maquettes fonctionnelles
21. Les maquettes graphiques
22. Le gabarit éditorial du CMS
23. Le cahier des charges
24. Le formulaire de collecte de contenu
25. La charte éditoriale
26. Le calendrier éditorial
27. Le processus de production des contenus
28. La demande de production
29. Le contrat avec un prestataire éditorial
30. Le plan de migration

Bonne lecture !

5 stratégies d’écriture inédite pour gagner en référencement

Avertissement au lecteur : ce billet, bien qu’appuyé sur des données factuelles, contient de l’ironie. Vous le prendrez comme un clin d’oeil, alimentant la réflexion autour de la rédaction et du référencement.

Voici donc 5 moyens de plaire aux moteurs :

1. Être professoral
2. Être populeux
3. Abonder d'anglicismes et de néologismes
4. Se répéter comme une petite vieille
5. Faire des fautes d'orthographe


1. Être professoral

Il existe souvent plusieurs expressions pour désigner un produit ou un métier. Commencer un article en définissant les concepts est une excellente façon d’injecter des expressions synonymes en tête de contenu. Elles constitueront autant de possibilités d’accrocher Google et la longue traîne des requêtes.

Jouez donc à l’enseignant insupportable ! Du genre : « Le réseau de transport souterrain, communément appelé métropolitain, ou métro en langue vulgaire, présente le grand avantage de désengorger le trafic urbain en surface, que certains désignent sous le vocable d’embouteillages ou, plus familièrement, de bouchons. »


2. Être populeux

Intégrer un mot au top des recherches du moment est le meilleur moyen de surfer sur les pics de trafic. Sentez l’écume venir, embarquez la planche, et éclaboussez vos statistiques d’un trafic inespéré.

Par exemple, le trafic sur mon blog a connu un sérieux pic, il y a quelques mois, le jour où, rebondissant sur un phénomène de « buzz », j’ai écrit ce billet à propos de Kris Janssens. Grâce à un titre explicite, je me suis retrouvé au-dessus du Soir et de La Libre (presse quotidienne belge), bénéficiant d’un apport soudain de trafic.



Source : Google Trends


Tiens, j’aurais dû rédiger un dossier sur « DSK ». « Digital Strategy Kit », ça le fait, non ? ;-)


3. Abonder d’anglicismes et de néologismes

Même sur Google France, les gens cherchent des mots en Anglais, parfois plus que l’expression chère à l’académie de Voltaire.

Voyez l’exemple ci-dessous, dans un domaine qui me tient beaucoup à cœur ces temps-ci. Parlez d’ « analyse de trafic », en bon français, et vous récolterez une poignée de visites. Tandis que le « web analytics », expression anglaise et fondamentalement peu parlante à mes yeux, est celle qui s’impose dans l’usage, avec un potentiel de trafic 50 fois supérieur, même en France.



Source : Générateur de mots clés Google


4. Se répéter comme une petite vieille

La répétition d’un mot ou d’une expression à plusieurs endroits clés de la page web s’avère une stratégie porteuse : dans le TITLE, dans le H1, dans le fil d’Ariane, dans les menus, dans le corps de texte, dans les liens, etc.

Attention, ce conseil est dangereux, car en cas d’overdose, Google pourrait, au contraire, ne pas apprécier du tout. La suroptimisation peut vous envoyer aux oubliettes. L’essentiel est d’injecter les mots clés dans des balises différentes. Un clonage de mot clé au sein d’une même balise (un TITLE par exemple) risque d’être jugé suspect, à juste titre, par les moteurs.

Et puis, la première chose qu’on apprend à l’école en matière de rédaction, c’est de ne pas se répéter afin d’éviter la lourdeur, n’est-ce pas ?


5. Faire des fautes d’orthographe.

Les fautes d’orthographe représentent un fameux potentiel de référencement.

J’effectue, en ce moment, une consultance bénévole auprès d’une ONG qui propose le parrainage d’enfants sous la forme de dons réguliers vers un enfant et sa communauté.

Un détour par le générateur de mots clés vaut son pesant de ranking. Figurez-vous que, tous les mois, 14.800 recherches sont effectuées sur le terme « parainage ». Avec un seul « r », et donc une faute d’orthographe ou de frappe, commise par 6% des personnes.



Source : Générateur de mots clés Google


L’ampleur du trafic sur la faute d’orthographe, dans ce cas, est telle qu’elle justifie une page ciblée sur cette mauvaise orthographe. Moyennant une explication polie (du genre : « Vous cherchez probablement ceci ») et une redirection proprement effectuée, nous reconduirions le visiteur vers la bonne orthographe.

Certains, comme partage.org ci-dessous, n’hésitent pas à positionner une publicité (un Adword) sur la faute d’orthographe. En toute conscience vraisemblablement, car l’URL présente une orthographe correcte.



Attention, cependant ! Il reste délicat d’associer votre nom de domaine, et donc votre image, à une faute d’orthographe. D’autant que Google est intelligent et présentera, à vos côtés, des résultats bien orthographiés(*).

Au final, je suis bien d’accord, c’est l’effet lecteur qui prime.


(*) D’ailleurs, quand j’y pense, l’intelligence de Google n’arrange pas le laxisme orthographique : puisque, contrairement à l’univers des encyclopédies papier, ici, même quand on fait une faute, on trouve ce qu’on cherche et on est récompensé.