Comment optimiser la lisibilité de votre site en 7 points

3. Un bon interligne est indispensable

En complément de la taille du texte et de la police, il faut aussi prendre en compte l’interligne pour optimiser la lisibilité des contenus. L’interligne correspond à l’espace se situant entre les lignes. En CSS, on peut le gérer avec la propriété line-height.

Si l’interligne est trop faible, les textes seront trop rapprochés et la lecture sera difficile. Dans le cas contraire, les lignes seront trop éloignées et le résultat sera le même. Voyez plutôt :

1. L’interligne est faible. La lecture est complexe
2. L’interligne est important. Il est difficile d’aller d’une ligne à l’autre
3. L’interligne est optimisé. La lecture est aisée !

Pour définir un interligne optimal, utilisez une valeur proche de 1.6em (adaptez ce nombre à votre situation)

Si vous désirez indiquer une valeur en pixels, multipliez la taille de la police par 1,6. Par exemple, 18 pixels multiplié par 1,6 nous donne 28,8 pixels. Vous pouvez utiliser 28 ou 29 selon votre convenance.

4. Du contraste est essentiel

Si on reprend la comparaison entre le thème d’origine de WP Marmite et le thème relooké au point 2, on constate que la couleur du texte n’est plus la même.

En effet, le gris utilisé initialement (777) ne ressortait que très peu par rapport au gris foncé employé actuellement (333). Pour vous aider à trouver un bon contraste entre votre couleur d’arrière-plan et votre couleur de texte, vous pouvez utiliser cet outil.

Note : Entrez le code couleur de l’arrière-plan à gauche et celui de votre police à droite. L’idéal est d’avoir un résultat oscillant entre 9 et 15.

5. Servez-vous des images

Les images permettent de faire des pauses dans la lecture d’un contenu. Il faut savoir en insérer lorsque c’est pertinent pour rendre vos publications plus digestes.

N’insérez pas des images qui n’ont aucun rapport avec votre texte. Elles doivent venir renforcer le message que vous voulez transmettre.

Une petite astuce consiste à insérer une image sur la droite d’un paragraphe pour faire en sorte que la longueur de ses lignes soient réduites momentanément. Cela permet de rendre un texte plus simple à lire. Regardez ce que cela peut donner :

Note : Pour trouver des images libres de droit, vous pouvez aller sur Pixabay.

6. Utilisez la mise en forme

Une autre manière d’améliorer la lisibilité du contenu est d’inclure du texte en gras et en italique pour mettre certaines phrases en avant.

Cette technique permet également de rendre un contenu plus « scannable » pour les lecteurs

Pour aller plus loin, vous pouvez utiliser la citation (balise blockquote). Ce format doit être mis en avant d’une manière spécifique pour introduire une rupture dans l’enchaînement des paragraphes (comme le font les images). Plusieurs styles de citation existent. Le thème que vous utilisez en possède certainement un mais vous pouvez le modifier pour le mettre plus en avant.

Un autre moyen de rendre son contenu plus lisible est d’utiliser des listes. Que ce soit des listes désordonnées (balise ul) ou ordonnées (balise ol), elles permettent de mieux structurer l’information qu’une longue énumération. C’est plus visuel :

Au quotidien, j’essaie d’en utiliser le plus possible pour simplifier la vie de personnes qui prennent le temps de me lire. Elles transmettent l’information beaucoup plus rapidement.

7. Conservez des paragraphes courts

Vous êtes-vous déjà demandé pourquoi la presse, les contenus des journaux étaient structurés en colonnes étroites ? Pour faciliter la lecture bien sûr.

Des études ont montré que lorsque la longueur d’un contenu est trop longue, nous perdons plus facilement le fil de la lecture. Il va de soi que l’on ne peut pas reproduire la mise en page des journaux sur le web, sinon la largeur du contenu serait de 200 ou 300 pixels. Cela qui serait ridicule pour les écrans dont nous diposons aujourd’hui.

Pour conserver des lignes courtes, l’idéal est qu’elles soient constituées de 70 à 100 caractères. Ce qui équivaut à une largeur de contenu de 550 à 650 pixels (cela peut varier selon la taille de la police).

Maintenant que nous avons parlé de la largeur des paragraphes, parlons de leur longueur. En lisant cet article, vous constaterez qu’il n’est pas constitué de « pavés de textes ». C’est à dire des paragraphes qui font plusieurs dizaines de lignes. On retrouve souvent ce genre de mise en page dans les contrats ou les conditions générales de ventes.

Autant vous le dire, ce n’est pas un hasard. Cela a pour but de rendre la lecture moins aisée. Étant donné que ce n’est pas ce que vous désirez sur votre site, veillez à restreindre la taille de vos paragraphes.

De plus, essayez d’adopter un ton conversationnel dans vos publications lorsque cela est possible (par exemple sur un blog). Cela contribuera à créer des liens avec les lecteurs et à les convertir.

Note : Pensez également à ajouter un marge sous vos paragraphes afin de bien les espacer.

Rendre son contenu lisible n’est pas une tâche aisée. Néanmoins, une fois que l’on a pris le temps d’optimiser ses contenus, cela nous bénéficiera sur le long terme.

Au delà de la présentation de vos contenus, il faut également prendre de bonnes habitudes en terme de rédaction web afin de structurer correctement vos publications. Si plus de personnes restent sur vos pages, les chances qu’elles passent à l’action sur votre site augmenteront incontestablement.

Si cet article vous a plu, nous vous invitons à découvrir notre agence de Webdesign et à télécharger notre livre blanc « Identité Visuelle : rendez votre marque mémorable et reconnaissable »