Google's Font API is a great new addition to the arsenal of the HTML5/CSS3 developer - however there is one drawback to adding web fonts to a page: The font download will be initiated during the page load and may take longer than the browser needs to render the page. The result is FOUT: Flash Of Unstyled Text.
I've seen heroic attempts to describe FOUT as a feature - after all the user sees the text instantly and doesn't have to wait for the fancy font to load, but, frankly, I'm not buying it. The text will first appear in one of the standard web fonts and then after a few seconds the page - not sure what the word here should be - contracts to its final form. Clearly this will be an issue, even if most developers are willing to ignore FOUT, our clients will be more than happy to discuss their reactions to such a page load behaviour.
Here are three implementation examples, the first one without any fixes for FOUT, and two different solutions for the problem that both essentially hide the text until the fonts are ready to be rendered.
Sorry, but we have to trick the spambots... How much is 2+1? *: