Google Chrome 35 beta adds much needed DirectWrite font rendering on Windows

Web designers rejoice. The jaggies are gone!

Fonts in Chrome on Windows no longer look like they’re from the XP-era. Thanks to a new experimental flag added to the latest version of the Google Chrome beta (35.0.1916.27 beta-m), Chrome is finally rendering fonts with the advanced DirectWrite font rendering engine.

For a before and after comparison, here’s one I compiled with the Windows.com website. The effect is most noticeable on big curves like the “a” and bends of the question mark.

chrome-directwrite

Simply open the Chrome experiments screen chrome://flags/#enable-direct-write and “Enable DirectWrite“, then relaunch Chrome for the change to take effect.

chrome-flags

20 insightful thoughts

    1. You can’t seriously tell me that the larger fonts’ jaggyness didn’t bother you. Yeah, it may have been marginally sharper on small fonts, but the big ones… ugh!

  1. On my Windows 8 notebook, Chrome 35 with DirectWrite actually appears a bit more readable because body text is darker. However, heading text is more readable and looks nicer with DirectWrite enabled. Image 3’s setup is what I am using right now.

    Finally, I wish Microsoft would us to re-enable ClearType on IE and Office and not force grayscale anti-aliasing.

  2. DirectWrite disabled is actually more readable in that screenshot and the differences in the zoomed-in text are minuscule, not to mention the Windows 8 greyscale version looks more ‘correct’. Wake me up when Windows font rendering is as good as OS X.

  3. This new rendering mode is now on my default (final 35 release). Problem is, it’s breaking some sites’ menus. In these cases, DirectWrite is adding one or two extra pixels of width to the text of menu elements, and is doing so after any padding is applied. For example, if there is an anchor tag (My Index) which has a padding value of 12px, the words “My” and “Index” appear on their own lines.

  4. DWrite ClearType adds y-direction antialiasing, resulting in smoother horizontal curves at larger sizes but fuzzier rendering at text sizes for many fonts. DWrite also applies CT to CFF PostScript fonts, not just TrueType. DWrite rendering uses sub pixel positioning for more natural glyph spacing, at the cost of less consistency in glyph representation.

    I’m not sure whether MS classifies the greyscale rendering in the Win8 Metro environment apps (incl. IE) as technically a flavour of ClearType or not. It uses asymmetric scaling and sub pixel positioning, like DWrite CT, but not sub pixel colour rendering; again, this affects consistency of glyph representation.

  5. This is a tangentially related question. Does anyone know how Google gets the fonts they display on their Google Fonts site to look decent, even in Chrome (without DirectWrite enabled.) I used some fonts from Google Fonts, on Google’s site they look great, on my site they look jagged. I had to resort to the SVG trick and am patiently waiting for Chrome 37 to be released and get a decent adoption rate.

  6. I have no doubt that DirectW and ClearType have both positive effect and drawbacks. Cleartype appear to be noticeably better for small fonts, while DW appear better on large fonts. In my humble opinion users should have a CHOICE. I actually prefer ClearType much more, because all pages are rendered consistently as they are supposed to be. DW produces some “strange” artifacts both on eBay and on Facebook, that i really dislike. So… bye bye IE11 where this settings is unavailable, i prefer Chrome with DW disabled.

Leave a Reply