How to keep web pages flickering using the Google Webfont web API?

Question

In my web application (http://status.net/), we use the Google Webfonts API (http://code.google.com/apis/webfonts/) for our new default theme. There are very beautiful fonts in the collection, and it definitely gives a better look at our software.

However, when the page loads, we see a flicker or flash. In Webkit browsers, the area in which fonts are used is empty until the font file is downloaded. In Firefox, all this seems to be overcharging several times.

Does the Webfont API have what they need? Take care of our backup font? This is normal?

Answer 1

Evan, Olivier wrote an article testing various services for fonts . In Opera, I did not notice anything. I wonder if you are talking about FOUC (Flash of Unstyled Content). Although I do not see the import. Where did the fonts come from? CSS or JS?

Answer 2

Yes, you can using the Webfont loader . The above example is to reproduce the behavior of Firefox in all browsers, which, I think, is unsuccessful (and not what you are looking for), but you can change it, for example, hide the text before downloading the font:

.wf-loading p { visibility:hidden; } 

PS: Looking forward to a new topic for StatusNet, the current one definitely deserves some improvements in usage and design;)