Large font size on large displays

[markusgeert]

I've noticed the Consul site having a large font size on bigger screens. From what I could gather, this was implemented two years ago due to difficulties people faced with the font being too small on these screens.

Is this still the desired behavior? I'm asking because Consul seems to be the only site I know of which applies this technique. Might it therefore be the case more people are confused by this compared to the amount of people helped?

[javierm]

Hi, @markusgeert 😄.

Just to give a bit of context, the commit where this changed was added was commit 4e04ade. Back then I used a 1440x900 screen and, on my screen, everything looked fine. But one day I saw Consul Democracy running on a 1920x1080 screen and the admin area looked quite broken in many sections, particularly the forms. Here's a screenshot, edited to highlight the problem:

On this form, some sections are in the middle of the screen, while other sections take the whole screen. This pattern is common in the admin section, and the bigger the screen resolution, the worse the problem became.

While the idea for the solution came from the Writing Less Damn Code article, by Heydon Pickering (although the idea isn't his), searching the web for "responsive font-size" we can find similar ideas.

After implementing these changes, the problem is still there, but at least it doesn't get as bad, particularly on huge screens.

But that wasn't the only reason, though. Since you mention:

Might it therefore be the case more people are confused by this compared to the amount of people helped?

I'm very interested about the context you've got in mind, since the idea is that the amount of people helped would be everyone using a big resolution 😄 (with a strong emphasis on people whose eyesight isn't 100% perfect), since the text is easier to read in this case and you don't get the "more than half the screen is empty" effect that you previously got with a 4K screen.

And (ideally) the amount of people confused by this would be really small 🤔. I mean, AFAIK most people don't keep changing the size of their browser window while using a site, so, compared to other sites, the only thing they'd notice is that the font-size is larger. Is that confusing? I think it's very common to see different sites using a different font-size 🤔. But I might be wrong 😉.

Having said that, the current implementation probably has its own drawbacks, so if you know of some, it would be great if you could elaborate on the topic.

Thanks! 🙏

[markusgeert]

Hi @javierm, thank you for your in-depth reply. The main issue I see with this has indeed to do with the font-size getting (in my opinion) unreasonably large on big screens. For reference, on my 1440p display the text which on smaller screens gets rendered at 17px, increased to 24px. And while this doesn't really seem like a problem since it only takes up space that would otherwise be empty (the horizontal space), you still sacrifice vertical space to fit the now bigger letters. What I think I'm getting at is that Consul could probably use the extra space (at least the vertical space) a larger screen gives more effectively.

That being said, seeing how changing this back would break some portions of the site, and realizing how much work it would take to put in a fix for what could at best be described as a large inconvenience, engineering time is probably better spent on other facets of the project.