Cette page a été traduite avec l'aide d'une IA. L'original en anglais fait foi.
Pendant l'essentiel de l'histoire de la typographie d'écran, il n'existait qu'une seule surface de lecture : du texte sombre sur un fond clair, à l'imitation du papier. Le mode sombre a changé cela. En quelques années, il est passé d'une préférence de niche chez les développeurs à un réglage système sur tous les grands systèmes d'exploitation, et les lecteurs arrivent désormais sur une page en ayant déjà indiqué à leur appareil la polarité qu'ils souhaitent. La typographie doit répondre sur les deux surfaces.
Ce que dit la recherche sur la polarité
La polarité d'affichage — texte sombre sur fond clair (polarité positive) ou clair sur fond sombre (polarité négative) — est étudiée depuis l'ère des écrans cathodiques, et les résultats ont été assez constants. Pour la lecture prolongée dans un éclairage ordinaire, la polarité positive obtient généralement de meilleurs résultats : les études sur la relecture, l'acuité visuelle et la vitesse de lecture tendent à favoriser le texte sombre sur fond clair. L'explication dominante est physiologique. Une surface lumineuse contracte la pupille, et une pupille plus petite produit une image rétinienne plus nette avec une plus grande profondeur de champ. Le texte clair sur fond sombre dilate la pupille et adoucit l'image.
C'est le cas général, non le cas universel. Le mode sombre mérite sa place dans au moins trois situations :
- Faible lumière ambiante. Une page d'un blanc éclatant dans une pièce sombre éblouit, perturbe l'adaptation à l'obscurité et peut être réellement inconfortable. Dans les environnements peu éclairés, la polarité négative réduit le décalage entre l'écran et son environnement.
- Photophobie et sensibilité à la lumière. Les lecteurs souffrant d'une sensibilité à la lumière liée aux migraines, de certains symptômes post-commotionnels ou de troubles rendant les champs lumineux douloureux dépendent souvent des thèmes sombres pour pouvoir lire tout court.
- Certaines formes de basse vision. Les lecteurs affectés par la diffusion de la lumière — en raison d'une cataracte ou de milieux oculaires opacifiés, par exemple — peuvent voir plus nettement lorsque la quantité totale de lumière émise par la page est réduite. Les utilisateurs de loupes d'écran et de modes à contraste élevé comptent depuis longtemps un contingent d'adeptes du clair sur sombre, précisément pour cette raison.
La halation et le problème de l'astigmatisme
L'échec caractéristique des thèmes sombres est la halation : le texte lumineux sur un fond sombre semble briller, débordant vers l'extérieur et brouillant la forme des lettres. L'effet est le plus fort avec du blanc pur sur du noir pur, et il est pire pour les lecteurs atteints d'astigmatisme — un trouble réfractif très courant — dont l'optique imparfaitement focalisée étale davantage les traits lumineux. Les polices fines en souffrent le plus, car le halo consomme une part plus importante du trait.
Les remèdes sont simples :
- Ne jamais utiliser de texte blanc pur sur noir pur. Adoucissez les deux extrémités : un gris clair sur un gris très foncé réduit considérablement le halo tout en conservant un contraste largement suffisant.
- Compenser la graisse apparente. Le texte clair sur fond sombre paraît plus gras que le même texte inversé, car les traits lumineux s'étalent. Un texte composé dans un thème sombre peut souvent se permettre d'être légèrement plus maigre — ou, avec une police variable, être ajusté par le grade (voir le chapitre suivant) afin que la correction n'entraîne aucun recalcul de mise en page.
- Ne pas se contenter d'inverser la palette claire. Un thème sombre conçu par négation a généralement trop de contraste dans le texte et pas assez dans l'interface. Il doit être conçu comme une composition à part entière, avec ses propres valeurs de contraste testées.
Respecter le choix du lecteur
La requête média prefers-color-scheme rapporte la préférence du lecteur au niveau du système d'exploitation, et l'honorer est la référence moderne. Un lecteur qui a choisi le mode sombre au niveau du système a exprimé une préférence — parfois un besoin médical — et un site qui l'éblouit avec une page blanche l'a purement et simplement ignorée. L'inverse est tout aussi vrai : imposer un thème sombre à des lecteurs qui ont choisi le clair est tout aussi présomptueux. Proposez si vous le souhaitez un réglage dans la page, mais adoptez par défaut le paramètre du système, et pensez à définir intégralement les deux thèmes : un mode sombre à moitié stylé, avec du texte sombre hérité sur une surface sombre, est pire que pas de mode sombre du tout.
Le matériel sous la page
L'écran lui-même fait partie de la surface de lecture. Sur les écrans OLED, les pixels noirs sont tout simplement éteints, ce qui signifie que les thèmes en noir absolu économisent la batterie — un bénéfice légitime — mais la commutation pixel par pixel peut produire un léger étalement du texte clair pendant le défilement sur certaines dalles, un argument de plus en faveur du presque-noir plutôt que du noir absolu. Les écrans à encre électronique se situent à l'autre extrême : ils sont réflectifs, comme le papier, n'émettent pas de lumière et ne rendent bien, presque exclusivement, que la polarité positive. Un contenu susceptible d'être lu sur liseuse ne doit jamais dépendre d'un thème sombre pour sa lisibilité.
Pourquoi ce chapitre est nouveau
En 2005, les écrans sombres appartenaient aux terminaux et à la science-fiction ; le web était blanc, et la polarité était une question réglée parce que les lecteurs n'avaient aucun moyen d'exprimer une préférence. Il n'existait aucun réglage sombre à l'échelle du système, pas de prefers-color-scheme, pas d'OLED dans la poche du lecteur. Le mode sombre comme surface de lecture grand public, contrôlée par l'utilisateur, est un développement de la dernière décennie, et il a transformé la polarité d'une note de bas de page historique en une responsabilité de conception bien vivante.
En CSS
/* Design the dark theme; don't just invert the light one */
@media (prefers-color-scheme: dark) {
:root {
--paper: #171310; /* near-black — never #000 */
--ink: #ece5d6; /* off-white — never #fff (halation) */
}
img { filter: brightness(0.9); } /* dim plates to the surface */
}
Recommandations
- Conserver le sombre sur clair comme surface par défaut pour la lecture au long cours ; les données sur la lecture prolongée la favorisent.
- Honorer
prefers-color-schemedans les deux sens — traiter le réglage du système comme la décision du lecteur. - Dans les thèmes sombres, éviter le blanc pur sur noir pur ; adoucir les deux valeurs pour maîtriser la halation.
- Réduire légèrement la graisse des caractères (ou abaisser le grade) dans les thèmes sombres pour contrer l'engraissement apparent.
- Concevoir la palette sombre de façon indépendante et vérifier ses rapports de contraste ; ne pas inverser le thème clair.
- Préférer des surfaces presque noires au noir absolu sur OLED pour limiter l'étalement au défilement, sauf si l'économie de batterie est l'objectif explicite.
- Partir du principe que les lecteurs sur encre électronique voient une polarité positive ; ne jamais rendre le mode sombre porteur.