What's the reasoning behind .woff2 font files being fetched using a Mac User-Agent string? about google-webfonts-helper

[lboecker]

Do you mean local(...) vs. url(...)? They render differently sometimes -- no idea why. The actual font files should be the same. You can verify this yourself by changing your user agent and download the stylesheet Google provides. If the links to the fonts are the same, the files should be as well.

[zytzagoo]

Noup, I meant the UAs used to fetch the font files from google (defined here: https://github.com/majodev/google-webfonts-helper/blob/master/server/logic/conf.js)

After looking into it some more I've concluded that the end result doesn't justify the effort (end result being identical renderings as though the font files were served from Google across all the browsers/OSes).

One would have to re-implement the entire server-side logic (browser/os detection + asset serving) on their own servers. That's required in order to be able to serve each possible combination of browser/os/font-weight/subset (at least, it could be more), as that's what Google appears to be doing now. And one would have to fetch all those combinations from Google before that (using google-webfonts-helper or other means).

A lot of work for something that a lot of people probably wouldn't even notice :)

[lboecker]

So Google serves different font files for different UAs? For example, 2 different WOFF2 files?

[zytzagoo]

Yep: https://news.ycombinator.com/item?id=8802748

[majodev]

Hi,
First of all, I'm really sorry to reply THAT late. :(

It's exactly as @zytzagoo has already pointed out, so sadly there is no easy way to provide different font files for each UA.

I'll try to add the woff2 files for Windows UAs in the next version, so you can pick the other UA if you like. Hope this helps, if anyone come across a complete solution (or perhaps a JS-only-solution?), please let me/us know here.

[lboecker]

Did you ever find out what's different between to two files? In the hacker news thread somebody mentioned they just strip the hinting, which should be fine, but I'd like to know for sure nothing else is missing.

[majodev]

@superLukas I still haven't analyzed that and I've no further information regarding what is exactly different between those font files. The gif by @zytzagoo however indicates that Google does more than stripping the hinting on Windows UAs...

[zytzagoo]

It could very well be due to lack of hinting (if it's indeed stripped for non-windows UAs as the HN commenter states).

Unfortunately, I haven't had the time to test it properly.

The GIF shows the differences between a locally-hosted .woff2 Open Sans (gotten via google-webfonts-helper using a Mac UA string) and a google-hosted one (for which the browser sent a Windows UA string).

While looking at hinted and non-hinted renderings on http://en.wikipedia.org/wiki/Font_hinting (http://en.wikipedia.org/wiki/File:Font-hinting-example.png) I felt it's kind of the same thing (although much less noticeable on smaller font sizes, as is the case in the GIF).

If it's true that (only?) hinting is stripped for non-windows versions, then it could very well explain the visual differences -- the browser rendered the "mac" version on Windows (stripped of hinting info).

I haven't been able to fully confirm the stripping information, but I did find this:
https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/webfont-optimization?hl=en#reducing-font-size-with-compression

Finally, it is worth noting that some font formats contain additional metadata, such as font hinting and kerning information that may not be necessary on some platforms, which allows for further filesize optimization. Consult your font compressor for available optimization options, and if you take this route, ensure that you have the appropriate infrastructure to test and deliver these optimized fonts to each particular browser - e.g. Google Fonts maintains 30+ optimized variants for each font and automatically detects and delivers the optimal variant for each platform and browser.

(emphasis mine)

Since there are no differences between horizontal glyph positions in the GIF I guess that rules out kerning as a factor? Which leaves only hinting and/or something else that might affect antialiasing/subpixel-rendering... Maybe even my ClearType settings? (which is just a huge Platform/UA/Version detection matrix... based on the way https://github.com/bramstein/trmix works)

[lboecker]

I just found out that Font Squirrel's webfont generator has an option called "fix GASP table." I don't know what that means, but the description reads "better DirectWrite rendering," which sounds like a Windows thing and might be worth looking at. Unfortunately I don't have access to a Windows machine right now, so I can't test what it does. I just want to let you guys know that's a thing.

Cheers