Article posté par Isabelle Canivet le Mercredi 24 août 2011

Faciliter la lecture en ligne de vos contenus web

Lisibilité des pages sur le Web

Selon Jakob Nielsen, le spécialiste de l’ergonomie, 79 % des internautes ne lisent pas mot à mot sur Internet. Ils scannent la page à la recherche de mots, de phrases qui leur semblent importants (Jakob Nielsen: How Users Read on the Web).
Ce mode de lecture mis en lumière, il faut adapter l’écriture au média web et optimiser ses pages (lire sur l’optimisation de l’écriture: Une écriture adaptée au Web).
Selon une étude menée par John Morkes et Jakob Nielsen (Web-Reading Study), la lisibilité d’un texte augmente lorsque l’on respecte les 3 principes de base :

la concision
l’écriture objective et factuelle
la mise en relief

Pour guider l’internaute et faciliter sa lecture, une technique consiste à mettre du relief dans les pages.
Comment alors accrocher l’œil du lecteur ? Nous devons jouer sur différents paramètres :

Les titres (7 mots maximum)

Le chapeau (30 à 50 mots)
Les paragraphes (3 à 5 lignes)
La pyramide inversée
Le style du texte
Les contenus visuels
Les éléments de mise à jour
Le sentier de navigation ou le breadcrumb trail
Les liens

1. Les titres

Les titres sont généralement mis en évidence et se dégagent du texte.
Ils sont 5 fois plus lus.
Pour remplir son rôle de lisibilité, un titre doit :

S’insérer entre les tags HTML <Hn>titre</Hn>
Être informatif et incitatif tout en évitant le second degré
Être spécifique, soit contenir des mots clés relatifs à la page
Être court
Résumer le contenu du texte développé
Tenir sur une seule ligne
Correspondre à la requête des internautes sur les moteurs de recherche

Les types de titres :

Informatif, résumant ce qui va suivre
La rédaction d’un bon titre
Sous forme de question
Comment rédiger un bon titre ?
Sensationnel, jouant sur l’exclusivité
Une interview exclusive sur la visibilité d’un titre
Pratique
Les 10 points à respecter pour un bon titre
Emotionnel, jouant sur la proximité : il rassure
J’ai fait confiance à Action-redaction.com
Promotionnel
10 % de réduction sur l’article « Optimiser son contenu »
Incitatif
Pensez à vos titres !

2. Le chapeau (30 à 50 mots)

Le chapeau consiste en un court paragraphe de 30 à 50 mots qui résume le contenu du texte développé.
Il est situé entre le titre et le début de l’article.
L’internaute accède directement à la quintessence du message. Il peut rapidement identifier si le sujet traité l’intéresse et décide alors de poursuivre ou non sa lecture.
Un bon chapeau répond aux 5 W : who, what, where, when, why (qui, quoi, où, quand, pourquoi).
Comment mettre le chapeau en exergue ?

L’insérer dans un cadre de couleur différente
Le mettre en gras ou en italique
Le placer dans la partie supérieure de l’écran

3. Les paragraphes

L’insertion de paragraphes dans un texte facilite la lecture.
Pour remplir ce rôle, les paragraphes seront :

Courts
Aérés
Découpés par idée (une idée par paragraphe)
Logiques dans le raisonnement ou développement
De longueur variable facilitant ainsi le repérage

Les mots-clés sont mis en gras pour attirer le regard.
Le mot d’ordre est la concision : l’internaute est pressé, inutile de lui faire perdre son temps.
Évitons le langage creux et promotionnel : rien de plus irritant que de devoir filtrer tout le message hyperbolique afin d’accéder aux données proprement dites.

4. La pyramide inversée

La technique de la pyramide inversée consiste à placer les informations importantes en tête d’un texte et les développer de manière de plus en plus détaillée dans le corps de celui-ci. On débute ainsi par la conclusion.
On obtiendra donc :

