En 2000, le temps d’attention moyen d’un visiteur sur Internet était de 12 secondes. Il est passé à 8 secondes en 2016. Avant qu’il n’arrive à 4 secondes d’ici 2030, apprenez à captiver vos visiteurs au plus vite pour les garder sur votre site Internet.
Ce genre de chiffres peu paraître un peu absurde, je les mentionnais d’ailleurs déjà dans mon comic précédent. Après tout ce n’est pas une compétition olympique! Mais il faut bien les avoir en tête, les utilisateurs ne vous feront pas de faveurs particulière. S’ils ne trouvent pas immédiatement ce dont ils ont besoin où si votre site n’est pas accrocheur, ils s’en iront.
Avec le tout Internet, les emails, smartphones, notifications, etc. notre attention est systématiquement sollicitée. Du coup, nous en donnons de moins en moins. Et il suffit de très peu de chose pour qu’une visite sur votre site Internet se solde par un départ prématuré.
Voilà donc 5 conseils qui peuvent vous aider à éviter ça.
NB : chaque exemple de site illustrant un conseil a été réalisé par mes soins.
1. Soyez clair et pratique
Tout site devrait pouvoir se targuer d’être clair et pratique. Mais surtout il faut que le visiteur dispose des informations importantes en un coup d’œil dès son arrivée.
Que ça soit votre secteur d’activité, vos informations de contact, vos horaires, ce qui vous défini (slogan, image, etc.), votre identité : en un regard l’utilisateur doit pouvoir saisir les éléments capitaux de votre site Internet.
Le menu quant à lui doit guider le visiteur, pas le perdre. Alors utilisez des sous-menu pour éviter d’afficher trop d’options, proposez un plan du site si celui-ci est complexe et essayez d’avoir des appellations claires.
Cet exemple ne contient que les infos importantes : contact, horaires, plan du site et un menu, très chargé, limité à 4 sections principales distinctes. On peut arguer qu’il est parfois difficile de savoir ce qui est Officiel ou Pratique, mais l’utilisateur voit immédiatement où il doit se diriger quoi qu’il arrive.
2. Engagez le visiteur à l’aide d’un appel à l’action
Au moins 2 termes à la mode dans ce titre : engager le visiteur et appel à l’action. Pourtant ça se vérifie systématiquement : il faut donner envie au visiteur de s’engager. Qu’il sache ce qu’il fait ou non, que cette action soit celle qu’il recherchait ou non, lui faire accomplir une action l’engage dans l’expérience web que vous cherchez à donner.
Chaque site peut disposer d’un bouton d’appel à l’action. Voilà quelques exemples :
– Nous contacter
– Demander un devis
– Afficher nos références
– S’inscrire
Si vous décidez d’utiliser des boutons d’actions, n’en abusez pas et essayez de garder une consistance dans les couleurs. Essayez également de toujours garder le bouton le plus important visible pour l’utilisateur : ne ratez pas une occasion de le faire cliquer !
Dans cet exemple on a à peu prêt tout : 2 boutons d’actions bien en évidence sur la page d’accueil, un code couleur assez clair (vert pour nouveau et bleu pour existant), une flèche pour renforcer la proposition d’action. De plus, si vous descendez l’ascenseur, le bouton Essai gratuit reste constamment affiché en haut à droite, avec le même code couleur.
3. Ajoutez des animations
On en voit un peu partout aujourd’hui. Il faut dire que l’ajout d’animations est devenu simplissime aujourd’hui. Avec l’évolution du CSS et la puissance du Javascript, il n’y a plus de raisons de se priver.
Comme toujours il faut savoir les utiliser et ne pas en abuser non plus. Il faut qu’elles aient une logique et qu’elles fonctionnent avec votre ligne graphique.
Mais il y a un sentiment de fluidité hérité des smartphones dans l’utilisation des animations. L’iPhone avait introduit un concept passionnant : le chargement d’une vue se faisait tout en douceur durant une animation de transition. Le chargement avait beau être plus long que sur un téléphone classique, l’expérience utilisateur s’en voyait pourtant améliorée.
Assez paradoxale, mais aujourd’hui les animations sont partout, ne passez pas à côté !
Tout mon site est concentré autour de diverses animations. Sur l’accueil, en plus d’une couleur très vive, tout apparaît de manière animée. J’incite ensuite les visiteurs à scroller pour découvrir la suite, grâce au personnage sur la gauche qui gigote sa main.
Ce mouvement les embarque directement dans mon univers et donne l’impulsion de suivre ce mouvement en consultant le reste du site. Tout le reste est à l’avenant : gifs animés un peu partout, affichage des éléments lors du scroll, etc.
Les animations utilisées enrichissent l’expérience, donne un sentiment de fluidité générale et racontent une histoire !
4. Assurez-vous que vos pages se chargent rapidement
J’ai déjà parlé de l’importance d’adapter son site Internet au mobile. Mais il est tout aussi impératif que celui-ci se charge rapidement sur tous les appareils. Selon les statistiques, au delà d’un temps de chargement de 3 secondes, vous perdez plus d’un quart de votre audience.
Même si certaines parties de votre site Internet peuvent demander du temps à se charger (grande image, vidéo, etc.), il est important que le reste du contenu soit déjà disponible et que le site puisse être navigué au plus vite.
Google propose désormais une interface pour tester la qualité du rendu de votre site Internet sur mobile. Ainsi que sa vitesse de chargement et d’accès. Cette interface, appelée Test My Site, vous donne ensuite un rapport détaillé avec les actions à entreprendre le cas échéant.
Douwat est un agenda en ligne collaboratif. Ses deux tâches principales sont de permettre d’ajouter des événements et de les rechercher. Lorsqu’on accède au site, toutes ces options sont disponibles immédiatement. En descendant on peut voir les prochains événements sponsorisés. Ceux-ci s’affichent alors au fur et à mesure du scroll, pour éviter un chargement trop long lors de l’accès initial à la page.
5. Utilisez un visuel percutant
Conseil un peu bateau j’en conviens. Mais j’aimerais émettre une nuance : visuel accrocheur ne veut pas forcément dire beau. Dans le fond, un site très moche peut également captiver un utilisateur. Ce n’est bien sûr pas mon conseil que de réaliser un site affreux, mais l’idée est de donner un effet saisissant.
La mode aujourd’hui est à la grande image ou vidéo, les couleurs vives, les grandes polices, etc. Bien utilisé et avec du contenu de qualité (attention aux photos pixellisées !) ce genre de visuel fait des merveilles. Il ne faut pas résumer votre site Internet à ça, une grosse image qui en jette, mais il faut mettre toutes les cartes de votre côté pour le premier regard du visiteur.
Ensuite à vous de contrebalancer avec d’autres couleurs / images par la suite. La page d’accueil doit aussi donner le ton du site, son ambiance.
Une grande image de nature, les tons verts, un grand logo et un grand titre blanc qui contrastent avec le fond. Si vous visitez le reste du site vous retrouverez les mêmes éléments : la nature, le vert, l’ambiance zen, etc. À peu prêt tout est là avec, en plus, des couleurs assez puissantes pour accrocher le visiteur.
Conclusion
Un utilisateur ne va pas vous donner beaucoup de droit à l’erreur à la visite de votre site Internet. Pas question de râler sur le visiteur x ou y qui n’a pas su donner une chance à votre site web, nous sommes tous pareil. Alors dans ce marasme, il faut se différencier, ou au moins, attirer l’œil. Ça ne passe pas que par un joli visuel, c’est une série d’astuces qu’on utilise pour raconter au plus vite son histoire au visiteur.
Ces 5 conseils n’ont pas pour but d’être exhaustifs et ils ne sont pas un remède miracle à l’inattention du visiteur moyen, mais appliqués correctement et consciencieusement c’est un bon début !