Je vous livre un article écrit par Frédérick Warembourg paru dans sa Newsletter du 25 juin 2008

Notre écriture révèle notre personnalité. Les graphologues décryptent et interprètent les courbes les mouvements afin de découvrir les facettes de notre personnage que l'on souhaite mettre en avant ou dissimuler.
Mais à l'heure du "tout ordinateur", comment faire la différence?
La distinction se situe alors dans le choix de la police de caractères et dans la mise en page. Comment et pourquoi choisit-on une police de caractères? Comment les documents conçus avec les outils bureautiques véhiculent les non dits de leur auteur? Voilà un sujet que Le Nouvel Economiste porte à notre réflexion.
Par défaut, la police Times New Roman apparaît à la création d'un nouveau document.
Alors peut-on dire qu'un document avec cette police signifie une absence de recherche de distinction de la part de son auteur? Ou alors ce dernier n'aurait su que choisir dans la longue liste de polices proposées? Plusieurs interprétations sont possibles.

Dans les entreprises, le choix est soumis à une charte qui définit non seulement la police mais aussi la taille de caractères. Mais lorsqu'il n'y a pas de charte certains observeront la rigueur d'un Arial d'autres objecteront l'aspect enfantin du Comic Sans MS. Le Comic Sans MS est souvent associé à une couleur gaie et a pour conséquences d'endormir la méfiance des destinataires.

La méfiance est également adoucie par le travail de mise en page. Plus un document est bien conçu plus le contenu semblera gagner en intérêt et atténuer les informations douloureuses. Bien sûr il ne faut pas tomber dans l'excès inverse jusqu'à oublier la valeur du contenu. La bureautique propose beaucoup d'options pour agrémenter le document. De ce fait, elle est souvent reléguée au rang d'outil. Cependant les documents finalisés "reflètent et modèlent notre espace mental". Dès lors tout ce que vous avez voulu mettre ou omettre donnera des informations sur votre personnalité.

A l'image des codes vestimentaires, les documents subiront des évolutions inhérentes à l'âge, à la fonction. Le Comic Sans MS et le jean s'estomperont pour laisser place à l'Arial et au costume.

applica

Des études de comportement ont montré que les techniques de lecture d'un internaute (de recherche et de navigation aussi) ne sont pas les mêmes que sur le papier. Sur papier, on lit de manière linéaire, on feuillette. Sur écran c’est NON linéaire : on explore (et quelquefois on se perd). Il y a en outre une différence de taille entre les images formées par l'encre qui s'étale sur le papier et les pixels de l’écran de notre ordinateur.
Sur écran, la couleur est la somme des trois couleurs (rouge, vert, bleu) émises par le tube de l'écran. La source de lumière est intérieure : elle est située derrière l'écran. Dans le cas du papier, la source de lumière est extérieure et au dessus.
Notre perception rétinienne n’est donc pas la même entre le papier et l’écran.
Selon

Les techniques "d'écriture" doivent être donc repensées. Comment ?

Sur PAPIER, choisissez de préférence, pour les titres, une police SANS empattement. Une police sans empattement se distingue par l'absence de pied écrasé au i . Exemple de police sans empattment : Arial, Verdana. Pour le texte, par contre, optez pour une police avec empattement (Times ou un Garamond par exemple).

Empattement moins lisible sur écran
Sur ECRAN, c’est le contraire du papier : il vaut mieux utiliser des caractères sans empattement. Les lettres avec empattement sont effet moins lisibles sur l'ordinateur. Il y a deux raisons à cela :

• Les détails du caractère avec empattement ont tendance à se "noyer" dans l'écran.
  Un caractère avec empattement produit des « effets d'escalier » sur sa base.

• Sachez aussi que la résolution d'un écran est beaucoup plus faible que celle du papier. Un écran a une résolution de seulement 72 pixels par pouce alors que la résolution papier peut aller jusqu’au 3.600 points par pouce.

Dans le cas de caractères de grande taille, l'argument de la résolution ne joue toutefois plus. Vous pouvez ainsi utiliser n'importe qu'elle forme de caractère, (par exemple pour la page d'accueil, les onglets, titres, etc).

Quelques règles :
Un caractère gras a tendance à agir sur la persistance rétinienne : à utiliser exclusivement pour des titres ou des parties courtes d'un texte. l

