Fonts again...

Typography is one of those things that the more I learn about it, the more I realise how little I actually know about it!

So I was reading a Six Revisions article on fonts in animation (Fundamental Typography Guidelines for Motion Designers) which led me to think more re fonts and the screen, which took me to reading their article on fonts and web design 'A basic look at typography in web design'.

Although in my past readings I'd discovered things like the difference between serif and sans serif, kearning, web safe fonts etc, I'd never really considered why you would pick one font sizing method in your CSS over another. I assumed it was just a personal preference thing and I had no idea there are actually quite a range of options! I'd inherited % sizing after seeing it employed by other people but usually stuck to pt myself as I was familiar with it, having used it in all of the word processing type programs I've used. It turns out this was a FAIL! Only the other day, in my cross browser tweaking trials and tribulations, I was cursing IE for the annoying way it was mucking about with my font sizes - what looked good on FF/Chrome/Safari zoomed right out in IE. Now I discover, it was a case of user error and I've been using the incorrect sizing method!

So it turns out pt is a unit of print measurement (which is why it's used in word processing programs, as the stuff produced by them is often (and used to be always) printed). Each browser treats pt differently, so I should have expected to encounter the issues I did!

Percentages are excellent to use - not only will proportions between font remain consistent across browsers (so you should in theory achieve the same effect in all cases), it also allows you to retain the design you intend even if the user has changed the browser font settings. Good design practice.