Is it possible to reduce Google Web Fonts to one request if I'm using multiple fonts?

Question

I ran a speed test on my website and one of the suggestions was to reduce my external requests. I am using 3 Google Web Fonts, in effect 3 separate requests. Is it posible t

Answer 1

You can avoid the three requests by embedding the fonts in data: URIs inside the CSS - at least in IE9+ and most modern browsers.

note: they also work in IE8, but are limited to 32KB

note2: obviously, you won't get the benefits of the Google CDN, since you'll have to serve the fonts inside your CSS...

Answer 2

Aren't Fonts (like image assets, JSON objects, or videos) separate resources that need individual requests?

Answer 3

You can combine several fonts with just one call using the | character. Example:

<link href='//fonts.googleapis.com/css?family=Cantarell|Terminal+Dosis' rel='stylesheet' type='text/css'>

Answer 4

Yes you can load multiple fonts in single request like

<link rel='stylesheet' type='text/css' href='https://fonts.googleapis.com/css?family=Montserrat:400,700|Lato:300,400,700,900'>