Pages transitionnelles et navigation subliminale
Photo Sarah Corpard
L’internaute ne lira pas vos pages. L’internaute ne cherchera pas la manière la plus efficace d’utiliser votre site. L’internaute est encore plus fainéant que vous ne l’imaginez.
Principe du « Satisficing »
Arrivé sur votre site, l’utilisateur survolera la page de manière fragmentaire en fixant son œil sur les éléments les plus percutants et les moins complexes (photos, titres) comme lorsque l’on feuillette un magazine.
Votre internaute cliquera sur le premier élément qui lui semble plus ou moins lié à ce qu’il recherche sans se demander s’il existe un moyen plus efficace d’y accéder.
C’est le principe du Satisficing (un mix entre satisfaisant et suffisant) : un processus de décision qui nous fait opter pour une solution rapide et approximative plutôt qu’une solution optimale mais longue à trouver.
L’objectif pour un wedesigner n’est donc pas de proposer d’emblée des pages riches en contenus mais des pages rapides à scanner et des liens faciles à cliquer.
Aujourd’hui justement la tendance est aux pages d’atterrissage minimalistes (pensez à la page d’atterrissage de Firefox). C’est une règle bête comme chou (aussi appelé la loi de Hick-Hyman) : moins on a d’éléments dans une page, moins on passe du temps à trouver ce qui nous intéresse.
Une page d’atterrissage doit donc être une page sobre et mettre en avant un objectif prioritaire.
Smashing Magazine nous donne ici quelques exemples de sites minimalistes
Page d’accueil www.reinvigorate.net : un grand visuel, un texte ultra condensé, quelques objectifs secondaires et surtout beaucoup de zones de respiration.
« Scannabilité » ambiante
Si le trop plein de possibilités est généralement contre-productif (signe de complexité plutôt que de richesse, paralysie du choix), certaines entreprises se disent néanmoins qu’elles ont besoin de fournir un aperçu global de leur offre et de leurs produits.
Tant il est vrai que l’impression de volume peut être un atout (il y a forcément quelque chose qui peut m’intéresser), il ne faut pas confondre abondance avec sentiment d’abondance. Jetez un œil au site de La Redoute : un grand visuel, deux-trois focus suffisent pour exprimer la nature e-commerce et la profusion de produits :
Notez également la manière dont le site utilise une interface graphique sobre et épurée pour véhiculer une image “haut de gamme”.
Vos pages atterrissage doivent donc être aussi minimalistes que possible et donner une impression de «scannabilité ambiante» permettant de mâcher le travail d’analyse visuel de la page. Ce principe se traduit par 3 concepts-clés :
- hiérarchisation de l’information (titres clairs et de grande taille)
- présence d’espace vide autour des zones à valoriser
- incitation à l’action (boutons, liens & champs affordants)
Ne perdez pas de vue qu’une page d’atterrissage bien conçue est une page qui sait tout faire : accueillir, persuader et orienter.
Serge Roukine, Améliorer ses taux de conversion web, Eyrolles, 162-163
La pyramide inversée : du synthétique vers l’exhaustif
Suivant le principe de la pyramide inversée, la navigation transversale (de page en page) doit être pensée pour guider vos visiteurs vers vos contenus-clés. L’objectif étant de favoriser la progressivité, il est important de ne pas proposer le même type d’information selon les différentes étapes de la navigation.
Le meilleur exemple de mise en forme selon le principe de la pyramide inversée est la couverture des journaux papier. Ceux-ci présentent les infos sous forme synthétique et incitative (titres courts et percutants, visuels accrocheurs, résumés incitatifs) afin que le lecteur puisse balayer les news d’un œil distant avant d’entrer dans le vif du sujet.
C’est ce que Jakob Nielsen nomme «le grignotage d’information» : le lecteur scanne la page, soit pour trouver rapidement ce qu’il recherche, soit dans l’attente de tomber sur quelque chose qui l’interpelle. Une fois l’information identifiée, il peut alors consulter l’article ou la fiche dédiée.
Navigation subliminale
Plus qu’un sommaire, la page d’accueil – qui est le pendant numérique de la couverture d’un journal papier – a également cette mission de favoriser la lecture de type balayage. Elle doit faciliter le scan visuel et répondre aux interrogations à peine conscientes de l’internaute (qu’est-ce que fait le site ? que puis-je trouver d’intéressant ? par où commencer ?). De la même manière, les landing pages ont également ce rôle d’orientation et d’organisation.
Qu’un internaute arrive sur le site n’est pas un but en soit : il est nécessaire qu’il s’y engage ou accomplisse une action. L’objectif étant de guider les internautes vers les contenus-clés, il n’est donc pas forcément judicieux de lui faire passer trop de temps sur la page atterrissage, à moins bien sûr que celle-ci soit une page transactionnelle (laquelle intègre directement un formulaire de contact ou un bouton d’achat par exemple).
La page du site de Sciencescom est typique d’une page transitionnelle efficace conçue dans une logique utilisateur et orientée transformation. En un clin d’œil les différentes cibles du site y trouvent leur compte (étudiants, entreprises, etc.) sans avoir à chercher.
L’étudiant (l’utilisateur référent du site) voit clairement ce que l’école propose et celle-ci lui tend la main pour qu’il aille consulter la suite. Une manière efficace pour l’école d’orienter la navigation («viens voir mes formations en communication») tout en réduisant chez l’internaute la charge cognitive (il n’a pas à réfléchir) et la charge de travail (il n’a pas à chercher). On peut quasiment parler de navigation subliminale : comment faire gagner du temps à l’internaute tout en l’attirant vers ce qui nous intéresse (et l’intéresse du même coup !).
L’efficacité d’une page transitionnelle réside essentiellement dans la qualité des liens : ceux-ci doivent être explicites visuellement (ça doit ressembler à un lien) et sémantiquement (où ce lien mène-t-il ?).
Proposition de page transitionnelle pour le site de l’ESSCA (non retenue) : des liens clairs, des titres explicites et de grande taille et un minimum de texte
D’autres pages ont également cette fonction d’orientation : les pages de gammes par exemple et les pages de premier niveau. Leur but est le même : donner un aperçu rapide de leur contenu et fournir des clés d’accès rapide.
Afin de faciliter l’exploration des contenus, une seconde étape semi-transitionnelle pourrait être proposée aux internautes. Cette page apporterait des informations généralistes et orienterait les utilisateurs vers des contenus plus spécifiques.
Les micro-contenus
Afin de favoriser l’exploration des contenus, la technique de la pyramide inversée appliquée au web consiste également à intégrer des micro-contenus dans lesquels l’internaute trouvera l’essence de l’information. Ces micro-contenus répondent à plusieurs objectifs :
- Permettre aux internautes de repérer rapidement l’ensemble des contenus
- Provoquer l’intérêt (effet de teasing)
- Développer le référentiel lexical (et la diversité des expressions-clés par la même occasion…)
- Développer le maillage interne
- Contextualiser les contenus
Ci-dessous quelques exemples de micro-contenus proposés pour les pages de contenu du site Picot :
Situés à la fin des pages de contenu, ces focus permettent de mettre en avant quelques produits avec un court texte de présentation et des boutons d’action explicites
Pages semi transitionnelles
Les pages de contenu éditorial arrivent en général trop prématurément dans le parcours d’utilisation des internautes. Bien que le contenu soit parfaitement structuré, la masse d’information peut souvent s’avérer rédhibitoire (trop longues verticalement). Au mieux on met la page en marque-pages dans un onglet « à lire quand j’aurai 10 minutes » mais c’est tout. (C’est d’ailleurs peut-être le cas pour cet article mais pour le coup c’est une question de flemme).
L’internaute ne lisant généralement que le haut des pages, les derniers contenus peuvent être négligés. Il est donc plus judicieux de découper ce type de pages en plusieurs pages brèves et monothématiques (comme sur le Journal du Net), exemple :
1. Page transitionnelle – 2. Page semi-transitionnelle – 3. Page de contenu : le fait de découper le contenu en 3 pages brèves permet à l’internaute d’accéder plus rapidement à l’information et de rendre le contenu plus “digeste”
Conclusion
Les pages d’atterrissage doivent donner envie d’aller plus loin. Pensez-donc en termes de captation et de stimulation. Ne dévoilez pas tout d’un coup et ne parlez pas trop de vous.
Pensez votre page d’atterrissage comme un premier contact amoureux : vous ne dites pas le même type de chose au premier rendez-vous et au second, le but étant justement qu’il y en ait un second…
