Lovely on Mac, poor rendering on PC

Thanks Bryan. I thought as much. Windows deals us another blow to the head. Great work all the same. Really love Typekit.

Have to agree - when using Pill Gothic 600mg, the difference is remarkable.

Firefox 3.5 on OS X - font looks great.
Firefox 3.5 on Vista - font looks horrible.

I'm pretty much a noob when it comes to fonts, but this seems like a showstopper issue - if the fonts don't render well under Windows, then their use is savagely curtailed.

Is there a way to improve the rendering for browsers running on Windows ? Is there a list of fonts that are 'Windows-safe' ;-) ?

I have to agree with anu. Until the rendering on Windows improves, there is no point in using non-standard fonts. (Unless you are working on a site whose visitors are mostly Mac users, like a site for Mac software.) They do look horrible.

For now, I will use it only on our own portfolio site and put a condition on it so that it renders with the standard browser fonts for Windows users. So, only Mac users would see Typekit fonts.

By the way, when I run Windows under VMWare Fusion on Mac. The Typekit fonts don't work at all. Typekit's font browser displays all the fonts in default serif and sans-serif.

In case anyone is wondering, this is what I did in PHP:



<?php if (strpos($_SERVER['HTTP_USER_AGENT'], "Mac", 0) !== FALSE) { ?>

<script type="text/javascript" src="http://use.typekit.com/xxxxxx.js"></script>

<script type="text/javascript"<try{Typekit.load();}catch(e){}</script>

<?php } ?>



This way, if it's not Mac, the site would not use Typekit.

Thank you Dyske. Can't tell how things look on PC, will use your hack until things are sorted out.

Kudos for a dead-simple install, hope to be able to remove JS-kit as others have mentioned, already in WP.

Just want to add that there is a typo in Dyske's code which took me FOREVER to find lol - it's on the second line of scripts between "text/javascript" and try{Typekit

The pointy bracket should be pointing the other way. Hope this helps someone out!

oh, sorry about that. What happened was that this site (getsatisfaction.com) does not encode the brackets when you insert code blocks here. So, I had to manually encode all the brackets, otherwise it wouldn't display properly. I used the wrong encoding for that particular bracket.

Any news on a real fix ? My 30 day period is running out soon, and even though I really like typekit, I don't see much value in using it if a substantial number of the fonts won't render correctly on Windows.

I don't think there is anything to "fix". There is nothing wrong with Typekit. The problem is the font rendering quality of Windows. On XP (I don't know about Vista), if you turn on "ClearType", fonts render fine. But the problem is that ClearType is turned off by default, and so the majority of Windows users are not going to bother turning it on (they are not even aware of its existence.).

http://www.microsoft.com/typography/c...

So, I don't think there is anything much anyone can do about it. Could someone tell me if Clear Type is turned on by default on Vista?

I'm of the opinion that it's the font hinting and the fact that Mac probably deals with bad hinting better than Windows.

ClearType is enabled by default in Vista and Windows 7. In both cases, fonts are rendering very poorly (using FF3.5 and IE8) regardless of whether ClearType is enabled or disabled.

And I acknowledge that it may not be a Typekit issue, and thus beyond the ability of the Typekit team to fix.

But the issue seems critical to me, and so should be highlighted, and a list of fonts that are 'Windows-safe' should be created - otherwise...what's the point ?

I don't think it's an issue with some fonts not being "safe". Fonts like Verdana and Georgia were designed specifically to look good on computer screens. That's why they look decent even on Windows.

So, I suspect that, now with Typekit (and other font embedding services), many font designers will start designing fonts specifically for the web. So, the distinction will be "browser-optimized" vs. "print-optimized". I would imagine that the vast majority of the fonts that Typekit has right now are "print-optimized", and that's why they look bad.

Yep. That's what I'm thinking Dyske -- it's the hinting.

OK - but doesn't it make sense for the typekit guys to list out the fonts they currently provide that will render well on Windows ?

[edited to add - Ah - just logged onto typekit, and there's been a change to actually show the rendered fonts on screen before selection. Or has it always been like that ? In any case, it's easy to see what renders well and what doesn't, so that's great]

