Css-protips: Please don't suggest to use px values for font-size

Created on 27 May 2016  Â·  3Comments  Â·  Source: AllThingsSmitty/css-protips

Most helpful comment

@nhoizey That's a very interesting way of defining font size. Congrats on that. But can you please elaborate how you got to this specific value .8em+.3vw+.3vh? What reasoning did you use?

But in general I think your font size settings are the way to go in the typographic world of things. It's just that you should also include/incorporate some sort of content width/content grid and font family into this expression. If we look at typographers' text block width table this should become the _golden standard_ of setting readable font size based on text block width and font used. Viewport size may even be obsolete unless it's content uses 100% its width.

The usual _typographer's bible_ (Elements of Typographic Style — _Robert Bringhurst_) has this table with width/font size/character count values
image
If I have to create a website for readability I try to base sizes according to my grid/text block size and this table or at least approximate on it.

All 3 comments

@nhoizey thanks for the feedback. Your post is interesting. Are you advocating more for just html { font-size: 1em; } to let the default value be interited per browser?

@AllThingsSmitty thanks for reading it! ;-)

html { font-size: 1em; } is useless, as it is the default value. So I would advocate for nothing at all.

To be honest, I now use something a little more complex on the body to add some fluid responsiveness to my font-size, but I don't touch the html font-size at all and the value on body is meant to be equal to 1em or more, depending on viewport sizes.

@nhoizey That's a very interesting way of defining font size. Congrats on that. But can you please elaborate how you got to this specific value .8em+.3vw+.3vh? What reasoning did you use?

But in general I think your font size settings are the way to go in the typographic world of things. It's just that you should also include/incorporate some sort of content width/content grid and font family into this expression. If we look at typographers' text block width table this should become the _golden standard_ of setting readable font size based on text block width and font used. Viewport size may even be obsolete unless it's content uses 100% its width.

The usual _typographer's bible_ (Elements of Typographic Style — _Robert Bringhurst_) has this table with width/font size/character count values
image
If I have to create a website for readability I try to base sizes according to my grid/text block size and this table or at least approximate on it.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

AllThingsSmitty picture AllThingsSmitty  Â·  37Comments

monkbroc picture monkbroc  Â·  3Comments

dpw picture dpw  Â·  3Comments

prasannavl picture prasannavl  Â·  3Comments

max picture max  Â·  3Comments