FUZZY
TOLERANCE

First up in this month’s make smarter comes via the Google Geo Developers Blog and links to 9 different geo related presentations from Google I/O, including porting applications from the Google Maps API v2 to v3, tips and tricks for the Google Earth API and KML, and SketchUp. Great talks from the people that wrote the software.

Next on the list is a roundup of web development screencasts and presentations by nettus+. Videos include choosing the right CSS framework and ASP.NET from scratch. While I’m on the nettuts+ band wagon, check out their great Google Charts tutorial and mobletuts+ for HTML5 Geolocation.

If you’re into Linux, the Linux Foundation Collaboration Summit has put a number of keynote videos online, ranging from a Moblin MeeGo talk to building communities.

I linked to a great TED Talk on this subject a while back, but here’s another take (via Linuxologist) – The Surprising Truth About What Motivates Us. In particular it (briefly) outlines how what motivates us leads to the success of open source software. More than anything I’m motivated to learn how to draw like that.

And finally, if you want to know if a particular browser supports a particular feature, whether HTML5 or CSS3 or the like, When can I use is a great resource. I’ll give you your first answer for free – no, Internet Explorer doesn’t support that.

Last month Google unveiled its Font API, which makes custom font usage on your web page a snap. I talked about using @font-face before, and it isn’t terribly hard to use your own fonts that way. But doing it through Google’s Font API has a number of advantages:

• Google hosts the fonts, so they’ll load faster.
• If your visitor had been to any site using the same Google font you used, it’ll be cached.
• You don’t have to give the font license the evil eye.
• You don’t have to convert your fonts to different formats for different browsers (i.e. EOT for IE is covered).
• It’s even easier than doing it by hand.

The Google font directory includes 18 fonts to start with, and for the most part they are top notch. You’ve got good fonts for body text like Droid, and number of good fonts for headers.

How easy is it? Say you want the Droid Sans font for your web page. Put this in your header:

<link  rel='stylesheet' type='text/css'
href='http://fonts.googleapis.com/css?family=Droid+Sans'>

Now style your page element with that font.

p { font-family: 'Droid Sans', arial, serif; }

And you’re done. Now let’s say you want to use Droid Sans and Cantarell. Change your Font API call to this:

<link  rel='stylesheet' type='text/css'
href='http://fonts.googleapis.com/css?family=Droid+Sans|Cantarell'>

All set.

p { font-family: 'Droid Sans', arial, serif; }
h1 { font-family: 'Cantarell', arial, serif; }

A number of the fonts have variants, like bold, italic, and bold italic. You can get those as well in the link request.

<link  rel='stylesheet' type='text/css'
href='http://fonts.googleapis.com/css?family=Cantarell:italic,bolditalic'>

You can also grab the fonts in your stylesheet rather than the document head with @import.

@import url(http://fonts.googleapis.com/css?family=Cantarell);

Super easy stuff, and it’ll make your web pages distinctive without using heavy, SEO killing images. Just don’t go nuts with custom fonts. Besides the fact you shouldn’t use more than a couple of fonts per page for typographic consistency, they aren’t free in terms of bandwidth. At the time of this posting I’m using Yanone Kaffeesatz for the header text and post titles.