Comments on: Why I’m messing with fonts http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/ my semi-regular stream of consciousness Thu, 29 Jul 2010 06:54:22 +0000 hourly 1 http://wordpress.org/?v=3.0 By: Web typography fun with @font-face | STC AccessAbility SIG http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9951 Web typography fun with @font-face | STC AccessAbility SIG Wed, 12 Aug 2009 12:40:53 +0000 http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9951 [...] is the reason why John is messing with fonts in different browsers. It’s fun to watch his article load in the browser because the visual [...] [...] is the reason why John is messing with fonts in different browsers. It’s fun to watch his article load in the browser because the visual [...]

]]> By: John’s Blog http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9739 John’s Blog Fri, 31 Jul 2009 15:58:53 +0000 http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9739 [...] couple of days ago, I posted something about how I’m playing around with @font-face (and since then have also been experimenting with TypeKit, which I use for the headlines you see [...] [...] couple of days ago, I posted something about how I’m playing around with @font-face (and since then have also been experimenting with TypeKit, which I use for the headlines you see [...]

]]> By: david http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9721 david Wed, 29 Jul 2009 17:54:58 +0000 http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9721 I think they should just make it all-compatible. It sucks every browser has it's own interpretation of the code. Same for my site www.pchulpzutphen.nl I made it for Mozilla, IE sees it different somehow. Have a nice day! I think they should just make it all-compatible. It sucks every browser has it’s own interpretation of the code. Same for my site http://www.pchulpzutphen.nl I made it for Mozilla, IE sees it different somehow.

Have a nice day!

]]> By: Charles Bigelow http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9709 Charles Bigelow Tue, 28 Jul 2009 19:18:21 +0000 http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9709 "...among other things, we had a couple of classes about typesetters who were burned at the stake for typesetting heretical documents." Nice to hear, after all these years, that somebody remembers those classes. :-) Just in case the names and dates have faded from memory, here's a brief refresher. Antoine Augereau, Parisian printer and type designer, reputedly the teacher of Garamond. hanged and burned on Christmas Eve, 1534, on (supposedly trumped up) charges of printing heretical placards. Etienne Dolet, printer of Lyon and Paris, burned at the stake on August 3, 1546, in Paris, on charges of blasphemy, sedition, and selling prohibited books. Martin l'Homme, hanged in 1560 for printing a pamphlet against a Cardinal. That all happened a long time ago, but in the 20th century, Sophie Scholl, among others in the White Rose society, was guillotined on charges of treason, on February 22, 1943, for distributing pamphlets against Nazi genocide on the Eastern Front. I'm sure that somewhere there is good news about printers, too. :-) “…among other things, we had a couple of classes about typesetters who were burned at the stake for typesetting heretical documents.”

Nice to hear, after all these years, that somebody
remembers those classes. :-)

Just in case the names and dates have faded from
memory, here’s a brief refresher.

Antoine Augereau, Parisian printer and type designer, reputedly the teacher of Garamond. hanged and burned
on Christmas Eve, 1534, on (supposedly trumped up)
charges of printing heretical placards.

Etienne Dolet, printer of Lyon and Paris, burned at the
stake on August 3, 1546, in Paris, on charges of
blasphemy, sedition, and selling prohibited books.

Martin l’Homme, hanged in 1560 for printing a pamphlet
against a Cardinal.

That all happened a long time ago, but in the 20th
century, Sophie Scholl, among others in the White Rose
society, was guillotined on charges of treason, on
February 22, 1943, for distributing pamphlets against
Nazi genocide on the Eastern Front.

I’m sure that somewhere there is good news about
printers, too. :-)

]]> By: Dwayne Bailey http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9705 Dwayne Bailey Tue, 28 Jul 2009 14:09:13 +0000 http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9705 I'm always surprised to see who has a passion for fonts. Mine started and stopped at adding the Venda characters ḓṱḽṋṅ to DejaVu - lets see if Axel can handle those characters. I've been really excited about @font-face because it will really help solve a serious problem for African languages. the problem is that most fonts that are distributed with computers don't support all of the characters needed by African languages. With @font-face it now becomes possible for a web designer to supply a font that does have all the needed characters. Think Wikipedia and other massive crowd-source like applications. Over at the ANLoc (African Network for Localisation) project the fonts sub-project http://www.africanlocalisation.net/en/fonts has made a list of all the Latin glyphs needed for African orthographies and have been adding them to some FOSS fonts. The list allows other type designers to ensure their fonts are African ready. The 10 fonts ensure we actually have good fonts for Africa. Combine those fonts with @font-face and we have a problem solved. I’m always surprised to see who has a passion for fonts. Mine started and stopped at adding the Venda characters ḓṱḽṋṅ to DejaVu – lets see if Axel can handle those characters.

