Google Blogoscoped

Forum

Fonts.googleapis.com...  (View post)

Philipp Lenssen [PersonRank 10]

Wednesday, May 19, 2010
14 years ago26,418 views

Adam writes "Google getting into the Web Fonts game?" and continues:

"As I watched the hostnames flash by as the page loaded, pulling in resources from numerous sources, my eyes stuck on one in particular: fonts.googleapis.com. So, I pulled up the source of the page and right there, on line 3, was a link element pulling in CSS from fonts.googleapis.com! The request is for a font called ‘Droid Sans’ in regular and bold."
http://www.storm-consultancy.com/blog/design/newsworthy-bits/google-getting-into-the-web-fonts-game/

Dominik [PersonRank 1]

14 years ago #

Smashingmagazine.com is using it, too. :-)

TOMHTML [PersonRank 10]

14 years ago #

I'm wondering if there is any partnership between Google and SmashingMag' or they use an unknown API...

WebSonic.nl [PersonRank 10]

14 years ago #

http://code.google.com/webfonts

TOMHTML [PersonRank 10]

14 years ago #

God damned it! Is that new, WebSonic??

WebSonic.nl [PersonRank 10]

14 years ago #

That's new, also introduced at Google I/O. Works very simple and could be a nice alternative for sifr and cufon.

Above 6 comments were made in the forum before this was blogged,

Niraj Sanghvi [PersonRank 10]

14 years ago #

One the one hand, it's nice to use it the way they prescribed because, as you mentioned, you may have a chance that the font is cached already. But if you store the font on your own server, wouldn't the load time be faster? And even if not, you wouldn't have to worry about Google's server being down (if your font is down, your site probably is too), and wouldn't repeat visitors likely have the font cached after their first visit?

Just curious on which is the better option, though the answer may simply be that it depends on the site.

Roger Browne [PersonRank 10]

14 years ago #

[put at-character here]Niraj:

The usual way to specify fonts in HTML is to include a "fallback font" such as "serif" that's built-in to the browser. That way, the page can still be rendered if Google's font server is down.

The advantage of using Google's font server arises if lots of websites use it. Then, it's likely that the fonts will already be in the user's browser cache before they visit your site.

Ahmed Hindawi [PersonRank 0]

14 years ago #

One of the benefits for Google for hosting the font files is collecting usage information. Every time someone visits a web site that links to the Google font servers, Google would know and add the information to the vast collection of data they have about online users and web sites.

Ionut Alex. Chitu [PersonRank 10]

14 years ago #

[put at-character here]Ahmed:

Google already has Analytics, AdSense, YouTube. I'm sure that wasn't the motivation for launching this project.

Philipp Lenssen [PersonRank 10]

14 years ago #

> The usual way to specify fonts in HTML is to include
> a "fallback font" such as "serif" that's built-in to the
> browser. That way, the page can still be rendered
> if Google's font server is down.

What happens during load time though, i.e. before the browser notices the connection to Google's font server timed out*? Google's technical considerations page mentions that during loading of the font, there will be a blank space where the text would appear in some browsers.

*A time out either because Google is down, or because it's blocked in a country – for instance, I always have loads of loading problems accessing sites using Twitter widgets from China.

Niraj Sanghvi [PersonRank 10]

14 years ago #

From what I've seen/read, Firefox (and I think IE) will actually show the fallback font until the font loads. Which leads to an annoying phenomenon that's been dubbed "FOUT" – Flash Of Unstyled Text. Safari appears to leave a blank space until it is able to load the text, so you don't get the strange jump effect between fonts.

Roger Browne [PersonRank 10]

14 years ago #

I prefer the flash of unstyled text. If the font server is slow, I can still read the headline in unstyled text.

But Google's font server is fast enough that I have rarely seen the flash. I can force it (by doing shift-reload) but the font server is so quick today that I don't see the flash unless I'm staring at the specific part of the page as it loads.

Assuming you have a recent browser, go to this Google page and see if you get a flash of unstyled text before the "Making the Web Beautiful" headline turns into shadowed script:

http://code.google.com/apis/webfonts/

scrim [PersonRank 0]

14 years ago #

What's in it for Google?
Seems obvious to me. I can't believe no one has commented on the bigger picture:

fonts.googleapis.com
google Gears
embedded YouTube video elements
googlecode -hosted javascript libraries
Google-hosted logo embedded into Google custom search (site search) snippet
embedded adsense scripts

By coercing content creators to utilize any of the freebies, Google's eye-in-the-cloud gains a click by click ringside seat to monitor Joe Public's clickstream.

I've blocked the fonts.googleapis.com domain as well as many other frivolous onlookers (e.g. addthis.com) via a proxy blocklist. Yep, doing so "breaks" some pages (css and/or scripts hosted on the blocked domains cannot load)... which, is actually a good thing IMO. It's helps me to steer clear of the mashup, regurgitated content sites.

Tadeusz Szewczyk [PersonRank 10]

14 years ago #

I've tested several of the fonts and none of them is usable. They look bad. Some are barely readable and one doesn't even have an "&".

I tested them for h1, h2 headlines. Thus I still pefer Cufón, Typeface etc.

Just another low level Google project soon to be abandoned IMHO.

Hannes [PersonRank 1]

14 years ago #

Look pretty nice in all browser except IE6. It's not so smooth there.

But how the hell do they do it? I mean, @font-face support came with firefox 3.5? I don't see any js action.

Roger Browne [PersonRank 10]

14 years ago #

[put at-character here]Hannes: Google sniffs the browser type, and delivers a customized stylesheet that correctly references the font. No JavaScript is required (unless you want to use Google's font loader API).

[put at-character here]Tadeusz: Well spotted that "Nobile" is missing the ampersand. This is surely an oversight and will be corrected – if not by Google, then by someone else (because all of these fonts are open source).

Forum home

Advertisement

 
Blog  |  Forum     more >> Archive | Feed | Google's blogs | About
Advertisement

 

This site unofficially covers Google™ and more with some rights reserved. Join our forum!