L'italique est moins lisible sur écran, il ralentit la lecture et produit généralement des effets d'escalier. Il vaut mieux le remplacer par un changement de couleur ou, encore mieux, un retrait.

Les majuscules sont plus lentes à lire.

Trames et arrière-plans : évitez la cacophonie des couleurs et les fonds patchwork ou tapisserie. Attention aussi au contraste ! Exemples : texte jaune sur fond blanc, violet sur rouge ou teinte sur teinte (vert foncé sur vert pâle). C’est très fatiguant et souvent illisible. Pour bien utiliser les couleurs : www.chromoweb.com

Le souligné est à proscrire, il est réservé aux liens hypertextes.

Ne bourrez pas l’espace visuel de l’écran : certaines études suggèrent de ne pas dépasser 30% de la surface de l’écran. Plutôt que de compacter les textes, faites défiler le texte en permettant à l’internaute d’utiliser « l’ascenseur » latéral (scroll). Insérez des alinéas, placez aussi des tirets, des puces. Bref, répartissez les masses, de façon à ce que l’internaute ait une impression globale, panoramique, « légère », attirante. Le surfeur scanne d’abord toute la page, la « synthétise », avant « d’entrer dedans ».

Ne choisissez pas des polices étroites, comme l’Arial Narrow : elles ralentissent la lecture.
Sur écran, l‘interlignage doit être un plus grand que sur papier. Un Verdana de taille 11 points et un interlignage de 15 points donne un excellent résultat à lire.

Alors que dans le papier le sens de lecture est plutôt vertical, sur écran la lecture est horizontale.
Conséquence de cette règle : le multi colonnage n’est pas conseillé dans le cyber monde. Trop de colonnes (comme c’est le cas dans la presse papier) conduit à une fragmentation de la largeur de l’écran, engendre une perte de place, réduit le confort de lecture et nuit à la vision synthétique dont nous parlions plus haut.

Si l’écran comporte quand même plusieurs colonnes, un espace suffisant doit être prévu entre chacune d’elles. Donnez leur aussi plus ou moins d’importance selon le contenu (hiérarchisez !).

Evitez les justifications trop étroites de moins de 5 cm (qui créent des saccades oculaires dans la lecture), ni trop larges de tout l’écran (qui créent une lassitude oculaire).

Le chiffre 12 est magique sur le web. L’idéal, c’est de ne pas avoir une taille de caractère inférieur à 12 (ou 11 selon les polices), des phrases de 12 mots et des paragraphes de 12 lignes au maximum.


Quelques sites à consulter
J’ai ici parlé de lisibilité. Si vous voulez allez plus loin et aborder l’ergonomie (certain parlent d’utilisabilité) du web, voici quelques références :

USABILIS. Conseils en ergonmie informatique. Son auteur Jean-François Nogier a mené l'essentiel de sa carrière dans le domaine des interfaces homme-machine chez IBM et Thales. Il est consultant spécialisé en ergonomie informatique. Il enseigne l’utilisabilité à l’Université Paris Dauphine, à l’INT, l'ISEP et Supélec.
Il a écrit un ouvrage "Ergonomie du logiciel et design web. Le manuel des interfaces utilisateur"

USEIT. Son auteur, Nielsen Jakob, a aussi écrit, entre autres, un très connu : « Designing Web Usability : the pratice of simplicity”, Indianoplis, New Riders Publishing, 1999.

ERGOBAL,
est un site de ressources en ergonomie web et logiciel. C'est une boîte à idées pour comprendre et appliquer l'ergonomie informatique.

Architecture d'un site Web

NetWay est né à partir d'un constat simple : 90% des sites Web à vocation commerciale ne fonctionnent pas! La raison principale ? Ces sites ne répondent pas à l'attente des internautes...

Pour AXANCE il s'agit de détecter les déficits en expérience-client (usages et besoins) et apporter des solutions concrètes pour créer de l’expérience-client positive (attractivité, utilité, efficacité…plaisir).

Sur le site Ergologique, ils souhaitent sensibiliser et conseiller les concepteurs d'interfaces web, et d'interfaces utilisateurs en général, sur les nécessités en ergonomie et utilisabilité.


mathelot JP