Hacker News new | ask | show | jobs
by tiddchristopher 5451 days ago
I agree with most of your post. I'm not saying designers should actively hinder accessibility or make users uncomfortable. We should do the opposite.

Still, in 2003, ems might have been best practice. In the modern web, ems and pixels are equivalent when it comes to scaling. One shouldn't avoid a good tool because it's hard to learn. (Example: I use Vim for all my coding.) However, one shouldn't use a tool just because it's hard to learn. Ems, in my opinion, introduce bugs, make planning more complicated, and have no meaningful benefits.

Using ems is like avoiding functions and instead duplicating code everywhere it's needed. Ems behave differently depending on their scope, and they're a pain to keep track of.

There's a similar issue with percent-based sizing. Let's look at some css:

*{font-size: 75%} h1{font-size: 125%;}

What size is h1? I honestly have no clue without a calculator. It almost definitely contains fractional pixel value. There's no way I'm getting appropriate vertical rhythm with percents. It's the same for ems.

I might be entirely wrong. Maybe I'd fall in love with ems if I started working with them regularly. It's a personal choice, from my understanding of modern browser scaling. Pixels are a completely valid method.

1 comments

First, please don't ever do something like "* { font-size: 75%; }" ; that literally means "take whatever readable font size the user's browser wants to use and shrink it by 25%". In other words, it means I'll almost certainly hit Ctrl-+ until the font grows back to 100% and the rest of your page will scale accordingly.

Second, I can easily tell you exactly what size h1 is: 25% bigger than the rest of the text on the page. If you're just going to start by assuming the browser has a given point size by default, and fill in percentages that result in exactly the point sizes you think the user ought to see, you're not really thinking in relative sizes, and you might as well use absolute sizes.

What method do you want to use to determine the font-size of h1? Presumably you have some idea in mind for how it should contrast with regular text. Try to answer that question without actually knowing the exact point size of the rest of the page text. If you can, then use that relative size in your CSS. If you can't, then perhaps browsers need more capable CSS so you can express what you want. :)

I agree. I gave that code as an example of a bad idea. For me, "If you can, then use that relative size in your CSS", has never been an option. Ems also have the same sizing problems regarding not knowing the browser's base text size.

I'm sticking with the quite capable pixel unit for the foreseeable future. :)