MatrixAdapt | Logiciel de gestion d'Entreprise, Création et référencement des sites web

Seo Master present to you: We’re very proud to tell you that we’ve just launched a new feature for the Google font directory. The new Google font previewer lets you test drive all the fonts in the directory so you can decide which web font in the Google Font API works best for your requirements.

Now, whenever you visit the font family page of any of the fonts, you will see a link saying “Preview this font” that will load your font selection into the font previewer.

Here you can edit the text, change its size and line height, and add decorations and spacing among other things. You can even apply text shadow to your text.

The previewer will generate the corresponding code for you so all you have to do to start using the font on your own website is to copy and paste the stylesheet link and the CSS into your pages. In the example above this would be:

<link  href="http://fonts.googleapis.com/css?family=Lobster:regular"
rel="stylesheet" type="text/css" >
<style> body {   
  font-family: 'Lobster', serif; 
  font-size: 28px;
   font-weight: 400;
   text-shadow: 4px 4px 4px #bbb;
  text-decoration: underline; 
  text-transform: lowercase;   line-height: 1.42em; } 
</style>

That’s really all you need to use the Google Font API.

If you want to see the font sample without any distractions from the font previewer controls, you can do that as well simply by clicking “Toggle controls” in the upper right corner. This will show you a nice clean example of what the font would look like in your design.

We think the previewer is a great way to try out web fonts and showcase what can be done with them. We’re looking forward to hearing what you think about the new font previewer.

By Marc Tobias Kunisch, Google Font API team2013, By: Seo Master

Seo Master present to you: Two months ago we announced the WebFont Loader, a JavaScript library for improving the web font experience. Today we are pleased to announce the availability of the Ascender Module, so now you can use the WebFont Loader with Ascender’s FontsLive web font service.

The WebFont Loader was designed to make it easy to switch between different providers of web fonts, including Google, Typekit, and others. The Ascender module provides users of the FontsLive service with enhanced controls over how web fonts are handled by various browsers.

The WebFont Loader provides developers with advanced features to manage how web fonts behave, establish better consistency across all browsers and even set the fallback font size to more closely match the web font, so content doesn't reflow after loading.

Google is delighted to work with the Ascender and DevBridge teams on this new module for the WebFont Loader. We look forward to continue to advance typography on the web.

2013, By: Seo Master

Seo Master present to you: Moments ago we introduced the Google Font API and Google Font Directory. In addition to Google’s support of web fonts, we’re excited to announce a second launch: a collaboration with Typekit to open source the WebFont Loader, a JavaScript library for improving the web font experience..

Google and Typekit believe that web fonts, in conjunction with the richer text styling offered by CSS3 and HTML5, provide the visual richness and high fidelity control of print typography while remaining accessible to machines and devices.

There are still some challenges when using web fonts, and the launch of an open source WebFont Loader addresses one of these difficulties: different browsers treat the download of web fonts differently. For example, Firefox will initially render a website’s text in the site’s fallback font until the web font is downloaded, and then the text will be re-rendered and re-flowed using the downloaded web font. Chrome and Safari won’t display the text until the web font is fully downloaded, and Internet Explorer sometimes won’t render any content at all until the web font is available.

The WebFont Loader puts the developer in control of how web fonts are handled by various browsers. The API fires JavaScript events at certain points, for example when the web font completes downloading. With these events, developers can control how web fonts behave on a site so that they download consistently across all browsers. In addition, developers can set the fallback font's size to more closely match the web font, so content doesn't reflow after loading.

Furthermore, the WebFont Loader is designed to make it easy to switch between different providers of web fonts, including Google, Typekit, and others. The code is modular, and we expect to add modules for other major web font providers in coming weeks.

Google is excited to work with Typekit to further web font technology. We look forward to working with others as well to continue to advance typography on the web.

By Jeremie Lenfant-Engelmann, Google Font API team2013, By: Seo Master

Seo Master present to you: Today we are excited to announce a collection of high quality open source web fonts in the Google Font Directory, and the Google Font API to make them available to everybody on the web. For a long time, the web has lagged print and even other electronic media in typographic sophistication. To enjoy the visual richness of diverse fonts, webmasters have resorted to workarounds such as baking text into images. Thanks to browser support for web fonts, this is rapidly changing. Web fonts, enabled by the CSS3 @font-face standard, are hosted in the cloud and sent to browsers as needed.

Google has been working with a number of talented font designers to produce a varied collection of high quality open source fonts for the Google Font Directory. With the Google Font API, using these fonts on your web page is almost as easy as using the standard set of so-called “web-safe” fonts that come installed on most computers.

The Google Font API provides a simple, cross-browser method for using any font in the Google Font Directory on your web page. The fonts have all the advantages of normal text: in addition to being richer visually, text styled in web fonts is still searchable, scales crisply when zoomed, and is accessible to users using screen readers.

Getting started using the Google Font API is easy. Just add a couple lines of HTML:

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

body { font-family: 'Tangerine', serif; }

The Google Font API hides a lot of complexity behind the scenes. Google’s serving infrastructure takes care of converting the font into a format compatible with any modern browser (including Internet Explorer 6 and up), sends just the styles and weights you select, and the font files and CSS are tuned and optimized for web serving. For example, cache headers are set to maximize the likelihood that the fonts will be served from the browser’s cache with no need for a network roundtrip, even when the same font is linked from different websites.

These fonts also work well with CSS3 and HTML5 styling, including drop shadows, rotation, etc. In addition, selecting these fonts in your CSS works just the same as for locally installed fonts, facilitating clean separation of content and presentation.

The fonts in the Google Font Directory come from a diverse array of designers, including open source developers and highly regarded type designers, and also include the highly acclaimed Droid Sans and Droid Serif fonts, designed by Ascender Corporation as a custom font for Android. We invite you to browse through the directory and get to know the fonts and designers better. Since all the fonts are open source, you can use them any way you like. We also have a separate project hosted on Google Code for downloading the original font files. Since they’re open source, they can be used for just about any purpose, including for print.

We’re hoping designers will contribute many more fonts in coming months to the Google Font Directory. If you’re a designer and are interested in contributing your font, get in touch with us by completing this form.

To showcase the Google Font API, Smashing Magazine has relaunched their site using the open source Droid font hosted by Google. We’re excited about the potential for integrating the Google Font API into many types of publications and web applications. For example, the new themes for Google Spreadsheet forms are a great example of a rich visual experience using web fonts.

This is just the beginning for web fonts. Today, we’re only supporting Western European languages (Latin-1), and we expect to support a number of diverse languages shortly.

By Raph Levien & David Kuettel, Google Font API team2013, By: Seo Master