Google Font API: Making the web more beautiful!
Google recently announced a collection of high quality open source web fonts known as the Google Font API and is available to everybody. These means Google will be hosting the fonts on their servers (saving bandwidth and caching) and we can integrate these fonts on any web project you have.
Good news is that these custom fonts can even be recognized by Internet Explorer 6 and any modern browser. They also work around CSS3 and HTML5 styling, including drop shadows, rotation, etc. With these, designers and developers can use any font for their designs and web applications. Making it a rich visual experience for the users.
You can check the fonts available on the Google Font Directory, right now there are only a few available fonts but Google will be supporting more fonts on the future.
To take advantage of the Google Fonts API, you only need to link to your desired font, and reference it within font-family.
Quick Implementation
For example:
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Tangerine">
<style>
body {
font-family: 'Tangerine', serif;
font-size: 48px;
}
</style>
</head>
<body>
<h1>Let's make the Web Beautiful!</h1>
</body>
</html>
The Result:
You should see a page displaying the following, in the font called Tangerine:
Try it out yourself! It’s easy!
Have fun and try the Google Font Api. Learn more about Google font here. Enjoy!
Great blog design and write up. I put together a package with all of these Google fonts to download and use in Photoshop: http://www.vincentdepalma.com/embed-fonts-on-the-web/
Thanks Vincent! The package you made would be a great help.