Comments on: Font metrics and vertical space in CSS

By: Font indir

Font indir — Wed, 29 Sep 2010 15:56:33 +0000

Your conclusions here seem very interesting at a glance, Kutlu. Thank you for sharing this research!

By: zandyring

zandyring — Wed, 04 Aug 2010 14:02:59 +0000

In reply to zandyring.

Tim – great to hear.
Keep up the awesome work!
-Z

By: Richard Fink

Richard Fink — Sat, 24 Jul 2010 11:49:02 +0000

Important research, Tim.
Somebody, dang it, has to understand how browsers use the internal font data and the platform rasterizers so, hopefully, we can all be clued in and know what the heck to do.

Keep at it and thanks.

Rich

By: Tim Brown

Tim Brown — Fri, 23 Jul 2010 20:17:21 +0000

In reply to zandyring. Very cool idea, Zandy. We're definitely looking forward to typesetting recommendations (we started with some very general stuff—fonts tagged paragraph and headline that work well in those contexts), and the consistency that will come as a result of our Partner Tools will be a solid foundation for font math manipulation, including normalization by baseline/x-height/whatever.

By: Tim Brown

Tim Brown — Fri, 23 Jul 2010 20:10:14 +0000

In reply to Kutlu Çanlıoğlu. Your conclusions here seem very interesting at a glance, Kutlu. Thank you for sharing this research!

By: Kutlu Çanlıoğlu

Kutlu Çanlıoğlu — Fri, 23 Jul 2010 19:57:40 +0000

This is what i found the difference between how tools that we designers use like Photoshop, InDesign or Illustrator and HTML/CSS duo:

http://www.kutlux.co.uk/images/type_discrepency/html-inDesign_discrepency_v2.pdf

I hope you find it useful, and I would appreciate any feedback.

Thanks

By: Evan Mugford

Evan Mugford — Wed, 21 Jul 2010 10:39:02 +0000

I really enjoyed reading your article, and it passed some time at the end of my shift :) Thanks Moddish Website Design Firm

By: Alex

Alex — Thu, 15 Jul 2010 17:21:31 +0000

I ran into this very issue yesterday when de-bugging a Heading 1 font for IE6/7. The quick fix, since the font style was uniform throughout the H1 class, was to increase the line-height to about 1.5em in the IE stylesheet.

Looking forward to the next article that shows how to manage multiple sizes and vertical spacing in different browsers.

Thanks

By: zandyring

zandyring — Thu, 15 Jul 2010 13:41:07 +0000

A handy feature that I could imagine coming out of this is a “recommended point size / line-height” note in the font preview (maybe in the “Weights & Styles” tab), so users like me, who use WordPress but haven’t upgraded for full CSS control, can firebug the CSS to compare the line-height defined (if any) and pick fonts that match that. I think it could cut down on trial and error of choosing the best font for a particular application for inexperienced users. It’s great to read a bit more about the mechanics that go into Typekit! Thanks,
-Z

By: Christian Augustin

Christian Augustin — Wed, 14 Jul 2010 17:46:34 +0000

Hey, great! The really “nice” part of all this is that you get different baseline positions (for the same font!) with different browsers (and browser versions) and operating systems, and combined with differing behavior related to font-size and line-height, this is really a big mess. Let’s see if you can make some sense out of it …

Hopefully, Christian