Pour changer, je vais forcer la justification des textes de cet article. Pour avoir un véritable exemple concret sous les yeux.
La justification (aligner le texte à gauche et à droite) qui est généralement souvent utilisée sur un document imprimé, a plus d’inconvénients sur le web : espacement irrégulier entre les mots, les “rivières” (terme qui explique l’illustration de cet article), mauvaises césures, de grands espaces sur les petits écrans, et accroissement de la charge cognitive pour certains lecteurs (dyslexie, fatigue visuelle). Et il est aussi impossible à régler sur un texte qui ne s’affichera pas de la même façon sur un smartphone, un ordinateur, une tablette… Alors qu’un document imprimé, c’est le même pour tout le monde.
Problèmes de la justification sur le web
- Espacements irréguliers et “rivières” : pour remplir la largeur, le moteur de rendu augmente l’espace entre certains mots. Cela peut créer des zones d’espaces blancs sur la page — on appelle ça des rivières. Elles gênent la lecture et cassent la ligne visuelle. C’est beaucoup plus flagrant sur des petites largeurs.
- Sauts de mots et césures mal gérés : en impression on peut contrôler la césure (trait d’union au milieu d’un mot à la fin d’une ligne) c’est impossible sur Internet, la fin de la ligne n’est pas la même pour tout le monde. On ne va donc pas forcer des retours à la ligne. Sur le web la césure se fait parfois automatiquement, elle dépend du navigateur, de la langue et de la police, c’est souvent désactivé ou mal supporté. Résultat : de grandes plages d’espace entre mots.
- Sur mobile c’est pire : colonnes étroites = très peu de mots par ligne. Pour justifier, le navigateur crée de grands espaces entre mots. Le texte devient difficilement lisible.
- Perturbation du rythme visuel : un texte aligné à gauche offre un espacement de mots constant, le cerveau suit mieux la progression des mots. La justification casse ce rythme.
Accessibilité et lisibilité
- Dyslexie et autres troubles de lecture : l’espacement irrégulier augmente la charge cognitive et peut ralentir la lecture pour des personnes dyslexiques ou à faible niveau d’attention. Ce n’est pas une règle absolue, mais c’est un facteur reconnu par des spécialistes de l’accessibilité.
WordPress Gutenberg
Sur l’éditeur natif de WordPress, il n’y a plus de bouton de justification depuis WordPress 4.7 (2016). La fonction existait, mais a été supprimée pour des raisons d’accessibilité et de mauvais rendu sur mobile. L’équipe en charge du développement a expliqué qu’elle ne voulait pas encourager une pratique qui dégrade la lisibilité. Seul moyen, forcé avec du code CSS personnalisé ou utiliser des plugins qui ajoute des modules Gutenberg.
WordPress Elementor
Elementor propose encore le choix dans son interface : gauche, centré, droite, justifié. Sur mobile, ça donne souvent un mauvais rendu, essayez de lire cet article sur un mobile par exemple.
Exemple de texte justifié sur plusieurs largeurs avec des belles rivières.
Voici un même texte avec des mots assez longs qui s’affiche en plusieurs largeurs.
Initialement, l’incompréhensibilité des circonstanciations administratives internationalisées paralysait les interlocuteurs institutionnels, provoquant une désorientation généralisée. Néanmoins, l’harmonisation progressive des communications stratégiques facilita une compréhension mutuelle. Tout s’éclaircit.
Initialement, l’incompréhensibilité des circonstanciations administratives internationalisées paralysait les interlocuteurs institutionnels, provoquant une désorientation généralisée. Néanmoins, l’harmonisation progressive des communications stratégiques facilita une compréhension mutuelle. Tout s’éclaircit.
Initialement, l’incompréhensibilité des circonstanciations administratives internationalisées paralysait les interlocuteurs institutionnels, provoquant une désorientation généralisée. Néanmoins, l’harmonisation progressive des communications stratégiques facilita une compréhension mutuelle. Tout s’éclaircit.
