27 Oct 2009 9 am eastern

Fonty font font

It’s the Fonty-Fresh™ thang! UPDATE: Now with further explanations and Mr Zeldman’s specific concerns for web designers, web users, and the future of type on the web.


Short URL: zeldman.com/?p=2782

Filed under: Fonts, links, spec, Standards, webfonts, webtype

37 Responses to “Fonty font font”

  1. Jenea said on

    yOHOHOOOOOOO i am first!~!~!~~

  2. Olly said on

    I know the Firefox peeps are doing a lot of work on making fonts look good on Windows (using the new direct write apis on Vista and 7). Alas, thanks to limitations with Cleartype’s handling of CFF fonts, I don’t think they can do much about them for XP…

  3. Chris Harrison said on

    Just force Windows users to use Safari as their default browser. Problem solved! ;)

  4. Chris Cavallucci said on

    I just received my welcome to Typekit.
    http://typekit.com/
    I’m looking forward to trying it. Much to learn.

  5. Paul Campbell said on

    @Chris

    Or not. Safari on windows does not necessarily help the dodgy font rendering situation…

    http://www.codinghorror.com/blog/archives/000884.html

    (And I’m really not overly enamoured with windows… not trying to start an argument here)

  6. Luke Dorny said on

    This article should have been posted in Hobo. That would have turned more heads!

  7. Justin King said on

    @Chris:

    Or better yet, force Windows users to switch to Mac. :D rofl

  8. Ryan Brunsvold said on

    J,

    Pardon the link interruption but akin to the “Trajan film posters” link, poke around http://www.annyas.com/screenshots/ It’s a site dedicated to movie title screens. Really fantastic collection of composition and typography.

  9. Jeffrey Zeldman said on

    Fantastic link, @Ryan Brunsvold!

  10. Richard Fink said on

    Your post contains two instances of “fonts look bad in Windows”.
    Which fonts?
    At which sizes? (Very much key.)
    Looking good as in “looking pretty” doesn’t necessarily equal “readable”.
    Feeling like the brush is overbroad, please explain.

  11. Jeffrey Zeldman said on

    @Richard Fink, like I said, I’ll write an actual post about all this soon. The summary was just a summary (due to lack of time). If you follow Ben Kiel’s link (bullet point #2) you’ll get a technical explanation which you may or may not be able to follow. (I’m not sure I follow a lot of it.) Fonts contain hints; operating systems can ignore these hints or enforce them “excessively.” EOT contains no hints and looks pretty bad. Compare web-licensed Franklin Gothic in EOT (as seen in IE6-8) with Franklin Gothic set in sIFR, and tell me which is legible and aesthetically pleasing, and which looks like terrible. (Hint: the EOT looks terrible.) OTF is better, of course, but still ugly and deformed in many Windows set-ups. Compare the same page in Safari 4 on a Mac and Firefox 3.5 on a year-old Windows PC. (Hint: Firefox is not the problem.)

  12. Marq said on

    Once you can recognize Trajan, though, it’s pretty much everywhere: book covers, signs, on buildings, on food packaging! The only thing I did today was take a quick trip to Chapters, and I swear, it’s following me around. I’m being haunted by a font!

  13. Richard Fink said on

    >EOT contains no hints
    Not right at all. An EOT file – by spec – is just a wrapped version of a TTF file, hints and all. If it’s not being rendered by the browser in Windows exactly as if it was installed in the OS, something has gone wrong.
    If hinting has been stripped, something has gone awry in the conversion process.
    >OTF is better
    Not right. All depends. TrueType and OpenType, as formats, are extremely similar but with TrueType fonts nearly always containing the hinting info you’re saying isn’t there. Plus there is a flavor of OTF, OTF CFF (Compressed File Format) which is very common, used much by Adobe, and is an outline format containing no hints.
    Clear? Confusing?
    Judge not from a single article written 2 1/2 years ago. That’s a decade in Internet years, you know that. It sounds like you’ve run into a frustrating situation somewhere (Franklin Gothic?) and are extrapolating from that a general principal.
    No fanman, I. I see the good, the bad, and the ugly quite clearly.
    But Mac, Windows, or ‘Nix – it just ain’t that simple.
    As always, looking forward to what you’ve got to say.
    Rich

  14. Josh said on

    Well, I do not have any technical knowledge on font file formats and the like, but as a general appreciator and design enthusiast, I must say that fonts are generally sharper looking on the mac. I dont know why (and yes I know there are many reasons) but sIFR fonts on windows look duller and less visually enticing. This opinion is based purely from a design perspective and not from the standpoint of readability.

  15. Erik van Blokland said on

    @Richard Fink: Plus there is a flavor of OTF, OTF CFF (Compressed File Format) which is very common, used much by Adobe, and is an outline format containing no hints.

    I’m not sure where this is coming from, but OTF CFF can definitely contain hinting information, and most of them do.

    @Zeldman: EOT contains no hints and looks pretty bad

    EOT is a wrapped TrueType font and can also contain hints.

    Check facts please.

  16. Brook Elgie said on

    @Zeldman “Compare web-licensed Franklin Gothic in EOT (as seen in IE6-8) with Franklin Gothic set in sIFR

    You can’t use sIFR to prove a point about hinting. sIFR (AS2, published for Flash Player 8) doesn’t use the font’s hinting instructions. Its text-renderer (Saffron) has its own automatic grid-fitting algorithm.

    nb: Flash Player 10 can make use of PostScript hints, if the author specifies it, but that’s not what sIFR targets.

  17. Richard Fink said on

    @erik
    If I am wrong about hinting being present in most CFF files, then, my apologies. My info is based on observation – not exhaustive but I’m not making things up without having done some looking, either. And I am also relying on explanations about the nature of the format from experts who use it everyday. You too, are an expert, and your statement doesn’t gibe with theirs, unless I’ve misunderstood something.
    An example of a CFF font with hinting would be appreciated.
    I’ll now be looking more closely and seeking clarifications.
    I’m with you on getting the facts straight.
    Rich

    @zeldman
    None of this is to say there aren’t font rendering issues in Windows. There sure as hell are. But as Erik put it: check facts. People who have been studying the problems of font rendering for decades disagree.

  18. DN said on

    In my experience, Firefox, even 3.5, on XP renders any font in a less polished manner than IE7+ or, of course, Safari on the same machine, especially at smaller font sizes. So if they’re using Vista/7 to improve, great, but it’s being done on XP.

    And, man, typography on the web feels like the most arcane thing, like I should be busting out some black candles and crystals whenever the discussion starts. Would be glad to have some clear light thrown on it.

  19. Jeffrey Zeldman said on

    Check facts please.

    @Erik van Blokland: I was misinformed. Thanks for the correction. So why does EOT look crummy in IE? And why do fonts look decidedly worse in Windows?

  20. runbay said on

    Must make some work on CSS.

  21. Philip said on

    A few screenshots, all made on Win XP:

    Georgia on Firefox 3.5
    Georgia on Explorer 8.0
    Georgia on Safari 4.0

    Note: view them full size. Will add Mac OS X Safari shots once I’m at home. :)

  22. Jeffrey Zeldman said on

    @Philip:

    Hmm. We know that Georgia looks good across platforms. The question isn’t about system fonts and Microsoft’s “web fonts” from the 1990s. It’s about embedding real, non-system fonts on web pages via standard CSS.

    As far back as 1998, CSS2 provided a way to link to real fonts from your style sheet. Hakon Lie’s CSS at Ten awakened designers’ interest in using this technology, and Firefox and Safari now support it natively. Microsoft has supported it natively since IE4, but only for Embedded Open Type, a proposed standard font format that enables embedding while making piracy more difficult. Type foundries are on the verge of agreeing to standards that will allow embedding but protect the font designer’s investment in her intellectual property. They are on the verge but not there yet. In the absence of a single standard, individual foundries are releasing web-licensed fonts with various means of protection, and smart start-ups like Typekit are filling the void with licensing and technical support.

    We have the fonts, we have the CSS and the workaround for IE. What we don’t have is beautiful, reliable, consistent cross-platform rendering of real fonts like Gotham, Franklin, Garamond, etc.

    This is because operating systems don’t agree on how to render fonts, and neither do browsers.

    As a web designer, it’s my informed subjective opinion that embedded real fonts look better on Macs and worse on Windows. I believe that opinion would be shared by many designers, presented with a side-by-side comparison. Windows is by far the dominant computing platform and will remain so at least in the near term. (What happens if cloud computing replaces desktop computing as the norm is still anyone’s guess.)

    I hope designers, font designers, and Microsoft can work more closely together in the near term, so that real font rendering on the Windows platform can greatly improve. If this doesn’t happen, our ability to use real fonts in web design will be impeded, and our medium will be held back from developing true typographic standards. Either that, or millions will have the unhappy experience of trying to use crappy looking, hard-to-read web pages. This is already happening on some pages that could win awards when viewed on a Mac, but may be ugly and difficult to read in, say, Windows XP.

  23. Jonas said on

    Totally agree. I skipped using TypeKit because of this — I’d rather Windows users see good looking pngs than bad-looking text, at least for stuff like logos/mastheads.

  24. Thorvald said on

    Amen, Jeffrey. I totally agree.

    We are currently experiencing that issue while testing a new website for client.

  25. elpaulito said on

    I have been steering away from typekit as well. I love the idea, but, since MS doesnt want to play nice…… why out in the work?

    How is font rendering in the new MS OS? I have not looked? Are they still jag?

  26. Alex said on

    There is Windows 7 with a better ClearType (my opinion). On all other versions of Windows, I directly switched of ClearType, but since Windows 7 RC I let it do its job.
    And with all the Apple-love around, you should consider that there is an option to disable the font smoothing on OSX and many “nerds” so this.

    An all Websites we use sIFR and I think its the best solution (for Headlines), cause the fallback to normal CSS styling is a good one.

  27. AJ Kandy said on

    Cloud computing may move the guts of an operation away from the desktop, but unless broadband gets as fast as a DVI connection, I’m guessing font rendering will almost always happen on the client device. This is why choosing the right subpixel rendering algorithm is important. I prefer the Mac OS’s way of doing it, but I’ve met plenty of people that like their fonts pixelated, because they complain that ClearType etc is “too blurry.” How do you accommodate everyone’s preferences?

  28. Jairus said on

    While we’re at it, Microsoft missed a great opportunity when they completely fucked up the metrics of the new Vista Web Fonts. The caps height and x-height are much smaller than they should be, which means you can’t just add Calibri/etc. to your font-family declarations and have it look good.

  29. Carlos said on

    Totally agree! I’ts really frustrating to see a site we design in mac and then take a look at it in windows. Even Arial looks awful.

  30. Scott Cranfill said on

    You hit the nail on the head, Jeffrey.

    As a designer, I’m excited about the possibility of rich Web typography. On the other hand, as a Windows user (who prefers to browse and develop in something other than Safari), every time I go to a website with body copy set in anything other than the Core Fonts for the Web or the new ClearType Collection, I want to stab myself in the eye with a fork.

    I do wish Microsoft or browser-makers would improve rendering of the more adventurous fonts, but until that becomes widespread, I implore designers to stop using other fonts for body copy! (Display type is generally okay.)

  31. jllk said on

    EOT is stopping font piracy as much as WMA stopped music piracy!

    Please don’t repeat foundries’/microsoft’s false dychtomy.

    Pirates will simply continue to use TTF, and convert TTF to EOT when needed. Non-official tool is much easier to use than Microsoft-sanctioned one.

    And nobody cares about downloading individual fonts off the sites when you can get 10,000 font DVD torrent.

    You haven’t ever tried to pirate fonts, have you? :)

  32. Jeffrey Zeldman said on

    Please don’t repeat foundries’/microsoft’s false dychtomy.

    I’m repeating Microsoft’s rationale for creating the Embedded Open Type format, not stating an opinion about piracy and whether EOT or any format can prevent a dedicated thief from stealing fonts.

    You haven’t ever tried to pirate fonts, have you?

    Funny story.

    I stole fonts through not knowing any better when I first started using a Macintosh to do art direction.

    Here’s how uninformed I was. I not only didn’t know what I was doing was stealing, I also didn’t know how to do it. I took home bitmaps on a floppy drive, not realizing they were useless without the Postscript file. When I brought them home, I wondered why they were jaggy—and I kind of dug the jaggy look. It felt “computery.” Years later I would deliberate incorporate jagginess into my earliest website designs, to communicate “internetiness,” “computerness,” etc.

    Of course we were all having fun visually with jaggies and visible pixels and extremely limited color palettes back at the start of web design. Calling attention to the medium was just the postmodern thing to do.

    I suppose if we had been around at the beginning of cinema, we would have made sure the sprocket holes showed up onscreen.

    But I digress.

    Windows and real type on the web. That is the question.

  33. Michael said on

    As a designer of websites, I’m looking forward to this. As a user of websites, I am a little fearful. Poorly designed websites that thwart usability will now have the added option of ill-advised typeface choices.

    I am also curious about the aggregate effect on the average web experience. Do users currently benefit from a limited number of options, specifically when it comes to body copy, when moving from site to site? Will widespread use of embedding fonts change this?

  34. Jeffrey Zeldman said on

    @Michael said:

    As a designer of websites, I’m looking forward to this. As a user of websites, I am a little fearful. Poorly designed websites that thwart usability will now have the added option of ill-advised typeface choices.

    Agree with you. But that has been true of every advance on the web, from font size to JavaScript. 9px Arial. Pages that fail if you’re not using the “right” browser, don’t have scripting turned on, can’t use a mouse, etc.

    With every advance, some bad sites get worse, but the medium crawls forward.

    (I kind of think this is the story of human history.)

  35. House Party – Jeffrey Zeldman Presents The Daily Report said on

    [...] The Problem: We have the fonts, we have the CSS and the workaround for IE. What we don’t have is beautiful, reliable, consistent cross-platform rendering of real fonts like Gotham, Franklin, Garamond, etc. — 29 October 2009 [...]

  36. Font is a Four Letter Word. said on

    [...] Does all this reading about fonts make you want to read more about fonts? Us too. Feed your font goat his fill. [...]

  37. Michael Kozakewich said on

    IE9 has plans to change from that older rendering to an ActiveX-based font rendering. A screenshot they posted looks like quite a difference, but one never knows if that’s exactly what would happen, or if it’s an artist’s rendition.

    Hopefully, fonts will at least look good in IE9, even if IE7 and IE8 continue to look sloppy.
    I have no clue where Firefox is, as far as font-rendering is concerned.
    It would be interesting, though, to see where things are different between installed fonts and embedded files.

    (PS. Oh! I notice you got rid of the hot fire question! Have you noticed changes in spam rates?)

Comments off.