Ambrose Li

Accessibility laws might be why fonts have become so big on websites

(updated )

I have been wondering why font sizes on websites have been getting bigger and bigger, beyond what seems to be necessary.

Of course, I knew they’ve been getting bigger because of accessibility laws,‍[Note 1] but I still thought they’ve become bigger than what’s necessary to avoid problems caused by setting a minimum font size. I now think this has to do with the rules about colour contrast.

If we design according to WCAG AA criteria, the range of colours we can work with is narrow: many colours that are perfectly distinguishable fail the AA criteria for text.‍[Note 2]

The result is there’s no standards-compliant way to colour-code anything. Once you get the foreground and background colours to have sufficient contrast, there’s no more wiggle room to get different foreground colours to have sufficient contrast. Or, if you find two contrasting foreground colours, one of them will not have sufficient contrast with the background. You can’t win by colour-coding the background either, because if you find two background colours that can be distinguished, one of them will not have sufficient contrast with the foreground. Heads they win, tails you lose.

Today, while I was checking colour contrast for this site (which, by the way, does not meet WCAG AA for colour contrast for the reason I just mentioned) I noticed that “border-line, almost-okay” colours would have been okay if text had been set at either 14-point bold, or 18-point regular.

This, I believe, is why font sizes have become so large on many websites. Setting everything at 18 points would be a perfectly standards-compliant way to get back some of those colours that we’ve lost.

Notes

  1. My optometrist actually asked me a few years ago if I noticed this. I was amused I graduated from the inclusive design program; I knew that by law Ontario websites needed to have their font sizes increased.
  2. Curiously, many colours that are totally indistinguishable pass AA one reason why I’ve long suspected the WCAG criteria for colour contrast were arbitrary and without scientific basis (or if they had any scientific basis the experiments must have been flawed).

Tags

  • #WCAG
  • #web design
  • #accessibility
  • #perceptible information (universal design)
  • #typography