Relative font sizes, or pixel based? 2020-edition

Occasionally I still have discussions about px-based font sizing, feeling like the other party has lived under a rock since early 2000’s. But some designers still like their pixel based tools; maybe it even got popularised again by relatively new tools like Sketch and Figma, introducing pixel-units in a vector-based tool.

Well, to be honest, it matters less these days when compared to the days I learned that pixels are bad. Those days browsers were enlarging only text when it used relative sizes. In response to not all sites serving relative font siz browsers have introduced full page zoom functions, which is common place these days, when you press Command/Control plus ‘+’ everything will scale; text images etc.

But the text-size function is still used. In Firefox, Settings > General > Language and appearance sets the default font-size. In Chrome: Settings > Appearance > Lettersize. When you’re young and able you probably wouldn’t need to know about these things. But we should respect this.

So should we use relative font sizing to conform to WCAG21? I think, based on this W3C note on text resizing, that a page author can get away with pointing out that sizing is a user-agent issue and ‘solved’ by page zoom. However, I firmly believe we should respect OS/Browser settings regarding text size nevertheless. That, to me, is user focus. For further reading please consult “EM vs REM vs PX – Why you shouldn’t “just use pixels”, and article from 2017. Their site is an excellent example of relative sized text.