Pretty much every website uses the wrong font size…

I was for years wondering why our company's webapp uses font-size: 62.5% and now finally I know. Now only to learn why it uses negative margins.

The problem I have with a lot of these things is that clients suck. You do something, they say it "breaks" when you do something, have specific settings or whatever. Sure, it can't follow the intended design. Because it's impossible to have a one size fits all solution.

To any of the questions asked about covering articles, please do! I feel like there’s so much to learn about good accessibility that those videos could really help with 😍

In my last employer the practice is to not set a base font-size and use rem for every single font-size you might need. Doing that you respect anything the user does with their base font-size (zoom is usually related to that) and you cannot run in any trouble caused by using em or percentages (you might have compounding effects if you have something with em or percentage size font inside a em or percentage sized font). We even encouraged every single size to be rem, including padding, margin, widths and heights so they would scale with the page, but I'm not sure this last practice was the best one to follow. Anyway, working with the root font size set by the browser and everything relative to that font-size was excellent for development and for the resulting websites.

Love to see content around accessibility and standards! Thankss!

Please do the other articles as well! That one was dope and the others seemed intriguing as well. Btw: this is actually the first time at all that I'll leave a comment under a YT video. So THAT'S how badly I want the others to be done 😆🙈

My company's graphic designer wants 12.185px font size or he will throw a hissy fit in front of the PM that it doesn't fit his "artistic vision", so 12.185px font size is exactly what he gets. On a serious note, this seems like a very interesting article to read.

I’d love to see more content based on Adrian’s posts

Old heads will know the 62.5% font size fuckery. It was on literally every project I worked on for many years. It's in the project I work on now... and yes, it's cursed. Modern CSS frameworks presume a 16px base font size so things like Tailwind rightly using rem values for styling don't work as expected. The hint values displayed in your IDE will be different than what is rendered and there'll be sizes that fall between your theme values that people will end up hard coding to get to the design spec. Removing the offending code makes the app look like it's rendered on a boomer's phone. Good times...

Thanks, really useful video. I just subscribed.

Please do all the posts!!! This is great!

Yes. We need all the video's! :D

Great vid, amazing info from that blog wow

Too bad Chrome has currently decided that the user's default menu size is too small and they need to add almost double the whitespace, making menus way too tall and need scrolling on every computer I own. (and, of course, scrolling menus are bad UI). To be fair, they copied it from Microsoft Edge, who also don't seem to trust the Windows developers to get the menu size right. And at least they don't copy the button size. Edge is unusable for me simply due to how many extensions I want to be able to quickly access.

Perfect timing on this one. Need to make some changes soon because of unresponsive zoom on a page. This will help me.

Thanks for that... excellent!

These are kind of things that makes web development such a pain in the ass.

Didn't even realize it, but I've been doing this for a long time. I don't set base font sizes in fixed units anywhere. I just open my page and put a paragraph and three or four headers, then set my headers to a size I like using the rem unit. If I really want my normal text to be larger, then I also use rem for that.

The main potential problem I see is zoom. That default OS size is only actually used on 100% zoom, and no one really uses that. Even Chrome defaulted to 120% when I opened it. Sites are designed around the idea that, if the font is too small, you'll zoom in, not increase the font size.

The only time I will use pixel font sizes, is in my program that is able to turn text into snap (similar to scratch) code blocks. The only reason is due to the fact that snap itself uses pixel font sizes.