[Questions] Ergonomie et longueur des lignes

Merci pour l'article.

Pour ce qui est de la césure des mots, en attendant d'avoir un mécanisme dans css3, c'est mieux de ne pas utiliser les solutions à base de &hyph; ça casse les mots lors de la lecture avec un lecteur d'écran.

Salut,

Le lien donné par Chok71 te donnera de bonnes réponses à ton problème.

Pour t'expliquer une peu les réactions que tu as rencontré :
- celui qui est en grande résolution, te diras toujours qu'un site à largeur défini n'occupera pas assez d'espace à son goût. Même maintenant ou les sites se font dans une largeur minimale plutôt orientée 1024x768, il n'occupera que la moitié de l'écran en comparaison de des résolutions maximales. Mais pour un blog, généralement en deux colonnes maximum, une de contenu et une de navigation entre les articles, étaler encore plus le texte en largeur rendrait la lecture de plus en plus pénible.

- celui qui est en petite résolution sur un notebook, le texte occupera tout son écran, mais la distance à parcourir avec les yeux n'en sera toujours qu'assez réduite.

Dans le cas de ton site, je pense que globalement la longueur de ligne est assez bonne. Mais je pense que tu peux jouer un peu sur l'aération verticale, avec un line-height un poil plus grand, et une marge entre les paragraphe plus importante.
Par ailleurs, ce qui peut entâcher la facilité de lecture actuellement, c'est que tes paragraphes sont déja un peu long (4-5 lignes) et nombreux, et que tu n'as pas beaucoup d'animation pour rendre la lecture plus dynamique, comme des intertitres ou des mises en emphase (couleur, gras, italique, citations, etc.)

Sinon j'aime bien les couleurs que tu as choisi, c'est très doux et agréable à l'oeil.
Modifié par Mikachu (08 May 2010 - 11:47)

Mikachu a écrit :
et que tu n'as pas beaucoup d'animation pour rendre la lecture plus dynamique, comme des intertitres ou des mises en emphase (couleur, gras, italique, citations, etc.)

c'est le plus gros défaut, il n y a rien pour accrocher l'œil du coup ça ne donne pas envie de lire. Le contraste des liens dans le contenu est très très faible.

La longueur de ligne me semble correcte. Je rejoins ce qui a été écrit par d'autres sur la hauteur de ligne (opter pour 1.5 plutôt que 1.4?), l'écart entre les paragraphes (1.25em de margin plutôt que le 1em par défaut?), et surtout l'absence d'inter-titres rythmant la lecture.

Un truc à surveiller: la taille du texte. La technique utilisée te donne un corps de texte en 12px (1.2em * 62.5% * 16px), ce qui est correct. C'est un bon compromis pour avoir un texte pas trop gigantesque sur les écrans à petite résolution (faible dpi) et pas trop petit sur les écrans à grande résolution (fort dpi). Ceci dit, le 12px ça passe bien en Verdana, mais sur des fontes avec un x-height moins élevé tu perds en lisibilité. Or, tu déclares:

font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;

Le Lucida Grande (disponible sur Mac uniquement pour les fontes par défaut) sera sensiblement plus petit, de même que le Arial, par rapport à du Verdana. Si l'utilisateur à l'écran de 24 pouces a un iMac 24 pouces, il est probable qu'il a vu du Lucida Grande 12px, ce qui est plus proche d'un Verdana 11px que du Verdana 12px que tu vois peut-être dans tes tests. D'où, en partie, la différence de perception.

Pour les polices, les interlignes et autres espacements, c'était défini par défaut dans le thème fourni avec Wordpress d'où provient mon design.

Là je viens de faire les modifications suggérées.

@Florent : En passant, j'ai répondu à ton commentaire après l'avoir approuvé.