I’ve been really excited about @font-face because it will really help solve a serious problem for African languages. the problem is that most fonts that are distributed with computers don’t support all of the characters needed by African languages. With @font-face it now becomes possible for a web designer to supply a font that does have all the needed characters. Think Wikipedia and other massive crowd-source like applications.

Over at the ANLoc (African Network for Localisation) project the fonts sub-project http://www.africanlocalisation.net/en/fonts has made a list of all the Latin glyphs needed for African orthographies and have been adding them to some FOSS fonts. The list allows other type designers to ensure their fonts are African ready. The 10 fonts ensure we actually have good fonts for Africa.

Combine those fonts with @font-face and we have a problem solved.

]]> By: John http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9704 John Tue, 28 Jul 2009 14:01:02 +0000 http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9704 @Wolf: yes, for sure -- I just haven't had time to really spend with things -- you'll note that I've got bad decisions all over the place -- gray on white type for comments, too small, etc. Just haven't had a spare few hours to tweak. I think it takes a bit of time. @Wolf: yes, for sure — I just haven’t had time to really spend with things — you’ll note that I’ve got bad decisions all over the place — gray on white type for comments, too small, etc. Just haven’t had a spare few hours to tweak. I think it takes a bit of time.

]]> By: Wolf http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9701 Wolf Tue, 28 Jul 2009 11:13:42 +0000 http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9701 I like the fact that you're experimenting with @font0face – – but the bad part is that Axel is not easily legible (on a screen) somewhere south of 14px, so these comments here are particularly hard. And that's with a font by Spiekermann, that has been carefully designed for the screen. People are forgetting that most of the fonts we admire weren't made for screen. I'm suspecting we're going to see a lot of non screen optimized serif fonts (e.g. print classic Bembo) which doesn't really help anyone, apart from being pretty. I like the fact that you’re experimenting with @font0face – – but the bad part is that Axel is not easily legible (on a screen) somewhere south of 14px, so these comments here are particularly hard. And that’s with a font by Spiekermann, that has been carefully designed for the screen.

People are forgetting that most of the fonts we admire weren’t made for screen. I’m suspecting we’re going to see a lot of non screen optimized serif fonts (e.g. print classic Bembo) which doesn’t really help anyone, apart from being pretty.

]]> By: John http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9699 John Tue, 28 Jul 2009 03:56:21 +0000 http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9699 @boris i believe so, yes. it was daggett et al that noticed, naturally. :-) @boris i believe so, yes. it was daggett et al that noticed, naturally. :-)

]]> By: Boris http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9698 Boris Tue, 28 Jul 2009 03:50:46 +0000 http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9698 John, the "ff" bug is filed, right? John, the “ff” bug is filed, right?

]]> By: morgamic http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9696 morgamic Tue, 28 Jul 2009 02:01:38 +0000 http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9696 "type-setting" here refers to the text and font properties. Stuff like line-height, letter-spacing and word-spacing among others could be used. But not sure it's worth it to load those then toss them. http://www.w3.org/TR/CSS2/text.html http://www.w3.org/TR/CSS2/fonts.html Should also note that Safari cheats for apple.com since their font is distributed w/ the browser. So at least on their domains there's no delay or content shift for that reason. :) “type-setting” here refers to the text and font properties. Stuff like line-height, letter-spacing and word-spacing among others could be used. But not sure it’s worth it to load those then toss them.

http://www.w3.org/TR/CSS2/text.html
http://www.w3.org/TR/CSS2/fonts.html

