rechercher sur ergolab

s'abonner au fil rss
newsletter

Entrez votre adresse e-mail pour être informé de l'ajout de nouveau contenu :

 

» En savoir plus

15 Novembre 2003

Faciliter la lecture d’informations
sur le web

TAGS : Accessibilité visuelle, Ecriture web, Lisibilité

accueil > articles > principes > Faciliter la lecture d’informations sur le web

« Liste des articles


Introduction
1. Lisibilité visuelle vs lisibilité cognitive
2. Lisibilité visuelle : optimiser la perception du texte à l'écran
3. Lisibilité cognitive : optimiser la lecture à l'écran
Conclusion
Pour en savoir plus...

Introduction

Ecrire pour le web c'est d'abord écrire pour être lu à l'écran. Cet article exposera donc brièvement les enjeux de la prise en compte des caractéristiques perceptives de l'être humain.

Au-delà de ces considérations concernant le confort perceptif, le contenu doit être adapté au média. En effet, on n'écrit pas du texte pour un site web comme du texte destiné à un support papier. Nous présenterons donc plusieurs techniques permettant d'adapter un texte à la façon dont les utilisateurs lisent à l'écran.

1. Lisibilité visuelle vs lisibilité cognitive

Deux dimensions composent le critère de lisibilité. On doit distinguer la lisibilité matérielle de la lisibilité cognitive d'un texte.

En anglais, deux adjectifs différents sont employés pour désigner ces dimensions :
- on parle de "legibility" pour désigner la lisibilité matérielle, visuelle d'un texte. On réfère donc au niveau perceptif
- on parle de "readability" pour désigner la lisibilité cognitive, la façon dont un texte peut être intégré au niveau cognitif et compris par l'utilisateur.

On doit optimiser ces deux aspects pour faciliter la lecture d'informations sur le web. On se situe donc dans l'étude de deux pôles complètement différents :
- un pôle physique
- un pôle conceptuel

2. Lisibilité visuelle : optimiser la perception du texte à l'écran

L'interface par laquelle l'utilisateur perçoit les informations est l'écran. Lire des informations sur le web, c'est donc lire via ce support physique. Malheureusement, ce n'est pas le support le plus indiqué pour l'activité de lecture. Ces difficultés ne sont d'ailleurs pas spécifiques au web mais à toute activité de lecture à l'écran.

Tout d'abord, nous sommes habitués à lire sur papier. On a ainsi acquis des réflexes de lecture qui sont difficilement transposables lors de la lecture sur écran. Ensuite, nos caractéristiques physiologiques ne nous permettent pas de lire sur écran comme sur papier.

Déchiffrer les caractères et les assembler est en général plus lent et plus fatiguant sur écran. La lecture sur écran serait plus lente de 25% comparativement à la lecture papier.
De plus, une lecture prolongée ou répétée sur écran est susceptible d'entraîner des problèmes de fatigue visuelle, dus en grande partie à une sollicitation importante de l'œil.

La sensation de confort visuel et les conditions de vision optimale dépendent étroitement de la répartition des contrastes des luminances.
On doit donc optimiser les caractéristiques perceptives des informations afin d'en faciliter la lecture.

2.1. Couleurs et contrastes

Pour améliorer la vitesse de perception et le confort visuel, on doit optimiser les couleurs employées.

La vitesse de perception se caractérise par le temps qui s'écoule entre la présentation d'un objet au sujet et la perception visuelle de cet objet. La perception est d'autant plus rapide que les différences de luminances entre l'objet et l'ambiance sont plus marquées.

On peut globalement dire d'un point de vue ergonomique que le contraste positif (fond clair / caractères sombres) est plus adéquat que le contraste négatif (fond sombre / caractères clairs).

A éclairement égal, le diamètre pupillaire est plus petit en contraste positif qu'en contraste négatif. En conséquence, la focalisation sur l'écran est plus facile pour l'œil en contraste positif car la profondeur du champ augmente. Le contraste positif s'avère donc moins fatigant pour la vision que le contraste négatif.

