Pendant ses dix premières années, le web a su séduire le grand public avec uniquement du texte et des images. Puis vint l’avènement de la vidéo avec YouTube. Puis vient la révolution des terminaux mobiles avec l’iPhone et l’iPad. Nous sommes maintenant en 2012 et plus personne ne veut lire à l’écran : trop fatigant, trop long, trop… ringard. Les articles et contenus sont maintenant mis de côté pour être lus sur un smartphone ou une tablette, ils sont synthétisés sous forme d’infographie ou sont tout simplement ignorés (on se contente de les tweeter si le titre est accrocheur ou des les épingler s’ils contiennent une photo sympa). Une réalité bien triste… Face à cette bien triste réalité, les navigateurs s’organisent en proposant un mode de lecture comme Safari ou des extensions comme Clearly ou Readability, mais je ne peux m’empêcher de penser que ce ne sont que des caches-misère.
Heureusement, certains éditeurs de site relèvent le défi en proposant une expérience de lecture à l’écran beaucoup plus agréable. Cette expérience est conditionnée par plusieurs choses :
- La mise en page (lignes pas trop larges, photos et vidéos bien intégrées, pas d’éléments parasitant l’attention) ;
- La densité d’information (avec un interlignage optimisé et des paragraphes pas trop longs) ;
- La typographie utilisée pour le texte, les titres et intertitres…
Je précise au passage que tout ceci est maintenant grandement facilité avec les navigateurs récents qui savent correctement afficher les CSS3 qui autorisent des choses tout à fait intéressantes : Vers une scénarisation des contenus textuels.
De mémoire, le premier éditeur à avoir fait volontairement un gros effort est Google avec son Think Quaterly :
Vous pourriez me dire que dans ce contexte précis les choses sont plus simples, car c’est un site dédié. Soit, mais laissez-moi alors vous parler de l’admiration que j’ai pour The Verge, un blog de gadgets qui propose les plus belles pages d’article que j’ai pu voir en 12 ans de carrière :
Le travail de composition et de mise en page sur ce site (pourtant à très gros tirage) est tout simplement splendide.
Toujours dans cette lignée, je vous engage vivement à explorer le très impressionnant Ridebook de Harley-Davidson :
Là encore, la mise en page a été particulièrement soignée pour intégrer de façon élégante les différentes photos et la vidéo. Un travail pas si compliqué si l’on utilise le bon outil (le tout étant d’exploiter un outil de gestion de contenu avec un mécanisme de gabarits de page suffisamment souple).
Sans partir dans des expérimentations techniques trop proches de ce que l’on trouve sur les tablettes (à l’image du Experimental Page Layout de Tympanus), je suis convaincu qu’il serait tout à fait possible d’appliquer les mêmes formules pour un site institutionnel ou même pour des pages produit.
Bon par contre tous les exemples cités utilisent du texte aligné à gauche, alors que je suis un grand défenseur du texte justifié. Mais ce n’est qu’une question de goût (et sûrement parce que j’ai un côté psychorigide). Et vous, quel alignement préférez-vous ?