Le titre : il résume le contenu qui suit.
Le chapeau : il contient l’essentiel de l’information en se basant sur les 5W.
Le corps du texte qui fournit des informations détaillées.
L’information la moins pertinente par rapport au sujet traité se retrouve en bas, mais elle a également toute son importance ; il peut s’agir d’un hyperlien, d’une adresse de contact, d’un call to action.

Pourquoi la pyramide inversée ?

Cette progression de l’information est un gain de temps pour l’internaute qui détermine rapidement si le sujet l’intéresse ou non.
Les crawlers indexent l’intégralité du contenu éditable d’une page, mais accordent plus de poids aux premières lignes.

5. Le style du texte

Écrire pour le web, c’est présenter une information to the point afin d’optimaliser la lecture.
Faciliter la lecture, c’est adopter un style simple qui met en pratique les points suivants :

Termes concrets (versus abstraits)
Absence de jargon
Phrases courtes (15 à 20 mots)
Style direct (versus tournure indirecte et voix passive)
Tournures simples
Interactivité (poser des questions, interpellation, incitation, voire humour)
Mots entiers (versus abréviations, acronymes)
Absence de fautes d’orthographe

6. Les contenus visuels

Les moteurs de recherche ne « lisent » pas l’information contenue dans les visuels (images, illustrations, photos, animations), mais ils indexent le texte décrivant ces éléments : alternative alt, légende, contexte, nom de fichier, titre de la page, etc. L’internaute scannent prioritairement les titres, les hyperliens et ensuite seulement les visuels, bien sûr, toujours en fonction de l’interface et du contenu.
Néanmoins, le recours à l’image se justifie dans certains cas (Sources : Jared Spool et Matthew Klee, « User Interface Engineering »), soit comme élément :

D’information (ex. : photos de produits)
De navigation (ex. : les cartes géographiques, les organigrammes interactifs)
De mise en page (ex. : séparateurs graphiques, icônes, arrondis)
D’ornementation (à utiliser avec précaution)

Ne mettez pas en place une infographie au détriment du contenu informatif… à vous de convaincre les créatifs : – )
Prenez aussi en compte le temps de chargement de l’image et tablez sur un temps de réponse très court.
Apprenez à optimiser vos images !

Le tag Alt de la balise IMG (images) :
Il permet d’afficher un texte alternatif en l’absence d’image : il est pris en compte par les moteurs de recherche. Le poids de cette balise est probablement très faible pour les moteurs de recherche, néanmoins, le recours à cette balise donne une plus grande accessibilité à vos pages, pensons notamment aux malvoyants ou aux personnes qui ont désactivé l’affichage des images !

Le tag Title de la balise IMG (images) :
Il donne un titre à l’image : les moteurs ne lui donne pas de poids proprement dit.

P.-S. : Comment afficher des images sur une page web ?
Les principaux attributs de la balise IMG sont les suivants :

SRC : Indique l’emplacement de l’image.
ALIGN : Spécifie l’alignement de l’image par rapport au texte adjacent. Il peut prendre les valeurs : TOP, MIDDLE, et BOTTOM.
ALT : Permet d’afficher un texte alternatif lorsque l’image ne s’affiche pas.
TITLE : Permet d’afficher une infobulle lors du survol de l’image par le curseur.
WIDTH : Permet de spécifier la largeur de l’image.
HEIGHT : Permet de spécifier la hauteur de l’image.

7. Les éléments de mise à jour

L’actualisation d’un site rassure l’internaute quant à la pertinence des informations qu’il consulte. La fréquence de mise à jour des pages est prise en compte par les moteurs de recherche dans son algorithme, il est également un des critères de fiabilité du contenu.
Que faut-il faire ?

Insérez une date sur vos pages.
Actualisez régulièrement les informations.
Créez de nouvelles pages de manière continue.

Astuce :
Donnez la possibilité aux internautes d’insérer des commentaires sur votre site, ce qui a plusieurs avantages :