Les performances dans un certain nombre de tâches (vérification de chiffres, recherche d'informations) sont meilleures sur des écrans à fond clair que sur des écrans à fond sombre.

Enfin, la sensation de confort visuel est en grande partie déterminée par le contraste des mots avec le fond. L'acuité visuelle est meilleure lorsque le caractère à observer est sombre sur fond clair. On recommande donc de favoriser les contrastes positifs, c'est à dire d'utiliser un fond clair avec des caractères foncés :




Exemple d'un contraste positif (caractère noir sur fond gris clair) et de deux contrastes négatifs (gris clair sur noir et gris foncé sur noir).

Contrastes positif et négatifs



Il est toutefois à noter qu'un contraste de luminances trop élevé peut provoquer un éblouissement gênant pour l'opérateur.

En ce qui concerne les combinaisons de couleurs caractère / fond, on évitera les couleurs complémentaires. Pour plus de précisions sur les combinaisons recommandées, le lecteur pourra consulter le guide édité par l'INRS (voir les lectures complémentaires).

2.2. Caractères

La lisibilité dépend non seulement du contraste caractère / fond mais aussi de paramètres propres aux caractères :
- taille des caractères affichés (même si cette taille doit être pondérée par la distance entre l'œil de l'utilisateur et l'écran, la taille du caractère peut d'ailleurs compenser un mauvais contraste)
- espacement des lettres
- espacement des mots et des lignes
- typographie

Pour plus de précisions sur les recommandations sur les caractères, le lecteur pourra encore une fois se reporter au guide de l'INRS (voir les lectures complémentaires).

3. Lisibilité cognitive : optimiser la lecture à l'écran

On peut parler de lisibilité cognitive pour représenter l'effort cognitif exigé par la lecture du contenu d'une page web. Par optimiser la lecture, on entend faciliter la distinction des groupes d'informations et de leur rôle, mais aussi faciliter la compréhension du contenu.

Toutes ces dimensions correspondent à ce que Jonassen a appelé la "technologie textuelle", c'est à dire tous les moyens permettant de structurer les textes pour faciliter leur appréhension et leur compréhension.

3.1. Un format rédactionnel adapté à la lecture sur le web

La majorité des utilisateurs (80% selon une étude de Nielsen & Morkes, cf. référence dans les lectures complémentaires) ne lisent pas les contenus des sites Internet. Selon les experts, ils "scannent", "survolent", "explorent"… Quoiqu'il en soit, les caractéristiques du web font qu'on ne lit pas mot à mot.

La recherche d'information sur Internet peut être considérée comme la recherche d'un signal parmi du bruit :



Parmi 16 mots, 15 libellés 'FAUX' et 1 'FEUX'. Ce dernier mot est difficile à distinguer dans la masse des 15 autres.

Cherchez l'intrus


Il s'agit de décider rapidement si le contenu de la page web est susceptible de nous intéresser ou non. L'objectif est de fournir de l'information vite et bien. Il est donc essentiel que l'utilisateur comprenne instantanément si le contenu à l'écran correspond à l'information qu'il recherchait.


On doit présenter les informations dans un format adapté à cette lecture particulière. On essaiera donc de suivre les recommandations suivantes :

- mettre en valeur les informations importantes, les mots-clés :
- utiliser des enrichissements typographiques tels que le gras ou l'italique (prendre en compte que le style italique est moins lisible qu'un style classique)



Parmi 16 mots, 15 libellés 'FAUX' et 1 'FEUX'. Ce dernier est mis en forme en gras, ce qui permet de le faire ressortir du bloc de 16 mots.

Cherchez l'intrus
(le passage en gras rend le signal plus saillant)



- Jouer sur les tailles de caractères

- Bien distinguer les mots-clés des liens (ne pas utiliser le même format)