Anyway - I'll keep an eye on typekit, and if and when these issues are resolved (ie a large set of fonts that render well under both are provided), I'll more than likely re-subscribe.

My guess is that screen-optimized fonts will be in high demand because of these font-embedding services. I would imagine that a lot of design-conscious websites will be more than willing to pay a premium to use these fonts. Demand for print-optimized fonts (for the use on the Web) would probably be pretty small once enough screen-optimized fonts become available. I'm hoping that there will be a "gold rush" for screen optimized fonts, especially if font designers could name their own prices for their fonts. Perhaps, some fonts could become somewhat of a status symbol.

If enough money could be made from screen-optimized fonts, then the actual font files for print design could be given away for free. This will pretty much eliminate the concern for piracy. If the font files are free anyway, you couldn't "steal" them anyway. Giving away printer fonts for free would encourage and promote the purchase of these fonts on Typekit. As long as Microsoft and Apple do not include your fonts in their operating systems by default (which they will never do), web designers will need Typekit to use these fonts for the web. So, the piracy issue would essentially be a moot point. (Correct me if I'm wrong here. Because I'm not completely sure.)

-D

There is difference in rendering between two browsers on the same OS (Vista). IE looks darker than the Firefox for the same font-weight.

Typekit is brilliant brilliant brilliant. But like always, Microsoft doesn't want to play and there will have to be a work around - like every other neat thing that appears on the web and with software. Unfortunately the majority of my clients visitors will be on a PC, and therefore can not appreciate the awesomeness that Typekit can bring to the web.

I get all excited and then once again Explorer/Windows kills my joy.

I was referring to the whole crappy rendering that Window gives these awesome fonts. I know IE supports it, but it doesn't look beautiful as it does on Mac, It's jagged and poorly rendered - which is not typekit's fault. It's the no-brainers that made "ClearType" turned off by default.

Has anyone seen the rendering on Windows 7? It's the latest and greatest. If there's any hope for Windows in the near future, it would be with Windows 7.

Nope - many fonts still very ugly under Windows 7.

Typekit guys - what about a "works on windows" tag ?

FYI, there is something called a Clear Type Tuning tool in Windows and it helps a little bit, but not tremendously. Also, CRT monitors appear to render more clearly than LCD.

I think some of these text fonts are going to be more friendly across OS's and browsers in comparison to others. It would be good if TypeKIt can flag the top picks for text, and multi-OS / browser friendliness.

I found a combination that works in Windows. Safari on Windows actually has an option to use it's own OSX based font smoothing. I put it on medium and voila! The font smoothing is incredibly beautiful. I check Phil's and my own site to see the results. So, us Windows users really need to promote Safari?!

I'm really discouraged by the Windows rendering issue, which I became aware of when Ralf Herrmann posted a screenshot of how "the vast majority" (his words) of his readers see the @font-face rendering on the page, and it looked absolutely nothing like what I was seeing in Windows.

While it may be true that most (but not all!) of the visitors to Opentype.info use Macs, this certainly isn't true for most sites. So we can't use @font-face if the fonts look terrible in Windows. I was looking for a nice slab serif font for a site I'm working on, and tried both Madawaska and Superclarendon (slab serifs seem scarce in Typekit so far.) Both look seriously goofy in Windows (except using Safari with font smoothing), as you can see from the attached Superclarendon image - notice how the Ts and Es drop below the baseline, and the S looks like it's in Courier. These fonts can't be used on professional site in their current state.

(Click to enlarge):


I understand this isn't Typekit's fault, but is there hope for improvement in the short term, or do we just have to wait for the browser makers to improve their font rendering? The best idea in this thread so far is Anu's suggestion to flag fonts that look great in Windows, if indeed there are screen-optimized fonts on the list that render as intended with @font-face. Any other thoughts?

@BrightBold

I believe this is an issue with the hinting info of this font not being optimized for screen (and for that particular size), so the overshooting becomes overdone on screen. I suspect that for some fonts, the overshooting would be under-done (that is, letters like 'e' and 'o' look like floating above the baseline.).

Perhaps some font designers would re-work the hinting of their existing fonts. That could be a "short term" solution.