Chris Coyier's post at CSS-Tricks on the sans-serif CSS font stack got me thinking. When I see things like this, I usually think, "That's a cool hack, but how will it work on the many different platforms?" Especially Linux, since I'm a Linux user.
For quick reference, here's what he says:
font-family: sans-serif; /* don't specify Helvetica or Arial */
- Macintosh PC's get Helvetica by default, which is awesome
- Windows PC's get Arial by default, which is good because Helvetica doesn't look good on Windows
- All others get the browser's default sans-serif font by default
Well, Linux is in the "all others" category and there are issues:
- Ubuntu (the most used distro) uses the Ubuntu font by default. It's a nice font but has a different character, and more importantly, different metrics from Helvetica/Arial
- Many other distros use DejaVu Sans by default. Also nice (and more generic than Ubuntu), but it also has different metrics than Helvetica/Arial
I personally like Liberation Sans quite a bit. It's a great sans-serif font that is metrically equivalent to Helvetica and I find it nicer than Arial. It's installed on many Linux distros by default, so here's a simple modification that will make things just a little more uniform for many (not all) Linux users:
font-family: 'Liberation Sans', sans-serif;
While I haven't tested Liberation Sans on a Mac or Windows machine, MOST Mac and Windows users aren't likely to have it installed and, like I say, I prefer it over Arial, so it's OK if they do.
This still doesn't address mobile devices much, especially if they use Droid Sans by default (which I find characteristically a little closer to Trebuchet MS than Helvetica).
Last note: I'd personally only do this for body text, where different fonts aren't likely to break your layout. Menus, headlines, etc - be more specific about your font choice.
Anyway, those are my thoughts. Cheers.