When I started working on Web stuff around 2005, there were two extremely popular font styles for body copy:
Those two styles appeared on maybe 90 percent of professionally built sites, to be seen by users on IE5, IE5.5 and IE6 on Windows XP and earlier versions. They also looked similar, thanks to heavy font hinting, lack of font smoothing or sub-pixel rendering, and the fact that Verdana has a bigger x-height so 10px Verdana was roughly equal to 11px Arial, only with slightly wider letters.
Let’s not forget about those 800x600 display resolutions, either.
Of course, there is no way to reliably translate typographic points to pixels, because pixels don’t have a universal physical size. Screens have different pixel-per-inch ratios. The original Macintosh had a 72ppi screen. Twenty years later, in 2004, screens in the 80–90ppi range were common. A few years laters, pixels had gotten a bit smaller, and screens were often in the 90–120ppi range, while most iPhones had a 160ppi resolution. Despite the popular misconception, and even before the Retina transition started, the Web’s resolution was not 72ppi; it never was a single thing.
Florens then proceeds to give us an idea of how this process went, going from 11px to 17px as screens increase in resolution and ppi. There’s a lot of history to unpack here, which I’ll leave for you to read, but I’ll leave you with Floren’s ending notes:
I’m also sad that we’re somehow chasing after device makers, operating system and browser developers, and trying to tweak font sizes every other year to adapt to what is out there in the market. The very concept of raising font size a bit depending on the screen width should raise eyebrows. Isn’t it the device’s job to make sure that font-size: 100% is readable?