Dark mode/light mode in IF

Well-intentioned, but badly researched. :grimacing:

PSA time, everyone. There is way too little research still, but here’s where the evidence available points:

A clear, clean sans serif like Arial or Helvetica offers best results for people with dyslexia, better than OpenDyslexic. So long as it’s roman; people with dyslexia do much worse with italic type, so please reconsider using it for anything but short phrases at most. I feel safe in substituting other good sans serif faces, but Arial and Helvetica are the ones for which there’s actual data. (I look forward to eventually seeing data for Atkinson Hyperlegible.)

It’s to be hoped you’re already thinking about avoiding foreground/background contrast that’s too low, but on a display, the highest possible contrast of pure black text on a pure white background creates problems for people with dyslexia, too. And I wish I could tell you what’s optimal, but we don’t know. Black on something a little off-white like #FAFAC8 or a pale rose or peach or other warm pastel seems like the best bet.

Use a line height that’s 150% of the font-size. Stick with ragged right; don’t justify both margins. (Justifying the margins work out ok in newspapers and magazines and books because they actually have professionals scrutinizing it and hyphenating things so there’s something like consistent space between words.)

When writing CSS use rems (the “root em” unit) to specify sizes so it automatically respects the user’s font-size choice.

There’s a lot more, but these basics will get you pretty far.

3 Likes