Should also note that Safari cheats for apple.com since their font is distributed w/ the browser. So at least on their domains there’s no delay or content shift for that reason. :)

]]> By: Dave Dash http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9695 Dave Dash Tue, 28 Jul 2009 01:55:11 +0000 http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9695 I wonder what the uncached experience would be if you implemented some of the tricks from the Yahoo! Exceptional Performance team (e.g. cookie-less domains http://developer.yahoo.com/performance/rules.html#cookie_free). Basically anything to get the font into the users browser faster. I totally understand LoriHC's point of view of the "jarring" experience when the font changes - but at the same time I don't want to wait. Caching however did help quite a bit (the content loaded fast and pretty) - my guess for the future is font-repositories served via CDN that allow for cross-site font-sharing will help alleviate the slowness... why self-host any font when someone else has it, and it's bound to be in someone's browser cache - or we may start caching fonts differently. I do feel that the load-content-first approach is the safest - especially for the broader audience that Firefox serves. Not everyone is on fast internet connections. When cached though, when things occur will be a moot point. -d I wonder what the uncached experience would be if you implemented some of the tricks from the Yahoo! Exceptional Performance team (e.g. cookie-less domains http://developer.yahoo.com/performance/rules.html#cookie_free).

Basically anything to get the font into the users browser faster.

I totally understand LoriHC’s point of view of the “jarring” experience when the font changes – but at the same time I don’t want to wait.

Caching however did help quite a bit (the content loaded fast and pretty) – my guess for the future is font-repositories served via CDN that allow for cross-site font-sharing will help alleviate the slowness… why self-host any font when someone else has it, and it’s bound to be in someone’s browser cache – or we may start caching fonts differently.

I do feel that the load-content-first approach is the safest – especially for the broader audience that Firefox serves. Not everyone is on fast internet connections. When cached though, when things occur will be a moot point.

-d

]]> By: morgamic http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9694 morgamic Tue, 28 Jul 2009 01:41:36 +0000 http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9694 LoriHC has a good point - although in a lot of cases content shifts while images are loaded as well. To prevent content shifts you can define how large the image is in the DOM so it reserves its space while the actual image file is loaded and rendered. Hypothetically, could mess with CSS to define all your type-setting dimensions to get something like arial pretty close to the defaults imposed by an explicit font and at least minimize the content shift. Might be worth trying to get pretty close to the same experience between webkit and gecko browsers. LoriHC has a good point – although in a lot of cases content shifts while images are loaded as well.

To prevent content shifts you can define how large the image is in the DOM so it reserves its space while the actual image file is loaded and rendered.

Hypothetically, could mess with CSS to define all your type-setting dimensions to get something like arial pretty close to the defaults imposed by an explicit font and at least minimize the content shift.

Might be worth trying to get pretty close to the same experience between webkit and gecko browsers.

]]> By: LoriHC http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9693 LoriHC Tue, 28 Jul 2009 01:26:38 +0000 http://john.jubjubs.net/2009/07/27/why-im-messing-with-fonts/#comment-9693 I read this post in Firefox 3.5, of course (because it's my default browser, and thus where the link opened when I clicked on your Tweet), and the first thing I noticed was the font change about 3 seconds in. If you'd asked me about the WebKit vs. Gecko way of handling font loading without showing it to me, I would have said I'd want my content first. In practice, I think I prefer the WebKit way... though I might be biased now because I knew what to expect when I opened your post in Safari. Hard to know if I would have been more puzzled by the mostly-blank screen for 2 or 3 seconds if I hadn't known that it was waiting for fonts to load. The reason I think I prefer the WebKit way, fwiw, is that when the font changed in Firefox, I'd already started reading -- and the change made me lose my place. How much of an annoyance this would be if it happened on a regular basis depends on how fast the fonts load, I suppose. I read this post in Firefox 3.5, of course (because it’s my default browser, and thus where the link opened when I clicked on your Tweet), and the first thing I noticed was the font change about 3 seconds in. If you’d asked me about the WebKit vs. Gecko way of handling font loading without showing it to me, I would have said I’d want my content first. In practice, I think I prefer the WebKit way… though I might be biased now because I knew what to expect when I opened your post in Safari. Hard to know if I would have been more puzzled by the mostly-blank screen for 2 or 3 seconds if I hadn’t known that it was waiting for fonts to load. The reason I think I prefer the WebKit way, fwiw, is that when the font changed in Firefox, I’d already started reading — and the change made me lose my place. How much of an annoyance this would be if it happened on a regular basis depends on how fast the fonts load, I suppose.

]]>