Les polices de caractères ainsi que la taille du texte jouent un grand rôle dans l’accessibilité de votre site. Dans cet article nous abordons les principes de base pour rendre du contenu textuel accessible de par son apparence. Ces différents points pourront être contrôlés lors du choix du thème.
Le choix de la police de caractères
Les polices de caractères déterminent l’apparence des textes sur une page web. Il en existe des milliers, de la plus simple à la plus extravagante.
Bien qu’une police de caractères puisse jouer un grand rôle dans l’identité graphique, il faut garder en tête que plus elle sera complexe et éloignée d’une graphie simple, plus elle risque de rendre le texte difficile à lire.
Voici quelques points de base à prendre en compte lorsque vous choisirez une police :
- Une police sans empattements (ou sans serif) sera plus facile à lire pour les textes longs (par exemple Arial, Verdana, Ubuntu…).
- Les lettres sont suffisamment espacées.
- Les majuscules et les minuscules sont disponibles.
- Il existe plusieurs graisses (normal, gras, etc).
Concernant l’utilisation de plusieurs polices de caractères sur une même page, c’est possible, mais il n’en faudra pas plus de deux ou trois, au risque de perturber vos lecteurs et lectrices.
Veillez également à la cohérence en utilisant toujours la même police pour les éléments de même type. Si vous choisissez par exemple la police Verdana pour vos titres, il est préférable qu’elle soit appliquée à tous les titres de votre site.
En pratique
Dans WordPress, les polices de caractères sont définies le plus souvent par le thème. Certaines extensions comme les constructeurs de page donnent la possibilité de sélectionner des polices de caractères.
Taille du texte
Afin de faciliter la lecture de vos contenus, veillez à ce que la taille de vos textes soit suffisamment grande.
Il n’existe pas, dans les référentiels sur l’accessibilité, de critère de taille minimale requise pour les textes, cependant une taille de 16px pour le contenu est en général un minimum.
Une taille de texte « confortable » pouvant changer d’une personne à une autre, il doit être possible d’agrandir cette taille dans son navigateur sans que la mise en page générale soit cassée. Cela est possible en utilisant des unités relatives (em, rem, %) plutôt qu’absolues (px, pt, cm) dans le style CSS du thème.
Vous pouvez le tester en agrandissant le texte dans votre navigateur en pressant les touches Ctrl et +. La page doit toujours s’afficher correctement, avec un texte plus grand, sans superposition d’éléments ou autre dysfonctionnement.
Concernant les titres, il est de convention d’utiliser des tailles en fonction de leur ordre hiérarchique. Ainsi le premier niveau de titre (H1) sera plus grand que le second (H2), qui sera plus grand que le troisième (H3), etc.
Comme pour les polices de caractères, dans un soucis de cohérence, des tailles identiques seront utilisées pour des éléments de même type.
En pratique
Lorsque vous rédigez du contenu dans l’éditeur de WordPress, certains blocs vous proposeront des réglages de typographie, où vous pourrez configurer la taille du texte de ce bloc.
Les tailles proposées dans le sélecteur sont définies par le thème, et les tailles génériques notamment pour les titres, sont en général mises en place dans la feuille de style du thème.
Sur le même thème
Rédigé par Marie Comet le 19 février 2021
Relu par Jb Audras & Jenny Dupuy
Dernière mise à jour le 22 février 2021