Wikipedia:WikiProject Usability/Readability guidelines
| WikiProject Usability menu |
|---|
Size of text
Reducing text size (for example, to 75%) causes usability and accessibility issues:
- The first usability issues to consider is readability. An extensive number of usability studies were made about the impact of text size on readability. It was clearly stated that small text makes it way harder to read, for example by reducing reading speed: if a text with comfortable size would be read by average users in 15 seconds, the same small size text would be read in 27 seconds. The default font size on Wikipedia is already too small (9 points instead of 12 points), so we don't want to make it even smaller.
- The second and third issues are both usability and accessibility issues. First, users with low vision that have severe low vision (but are still able to read really large fonts) use dedicated software to enlarge or reduce the text size. So they will be able to read it. But when the normal text size changes to a very small text size, they may have to adjust their zoom level only for this particular text, and readjust it afterwards. It's suboptimal, but not detrimental.
- The biggest usability issue is for elders (and possibly anyone older than 40), normal users with small low vision and normal users with a particular resolution, device, and such. Truth is, most of these users doesn't know how to zoom with their browser. Yes, they don't know "Ctrl +/-" even exist, or they forget it. So when they encounter such small text they have trouble to read, their only option is to come very close to the screen and strain their eyes as much as they can. Until they succeed or give up because of too much strain.
It would be way easier for everyone to not have to think about such issues, and simply don't ever reduce the font size. It also removes unnecessary code.
Examples
Note: when viewing those examples, result may vary if you have customized your font size in your browser or style sheet, if you are using the zoom ("Ctrl +/-") - note that "Ctrl 0" resets zoom to default - or depending on your screen and its resolution.
- Font size sample: 9 points. This is the default text size on Wikipedia, and it's way too small.
- Font size sample: 12 points. This is the recommended text size by usability experts, it enhances readability.
- Font size sample: 14 points. This is the recommended text size for elders.
Examples using ems and relative sizes
- Font size sample: 75%. The result is similar to <small>, and really too small to be read comfortably. Users without particular vision impairments might have a lot of trouble to read it.
- Font size sample: 0.95 em. Similar to the default text size.
- Font size sample: 100%. Similar to the default text size.
- Font size sample: 1.3em. Similar to 12 points, the recommended size.
- Font size sample: 130%. Similar to 12 points.
- Font size sample: 1.5em. Similar to 14 points.
- Font size sample: 150%. Similar to 14 points.
Resources on readability
Small text affects readability a lot, and has been thoroughly studied by usability experts: small text is way harder to read for everyone. Usability guidelines recommend a default font size of at least 12 points (about 16 pixels, but pixels are evil).
There is any number of useful resource about readability on the Web. But those three stand out:
- An overview of readability best practices
- Research on readability, for advanced users or Wikiproject members
- List of further references
Overuse of color, and too many contrast changes
Needs to be expanded, needs references, etc. But this topic is also important.
Introducing {{Gradient}}. Edokter
- It is beautiful. But from a usability point of view, overuse of gradient is quite distracting for the eye and reduces readability. Too much useless strain on the eye. Dodoïste (talk) 00:40, 29 September 2010 (UTC)
- Only if use with stoopid colors. — Edokter • Talk • 00:43, 29 September 2010 (UTC)
- Not only. I meant overuse in a matter of quantity. Not really in a matter of color choice quality because soccer projects will have their way anyway (as well as many other projects, its just an example so don't take it personally). Do you consider Template:Gradient/testcases as good examples? I absolutely don't. There are too may contrast and color variations, and the eye needs to get adapted at every change of contrast. In the end, it simply makes it waaay longer to read.
- It would be great if it was only used in table headers, for example. Thus, it would not disturb the reading of the main content. Dodoïste (talk) 01:12, 29 September 2010 (UTC)
- Only if use with stoopid colors. — Edokter • Talk • 00:43, 29 September 2010 (UTC)
Discussions
See this layout proposal. This layout used on the French Wikipedia was reviewed by an accessibility expert and another accessibility expert specialized in dyslexia.
les gens qui évaluent sont des experts contactés sur le mode « Puis-je te déranger avec un cas d'école si tu as 5mn ? ». A priori, WP ne les intéresse pas plus que cela en soit. Par contre, le cas précis peut les intéresser et les amener à donner un avis qui sera relayé ici.
la délimitation visuelle des blocs de texte et des lignes a un impact majeur pour les lecteurs dyslexiques. Parmi les cas les plus couramment abordés, il y a la justification du texte, le contraste trop poussé et l'interlignage/inter-paragraphage (sic). la dyslexie, cela dit, n'est qu'un cas parmi d'autres, mentionné ci-dessus parce qu'il était le plus évidemment concerné.
il n'y a là rigoureusement rien de nuisible pour lecteur dit moyen, si tant est que cette notion soit valide en ergonomie : si les bordures et l'alternance d'arrière-plan constitue selon vous une nuisance pour des utilisateurs, la charge de la démonstration est... à votre charge ;-) Mais c'est extrêmement peu consistant, jusqu'à preuve du contraire.
Bref, ce n'est bien-sûr pas dramatique, mais je crois que vous vous êtes planté sur le fond, pour dire les choses simplement. cela arrive à tout le monde, ce n'est pas grave. Tout comme il peut arriver à un administrateur de faire une modification d'interface unilatérale, mais avisée : on ne va pas lui demander de revenir en arrière, de procéder à un sondage, etc. Ce qui est bien fait est bien fait, c'est la base d'un wiki.--Temesis (d) 3 février 2010 à 13:25 (CET) :Premier retour recueilli, côté dyslexie (une part très loin d'être non négligeable des lecteurs) : :
:je ne pense pas qu'il y ait à chercher beaucoup plus loin pour valider, puis systématiser cette modification du rendu, faite sur une base purement intuitive et personnelle, mais très bien vue. :une remarque simple, en complément: la lisibilité des discussions gagne considérablement dans un contexte utilisateur lambda: celui où l'on est en déplacement, avec des conditions de consultation mobiles pas optimales (smartphone, bientôt ipad). Pour ma part, c'est la première fois qu'une discussion sur WP est déchiffrable dans le train, pour être très prosaïque. --Temesis (d) 3 février 2010 à 14:45 (CET) :Allez, un autre retour, de portée plus générale:> Est-ce que la mise en forme avec bordure et grisé facilite la lecture de ton point de vue ?
Sans hésitation, OUI, et c'est le cri du coeur !
Je dirai même que c'est le jour et la nuit. Avec la simple indentation je suis vite perdue, je distingue mal les différentes interventions, je retrouve difficilement qui répond à qui...
L'effort de lecture prend le pas sur l'effort de compréhension de ce que je lis. A très petite dose cela reste gérable mais la fatigue s'installe vite et il m'arrive de renoncer.
:On peut s'arrêter là ou est-ce qu'il faut convoquer un colloque Template:Clin d'oeil ? --Temesis (d) 3 février 2010 à 16:13 (CET) ::C'est ma réponse que Temesis cite dans son premier exemple. L'accessibilité des sites Web est mon domaine depuis des années et je suis dyslexique... j'ai donc cherché à comprendre pourquoi tant de sites me posaient des problèmes, quelles solutions pouvaient y remédier. ::Rien que répondre ici me demande un effort considérable. Je suis démunie face à la syntaxe Wiki qui perturbe mes acquis fondamentaux de lecture. Retrouver une intervention dans un long bloc de texte sans aucun point de repère, respecter le fil des réponses, respecter la syntaxe des indentations et le nombre de signes :... je ne veux pas faire le procès d'une syntaxe dont je reconnais l'utilité, juste montrer quelques difficultés liées à la dyslexie. ::S'il n'est pas possible de remédier à ces problèmes dans les blocs d'édition, il n'en va pas de même des pages Web. ::Tout ce qui peut améliorer le confort de lecture est bienvenu : titres et sous-titres clairement identifiables comme tels, paragraphes courts et suffisamment espacés, pas de texte justifié, pas de contenu en majuscules... ::Il est particulièrement important de guider le regard, et cela me ramène au sujet de cette discussion, les bordures qui délimitent clairement les différentes interventions.--Monique Brunel (d) 3 février 2010 à 19:56 (CET)L'indentation toute seule pour des threads ? L'ergonomie limitée par la technique il y a longtemps, tu connais evidement ? Je voyais ça oublié. C'est drole de voir ça aujourd'hui sur un site comme wikipedia. Quand c'est évident qu'on peut faire beaucoup mieux (ton 2ème exemple)