Any performance issues using Google Web Fonts for mobile-only website?

Question

I want to use css3 & google web fonts for the navigation (instead of graphics, for performance reasons).

Does anyone have experience with this? Are there drawbacks/limitations to using Google Web Fonts for a mobile client? Thank you.

Answer 1

What about performance? Will web fonts slow down my page?

If a page uses web fonts, then the font files have to be downloaded to the site visitor's computer before they can be displayed initially. The font files are served compressed for a faster download. After that initial download, they will be cached in the browser. As the Google Web Fonts API becomes widely used, your visitors will be likely to already have the font you're using in their browser cache when they visit your page.

In general, however, you should keep an eye on the size of the font files you are serving. Also be aware that using web fonts may result in the browser making more HTTP requests than would otherwise be necessary.

Compared to using images to display a lot of text on a page, web fonts are likely to enhance the performance (and maintainability, and accessibility) of your page. In other situations, however, they might add to the overall weight of your page.

Quoted from https://developers.google.com/webfonts/faq#Performance

Answer 2

As a personal experience, don't use web font on the main content text.

I used a web font which is very small (292 byte), and is hosted by Google CDN. The font is applied on a body level to all of the text.

When I actually uses a mobile phone to view the page, I see styled page with no text, and then have to wait for another second before the text appears. This can result in a perceived slowness.

The bottom line is: test and feel the app using a real phone. It is probably better not to apply web font to the main content.