Bénéficier d’une actualisation du site et augmenter « artificiellement » le renouvellement du contenu des pages web (très apprécié par les moteurs de recherche).
Ajouter des mots-clés supplémentaires dans les pages web et alimenter ainsi la Long Tail.
Ajouter de la crédibilité grâce à aux témoignages clients.

8. Le sentier de navigation ou le breadcrumb trail

Le sentier de navigation est le chemin cliquable qui s’affiche généralement en tête de page et permet à l’internaute de se repérer au niveau de la navigation ou de revenir en arrière en cliquant sur les liens.
L’utilisation du breadcrumb trail va croissante, selon Jacob Nielsen dans une étude datant d’avril 2007, Breadcrumb Navigation Increasingly Useful. Pourquoi ?

Il représente une aide pour l’utilisateur, de pair avec la navigation primaire et le plan du site : il permet à tout instant à l’utilisateur de se repérer, surtout lorsque la navigation primaire est confuse.
Il permet à l’internaute de rebrousser chemin à l’aide d’un clic.
Il ne prend qu’une seule ligne.
Il offre un contenu sémantique riche, doublé de liens et situé en tête de page, ce qui favorise une bonne interprétation de la part des moteurs de recherche.

Seul point négatif : certains internautes passent outre et ne voient pas cette aide à la navigation.

9. Les liens

Un bon lien répond aux critères suivants :

Il est clair, explicite et intelligible par tous.
Il intègre des mots-clés pertinents en rapport avec le contexte.
Les mots dans l’URL du lien sont séparés par le tiret (-) plutôt que l’underscore (_).
Son nombre est raisonnable : pas plus de 7 liens par niveau sous peine d’avoir une lecture morcelée et confuse.
Il contient en moyenne 4 mots.
Il est discriminant : pas de liens génériques (plus d’info, plus de détail, etc.).
Il est facilement reconnaissable : les liens non visités apparaissent en bleu et les liens visités, en rouge pourpre. Il est préférable d’utiliser des liens textes plutôt que des images (pour des raisons de référencement, d’accessibilité, de navigation, de chargement).
Il doit être légal… (lire à cet effet l’article de Maître Thibault Verbiest : Liens hypertextes : quels risques juridiques pour les opérateurs de sites Web ?).

UNE ECRITURE WEB

Optimiser ses pages Internet

L’écriture web répond aux exigences de concision et de clareté de l’internaute, mais elle permet également d’améliorer son positionnement sur les pages de résultats des moteurs de recherche. Il existe différentes zones réactives par rapport aux critères de pertinence des moteurs de recherche : quelles sont-elles et comment les optimiser pour augmenter son positionnement naturel ?

On ne lit pas les pages web de gauche à droite

La lecture occidentale se fait de gauche à droite. Et pourtant, les pages web ne sont pas forcément regardées de gauche à droite.
On recense beaucoup de théories sur la façon de lire des pages web. Certaines sont vraies sur des cas très précis. La plupart sont fausses. Voici un florilège des plus célèbres.

Lecture sur Internet

Les internautes lisent au mieux 28 % des mots. Ils scannent les pages web. Comment mettre en avant l’information ? Comment faciliter au maximum la lecture à l’écran ?

Améliorer la scannabilité des menus de navigation

Aligner le texte à gauche et non à droite, commencer par des mots-clés informatifs et différents, éviter l’utilisation abusive des majuscules, etc.
Présentation par J. Nielsen de quelques pistes pour favoriser la scannabilité des menus de navigation.

Laissez un commentaire

Services

Prochaines formations

Voir toutes les formations à venir

Livre

"Conseil, astuces et bonnes pratiques en matière de rédaction web et de référencement naturel"

« Bien rédiger pour le Web. Stratégie de contenu pour améliorer son référencement naturel », Eyrolles, 2e édition, 2011, 535 pages.
Auteure : Isabelle Canivet, préface et contribution d’Olivier Andrieu et de Sébastien Billard.

Contenu du livre

Consultez le site officiel du livre

Commandez le livre en ligne

Auteure : Isabelle Canivet