Member Fro… Posted June 11, 2009 Share Posted June 11, 2009 This topic was imported from the Typophile platform A bunch of years to late, but still: Here's my article on CSS font stacks. I'd love your opinions on it. I'm not a native English speaker, so please correct my language. Attachment Size font_stack_article.pdf 127.15 KB Link to comment
Member aar… Posted June 11, 2009 Share Posted June 11, 2009 Good work! You're providing a really good summary of what fonts are available where and multiple different options for font-stacks. The one thing I would really like to see are examples of the fonts in titling and body copy, since some stacks sit better in one or the other. One of the things that I have noticed with these font stacks are that the fonts often set wider or heavier than one another, even at the same font size, so being able to predict those differences would be useful. Here are some more sites that I've found useful: http://www.sitepoint.com/article/eight-definitive-font-stacks/ http://unitinteractive.com/blog/2008/06/26/better-css-font-stacks/ http://unitinteractive.com/blog/blog-images/BetterFontStacks.pdf But overall, it looks good! Link to comment
Member aar… Posted June 11, 2009 Share Posted June 11, 2009 Oh, and also something fun. Apparently Firefox 3.5's implementation of @font-face also makes use of the idea of stacks to help save on page weight: http://hacks.mozilla.org/2009/06/beautiful-fonts-with-font-face/ Interesting to consider! Link to comment
Member Fro… Posted June 11, 2009 Author Share Posted June 11, 2009 Hi Aaron. I intend something like that to be the follow-up. Hopefully a few different text sizes (9-12 px) with a display size (24px). It'll take a lot of work, especially with the Linux fonts. Link to comment
Member joe… Posted June 11, 2009 Share Posted June 11, 2009 Font names in CSS declarations must be enclosed in quotation marks if they include a space character, hence font-family: Franklin Gothic is illegal (though browsers quite likely would accept it and do what you intended). — Joe Clarkhttp://joeclark.org/ Link to comment
Member Fro… Posted June 11, 2009 Author Share Posted June 11, 2009 Thank you Joe. I'll make sure to fix that up for the final version. Link to comment
Member Fro… Posted June 11, 2009 Author Share Posted June 11, 2009 Shouldn't that be inch marks, btw? Link to comment
Member Fro… Posted June 11, 2009 Author Share Posted June 11, 2009 If you can spare a few minutes to help me out with some screen shots of the html files listed in the adress below, I will be very grateful. I need screen shots from different web browsers and platforms to see how the fonts appear. Fonts not installed on your system will display as a monospaced font. http://www.frodehelland.com/css_font_stacks Mail me at: frodefrodefrode (at) gmail.com Thanks! Link to comment
Member nin… Posted June 11, 2009 Share Posted June 11, 2009 I don't guess you need another OSX/Firefox user's screenshots… You might want to use one of those screenshot factories, like browsershots.org. That way you can quickly get comprehensive coverage of a ton of OS/browser configurations. I use such sites quite extensively for testing web designs FWIW. Link to comment
Member Fro… Posted June 11, 2009 Author Share Posted June 11, 2009 I need the screenshots from computers where the actual fonts are installed, doesn't I? Link to comment
Member nin… Posted June 11, 2009 Share Posted June 11, 2009 Oh, I thought you wanted to get a reasonably large sampling to see how likely all these fonts are to be installed on which browser/platform? Link to comment
Member par… Posted June 11, 2009 Share Posted June 11, 2009 I am getting a lot of Courier, probably because I run FEX and only activate the fonts I need ... Link to comment
Member Fro… Posted June 12, 2009 Author Share Posted June 12, 2009 Maybe I didn't explain good enough. Doing a survey on typophile would never reflect the fonts available to the rest of the world :) I'm trying to get samples of the fonts (and how they look with different rendering) to accompany my article. Link to comment
Member ken… Posted June 12, 2009 Share Posted June 12, 2009 I'm guessing you don't want a bunch of screenshots in which nearly everything is displayed in Lucida Grande because I don't keep any, except the most essential or basic, of those system fonts loaded, right? Link to comment
Member Fro… Posted June 12, 2009 Author Share Posted June 12, 2009 Have no use for those :) I have screenshots from Firefox and Safari running on OSX, I guess Windows won't be a big problem. Linux on the other hand. Link to comment
Member nin… Posted June 12, 2009 Share Posted June 12, 2009 Sorry Frode, then I did indeed misunderstand you. I've only got OSX (and emulated Windows) :-\ Link to comment
Member The… Posted June 12, 2009 Share Posted June 12, 2009 Just sent the shots from IE7, running on a real Windows XP machine. My home system is a few years older, perhaps I can find a few minutes to check if they are the same over there. Link to comment
Member ale… Posted June 13, 2009 Share Posted June 13, 2009 Great work! this is something i am too lazy to make on my own, but always have missed... The article is excellent. Bra jobba!! Alex /////////////////////////www.alexanderfjelldal.net Link to comment
Member Fro… Posted June 14, 2009 Author Share Posted June 14, 2009 Any of ye old crabs sport Microsoft Office 08 (OSX or Windows)? Link to comment
Member Don… Posted June 15, 2009 Share Posted June 15, 2009 Frode There are some mistakes in your text. I have identified and corrected the following: Web browsers depend on the users' own a list of typefaces where one takes over where the previous failed same way we use them in print is on its way Link to comment
Member Fro… Posted June 15, 2009 Author Share Posted June 15, 2009 Thanks Don. I've already corrected the top two. I'll look into the last one. Link to comment
Member Fro… Posted June 17, 2009 Author Share Posted June 17, 2009 Hi guys. I've been able to get hold of samples from Safari/Firefox in OSX (including the Microsoft Office 08 fonts), Firefox in Windows (with Cleartype) and to some extent Firefox on a Linux machine (still missing some fonts). I'm still trying to get hold of these: • Samples from earlier Safari editions (on Windows). It uses it's own rendering engine. Does any of you have it running? • I also need samples from Windows (Firefox or IE) without Cleartype. Thank you for all the help so far! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now