- Ecrire en minuscules plutôt qu'en majuscules (les mots écrits en lettres minuscules sont plus faciles à lire que ceux écrits en lettres capitales). On peut toutefois se permettre d'écrire en majuscules pour des informations brèves (intitulé d'un bouton, titre de page, titre de rubrique, etc.).

- Fournir un sommaire pour les longs textes

- Séparer le texte en parties significatives, leur attribuer des titres et sous-titres

- Catégoriser les informations et faire ressortir cette catégorisation, soit par la localisation physique des éléments (on sépare ce qui ne se ressemble pas), soit par le format (on présente dans un format différent les éléments qui sont différents) :



Parmi 16 mots, 15 libellés 'FAUX' et 1 'FEUX'. Ce dernier est séparé physiquement des autres mots (il est placé en bas), ce qui permet de le distinguer des autres mots.

Cherchez l'intrus
(les bruits et le signal sont séparés
physiquement, ce qui facilite la détection du signal)



- Fournir une idée par paragraphe (on part du principe que les utilisateurs ne lisent en général pas les paragraphes en entier mais essaient d'en extraire l'idée principale)

- Inverser les règles de style classiques (on préconise de commencer par la conclusion)

- Diviser la quantité de mots par deux par rapport à un texte classique : "Every sentence, every phrase, every word has to fight for its life." (Crawford Kilian, Writing for the Web)



Parmi 8 mots, 7 libellés 'FAUX' et 1 'FEUX'. Ce dernier est plus facile à distinguer que dans le premier exemple, du fait d'un nombre moins important de mots au total.

Cherchez l'intrus
(la réduction du nombre de mots de 50% permet
de trouver plus facilement le signal parmi les bruits)



Nous verrons par la suite que cette règle ne doit pas être appliquée de façon rigide. Elle est valable pour les textes de présentation, d'accroche, etc. mais son application à des textes de contenu est plus discutable.

- Employer la voix active

- Des lignes de texte ni trop longues ni trop courtes, environ 80 caractères

3.2. Comment présenter de longs textes ?


» Le droit d'écrire long

La recherche d'informations est une des activités principales sur le web. Fournir une information de qualité nécessite parfois d'exposer des textes longs.

Cela n'a pas forcément pour conséquence de pénaliser l'utilisateur. En effet, on doit se poser la question de la pertinence de l'information. Si l'information présentée est par définition du contenu (article, mode d'emploi, texte officiel …), on peut se permettre qu'il soit long.

Tout doit être contextualisé selon la fonction des textes : les textes de présentation, supportant la navigation et la compréhension du contenu du site (ou plus spécifiquement de la page) doivent être courts. Les textes de contenu, recherchés par les utilisateurs, peuvent être longs. Cela peut même devenir un gage de qualité.

Les études du Poynter Institute (voir les lectures complémentaires) ont montré que dès que le contenu recherché est identifié, le processus de lecture n'est plus de type "scan" et le parcours oculaire revient à la normale. 75% du texte est alors lu et non parcouru.


» Fournir un format imprimable

Si le contenu présenté est long, il est alors indispensable de fournir à l'utilisateur des moyens de contourner la lecture à l'écran, par exemple en lui proposant une version imprimable ou un fichier pdf à télécharger.

Il reste à déterminer le seuil au-delà duquel on considère que le texte est long... Si on laisse le texte entier disponible à l'écran, on peut entreprendre un travail de réécriture du contenu pour l'abréger. Mais surtout, on doit tout faire pour faciliter la lecture de ce texte à l'écran.


» Fournir un sommaire

Ce sommaire peut se présenter sous forme de liens hypertexte internes (ancres) ou non. En effet, un défaut de ce type de lien est de perturber l'utilisateur dans sa représentation du comportement du système.


Un lien hypertexte est classiquement un lien qui dirige vers une autre page. L'utilisation de liens pour un sommaire, menant vers des endroits précis dans la même page, peut paraître contradictoire. Il s'agit donc de signifier clairement à l'utilisateur la nature de ces liens (par exemple en les faisant précéder du titre "sommaire", en décrivant explicitement la procédure à suivre pour utiliser ce type de liens, ou en expliquant leur fonctionnement).

On peut se permettre d'espérer un apprentissage de la part de l'utilisateur, qui sera peut être surpris la première fois mais comprendra vite le fonctionnement de ce type de liens. On peut l'aider dans cet apprentissage en représentant les ancres dans un format différent de tous les autres liens du site. On facilite ainsi la première étape de l'apprentissage, à savoir la reconnaissance de ce qui fait la différence de ces liens.


» Découper le texte en plusieurs pages : discutable

C. Bastien indique que "Les internautes ne semblent pas aimer le défilement des pages longues" (voir l'article de lergonome.org dans les lectures complémentaires). J. Nielsen a d'ailleurs exposé la même idée, ainsi que de nombreux experts en ergonomie web.

Ce principe répandu est une des raisons pour lesquelles les longs contenus sont souvent scindés en plusieurs pages. Découper les textes en écrans successifs semble pourtant présenter plus d'inconvénients que d'avantages.

Certes, a priori, il est plus facile de lire des pages courtes, sans avoir besoin de scroller pour lire la suite d'un texte. Cependant, la nature même du web fait que le découpage d'un texte en plusieurs pages nécessite le chargement successif de ces pages. Cette façon de présenter l'information nuit à une lecture continue du texte, puisque normalement, l'oeil passe inconsciemment d'une ligne à l'autre de manière non séquentielle.

De plus, la lecture est une activité cognitive très contextuelle. On a souvent besoin de "remonter" de quelques paragraphes pour comprendre ce que nous sommes en train de lire. En effet, on ne lit pas des mots isolés, mais on met en relation les mots et phrases les uns avec les autres.

Un autre problème de découper un texte en plusieurs écrans est qu'il est impossible de déterminer facilement la taille d'un "écran" de texte chez l'utilisateur. Cet aspect est lié à la nature même du web. Chaque internaute voit un site selon sa propre configuration ; cette configuration est un croisement entre la taille de son écran, sa résolution, le système d'exploitation de son ordinateur, le fait qu'il navigue avec une barre latérale (favoris, historique...) ou non, etc.

Les utilisateurs, aidés par les technologies matérielles (et notamment l'apparition de la "roulette" sur les souris), ont appris à scroller. Les longues pages ne sont donc pas forcément un défaut d'une interface. Leur existence doit cependant être justifiée, et les éléments essentiels présentés en haut de page.


» Fournir des repères de positionnement vertical

Un des inconvénients d'un long texte est que lors de la lecture d'une longue page verticale (haute de plusieurs écrans), on a tendance à perdre sa position verticale dans la page.

On peut donc recommander de fournir des repères de positionnement vertical, qui seront des repères visuels forts dans le texte. Ces repères peuvent être des images, mais aussi les liens hypertextes à l'intérieur du texte, les enrichissements typographiques, les titres ou un découpage en paragraphes. On doit alors s'intéresser aux moyens de mise en valeur des informations importantes, évoqués précédemment.

Toutes ces méthodes augmentent la lisibilité cognitive et sont un support au repérage dans la page.

3.3. Qualité du contenu

La dernière idée que nous proposerons pour faciliter la lecture des informations sur le web est de se préoccuper de la qualité de ces informations.

Cette recommandation peut paraître triviale mais elle est essentielle. On remarque que les utilisateurs visitent les sites qui leur apportent une information de qualité, qui correspond à leurs attentes et qui est souvent mise à jour. L'utilisabilité des sites web est donc un pilier de leur qualité utilisateur mais n'est pas suffisante. Pour les utilisateurs, le contenu est premier.

L'objectif du web doit rester de servir la recherche d'informations. On rejoint ici l'idée qu'optimiser l'utilisabilité ne peut pas se faire indépendamment d'une préoccupation concernant l'utilité des contenus présentés.

Conclusion

Faciliter la lecture d'informations sur le web, c'est donc à la fois travailler sur la facilité de perception et sur la facilité de compréhension du contenu. S'ajoutent à ces considérations tout ce qui tourne autour de l'accessibilité des sites web, notamment à l'adresse des déficients visuels. Si le site doit pouvoir être vu et lu correctement, il doit aussi pouvoir être traité par une synthèse vocale avec efficacité et efficience, et son apparence devrait pouvoir s'adapter en fonction des choix de l'utilisateur.

Pour en savoir plus

» Ressources en ligne

University of St Thomas. Writing for effective web pages.

Arno (2002). Présenter des textes longs sur le web. La lecture facile à l'écran. Uzine.net

Henning, K. (2001). Writing for Readers Who Scan. Clickz.com

Petersen, C. (2001). Writing for a Web audience, Ten Web writing tips to gain your Web visitors' trust and keep them coming back for more. IBM.

Les études eye-tracking du Standford Poynter Project et la position de J. Nielsen à ce propos

Bastien, C. (2001). Quelques recommandations pour la rédaction de contenus Web. Lergonome.org

Morkes, J. & Nielsen, J. (1998). Applying Writing Guidelines to Web Pages. Useit.com

Morkes, J. & Nielsen, J. (1997). Concise, SCANNABLE, and Objective: How to Write for the Web. Useit.com

Nielsen, J. (1997). Be succinct! (Writing for the Web). Useit.com

Nielsen, J., Schemenaur, P.J. & Fox,J. Writing for the Web. Sun.

INRS (1997). Les écrans de visualisation. Guide méthodologique pour le médecin du travail. Version actualisée. Document à télécharger sur le site de l'INRS (fichier pdf, 615Ko).
[ note. 17/08/2005: ce document n'est plus disponible en ligne sur le site de l'INRS ]

Gélinas Chebat, C., Préfontaine, C., Lecavallier, J. & Chebat, J.C. (1993). Lisibilité, Intelligibilité de documents d'information.

» Ressources externes

Kilian, C. (2000). Writing for the Web. Geeks' Edition. Self Counsel Press

Krug, S. (2000). Don't make me think. Chapter 5. Omit needless words, The art of not writing for the Web. New Riders.
> lire la chronique ergolab

Cail, F. (1998). Présentation de l'information sur écran de visualisation. Revue Bibliographique. Cahiers de notes documentaires n°151. INRS.

Cail, F. (1995). Le travail sur écran en 50 questions. INRS.



« Liste des articles

à voir aussi sur Ergolab

[24.01.2004]

Accessibilité visuelle des interfaces web

Un objet accessible est par définition un objet que l'on peut atteindre. Si on applique cette définition au domaine de l'ergonomie informatique, optimiser l'accessibilité c'est concevoir ou modifier l'interface de telle sorte que le plus grand nombre...

» Lire l'article


ergolab