No! If you mess with the font size, you make your page hard to read for people who adjust their font size in their browser. They set their font size very carefully, to the smallest size they can comfortably read. Your site had better not change that.
Medium.com is the worst offender. Their font size is small and they disable zooming on mobile!
2. People who regularly adjust font size as needed.
The first group is helped by a reasonable responsive font size. The second group isn't hindered by it.
Is there really a significant group of people who carefully set their preset font size, but then do not adjust it as needed when they visit a page? It seems unlikely to me. Even if all webpages used your defaults, there’s still no one-size-fits-all preset to pick, since typeface, weight, layout, leading, colors and many other things also impact readability. The tool to take control of all of that is reader mode, which is a great option when a website has screwed up its typography.
> I would expect two large groups of user behavior:
I think you're missing:
3. People who set the font size once, when they configure their browser, to their preferred font size and expect, for some weird reason, that this will be respected!
> The tool to take control of all of that is reader mode, which is a great option when a website has screwed up its typography.
That would be great, if there wasn't a huge correlation between websites that screw up their typography, and websites that use an ungodly mess of nested `div`s and javascript-based content rendering that breaks reader mode.
No, I set it one for each device, then I never touch it again. So I'm am the third group that you doubt exists.
I don't want to fiddle with it. I read text on my phone, I have a preferred size to read, I shouldn't have to change it more than once. The few sites which end up too big or too small I read begrudgingly. Can I even set font size per site?
Pinch zoom doesn't work because now I have to pan left and right for each sentence?
All CSS font sizes are already responsive because CSS pixels are an abstract concept. Adding your own hacks on top of that instead of respecting system settings is counter-productive.
The point of the user's custom setting is that you don't need to scale with it. The user's custom setting is the font size they want! That's why they set it.
If the user wants a different root font size, they'll set it themselves.
If every site used the same font, maybe. But different font faces vary in readability at the same size. Also, we still have to set sizes for things like titles, subtitles and other elements to create a hierarchy on the page.
'Don't resize my fonts' is such a narrow view of whole range of design considerations.
font size needs to scale because font size can also affect contrast, unless the user is setting custom font size per site it will not be adequate for the user to set the custom font size for all potential situations.
Is that just because they've never tried to figure out how, because the default font size works fine for them? In which case, the answer is still not to change it.
Unfortunately, while making a site, I can't query for "does the user set special preferences" in CSS.
I use somewhat similar formula in one project to create a common baseline font size that 1) does not break with viewport size changes 2) remain legible for baseline user 3) gives good base value to scale UI elements by rem/em units.
Of course it's also a project where the user does not have a chance to mess with font size anyway for the main user, but I'd reuse the formula elsewhere.
Wish I could query the browser if the user has specific preferences, just like with "Dark mode"
My personal experience is that the default is usually wrong, especially when I move between different displays. I end manually zooming in/zooming out a lot.
Meanwhile using the default size + CSS keyword size modifiers (large/x-large etc.) ended up on breaking on the project I mentioned, especially after for all practical purposes we had to deal with the fact that claims of single display size & resolution to target weren't actually delivered, and when client also asked about possibly opening the interface from portable devices.
> My personal experience is that the default is usually wrong, especially when I move between different displays. I end manually zooming in/zooming out a lot.
Then fix your setup. Campaing for better browser defaults. Do whatever it takes, but don't add hacks with hardcoded (=faulty) assumptions to your websites.
Sadly, I agree that browsers have forgotten what defaults are for. Instead of prvoiding something useable for the user, default CSS has turned into a nearly completely abstract set of values of relevance only to developers.
But that situation should be fixed on the side of the Web browsers, not every website's author.
> Wish I could query the browser if the user has specific preferences, just like with "Dark mode"
You can't query that with dark mode since there is no "no-preference" in the spec and the "preference" that browsers expose normally has not been influenced by the user in anyway. You should still respect the indicated dark mode preference because the user can influence it to set their preference for all sites. Same with the font size.
It's a real shame the site is never improved due to the captive market and lack of need to make things better. I am constantly downvoting on mobile when I mean to be upvoting for example, surely they could just make the clickable area bigger.
That's the most slippery slope argument possible. "Whoa can't refine the hit state on two arrows by a few pixels! The whole site might become anew Reddit!"
I think the argument is more “if I had to choose between the two extremes, I'd definitely prefer this one” than the slippery slope of “I don't want change because change might lead to abomination”.
Yes completely, I can't understand why Reddit hate their users so much, I find the site totally unusable and I often just leave immediately if I visit it!
That’s interesting; this seems like one of the better mobile sites to me. I mean it is just a column of text. I don’t really care that much if I hit the wrong voting button, though. I’m just one little signal, if my inputs are slightly stochastic it shouldn’t matter too much. If I really love a comment I can zoom in a bit to hit the arrows.
There are exactly 2 websites where I feel like I need to increase my front size, HN (140%, no less) and old.reddit.com. Every other website I use looks fine.
And I'm not changing the font size on every website I visit for the rest of my life just so that HN can display properly at 100% zoom.
Then something in your setup is wrong. How many pixels your screen has is irrelevant, as long as your setup isn't broken CSS pixels should be (roughly) the same physical size.
If only CSS supplied some sensible keywords based on the user's preferences, so you could just ask for say a medium, large, or x-large font.
Of course CSS actually does. I've found using font size keyword and rem units can make a UI that scales with user preferences quite possible. Not _easy_ of course, but possible.
Actually, Medium—the app, at least—does have an option under "Display settings" that lets you switch between two font sizes that are almost imperceptibly different...
Full-page zoom won already. Browsers all make it very difficult to even scale the font size without zooming the page (Firefox is the easiest, with the setting buried in a submenu as a toggle). And frankly, scaling just the fonts but leaving the rest of the layout is a bad experience: scaling just the font size often breaks the layout, particularly around interactive controls like buttons and tabs. There are two good paths to accessibility here: full-page zoom, and reader mode.
Medium.com is the worst offender. Their font size is small and they disable zooming on mobile!