User targeted design and development from mobile to desktop

You want fonts? Google got fonts.

Google is everywhere…it’s true, they have a hungry tentacle in so many cookie jars it is hard to keep track of. One of the more recent and I say exciting evolutions in web design and development has been easier embedding of fonts! Yay! No more just relying on the 18 or so¬†web safe fonts available (let’s face it 6 or so that get used) to all viewers across platforms. Of course you always want to be careful and make sure your cool new embedded fonts will degrade gracefully, just to be sure you have all your bases covered. This of course has opened a new can of worms, and opportunity for font makers…it is of course not legal to just use any font you have on your website.

There are TONS of free fonts out there and I’d say (being generous) about 5-10% of them are attractive and usable…it’s like web design in general these days, almost anyone can design and build a font thanks to computers, but you know there are reasons you hire a professional! We’ll save that for another post. So, moving foreward, once you have found a free font that works for you, all you need to do is head over to the Font Squirrel @fontface Generator and upload your font: convert it, download it, and add it to your CSS! Excellent. Google has made it even easier, they have 182 fonts (as of this post) for you to choose from, and they are all converted and ready to go. they even serve them up for you, all you need to do is add a simple link to your code.

Take this final piece of advice to heart. Keep it simple…don’t use embedded fonts for your content, use them for headers or emphasis, as they can cause some page load issues if you load too many styles or use them for large areas of content.

Google Screencap

Check out the open source Google Web Fonts

If you need to grab them all for the purpose of design mockups, Google has made it kind of difficult. A kind fellow named Joe Maller has zipped them all up for you and posted them here.