Menu icon Foundation
Open Sans font import and slow load times

The sample file loads really slow.
I have 404 error
index.html:8

file://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700

it takes really long time to load this file. 14 seconds.

Am I only the one has this problem?

I have tried to download the lastest foundation 5. but still same. tried my home, office. all slow.

I have tried to find where this code is to remove. but I can't really find.

any tips?

Fontmilestone5.1

The sample file loads really slow.
I have 404 error
index.html:8

file://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700

it takes really long time to load this file. 14 seconds.

Am I only the one has this problem?

I have tried to download the lastest foundation 5. but still same. tried my home, office. all slow.

I have tried to find where this code is to remove. but I can't really find.

any tips?

Pam Bifaro almost 3 years ago

I am using Foundation 6 and the foundation.css file has this as the first line

@charset "UTF-8";

should I replace that with

//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700

 

Jake Braden over 5 years ago

Hello! I have been having problem as well. However i believe that i have found a solution. Open your foundation.css file in a text editor. The top line of code should be

@import url("//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700");

Copy and paste the link part of the code:

//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700

Copy and past the text on the page in to the first line of the foundation.css file.

Then, delete the
@import url("//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700");
and save your file.

The page should refresh much faster. If you have any questions, simply reply back(:

Mihai Stroe over 5 years ago

@Rafi

That's a good move, looking forward to it.

Rafi Benkual over 5 years ago

You can remove it for now. We are dumping it for the next point release. If you're interested in this kind of stuff, you can follow it here:

https://github.com/zurb/foundation/issues?milestone=4&page=1&state=open

Michel Vinke over 5 years ago

This almost made me switch to bootstrap
I downloaded foundation and got frustrated with the very slow loading index.html example page

putting :html in front seems to solve the speed problem :)

Best regards,
Michel Vinke
www.michelwebdesign.nl

Mihai Stroe over 5 years ago

@Philip

+1 that worked for me.

Philip Hadviger over 5 years ago

I've added the following line to the bottom of my _settings.scss to fix this.:

$include-open-sans: false !default;

But it would be really nice if this fix could go into the stock install.

steven warwick over 5 years ago

Seems to be the case that if you download the stock foundation 5.0.2 onto a machine without an html server, and try to use directly into a browser, the stock download pauses until a timeout - something like 15 seconds due to lack of a "file://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700" file.

this is fixed by adding html: in front of the //fonts in the .css files.

thinking that zurb might want to change the stock download to avoid this problem as newcomers will get a bad first impression.

I hope this is the correct approach to providing input here.

James Craine over 5 years ago

I wonder why Foundation included Open Sans at all. I would have expected a basic font like Helvetica Neue and to overwrite that with my own font of choice.

Plus the Open Sans font makes all small text really thin and ugly. Especially on the F5 Docs. I much preferred the Foundation 4 docs because of Helvetica.

Steve Adams over 5 years ago

You could try adding that line into _settings to see if it works.

Bjorn Blomqvist over 5 years ago

I'm confused though.. am I supposed to be editing _global? I thought those files get over-written when running a update command?

Steve Adams over 5 years ago

Look at line 24 in _global:

// Use Open Sans font
$include-open-sans: true !default;

Set that to false, and it will not include open-sans.

My guess is that on a local development config,

    @import url("//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700");

which is a protocol relative link (http: or https:) is defaulting to file: because you are not on a live server.

Hope this helps.

Bjorn Blomqvist over 5 years ago

I have the same. It's currently unusable due to how slow it loads.

It's caused by:

line 287 in /bower_components/foundation/scss/foundation/components/_global.scss

If I edit out that line it loads faster. But I have no idea what that line actually does...