Please explain external CSS

OurJud · 02-13-2013, 12:22 AM

As I've said in another post recently, I'm using a tumblr theme that employs a font that I particularly like. From what I can gather, the font is 'Open Sans', Sans-Serif, but it seems that in order for the tumblr theme to display this font, it has to use the following external CSS: http://fonts.googleapis.com/css?fami...n+Sans:400,700

I have no problem with this, except that it makes my pages behave sluggishly while it grabs the info form the external CSS.

If I remove the code for this external CSS, the font defaults to something similar, but smaller and not as clear.

Why is this external CSS needed, and is there anything I can do in order to use this font without it?

The test forum where I'm using it is here: http://freepichost.tumblr.com/ (SFW)

Thanks in advance.

SB65 · 02-13-2013, 08:44 AM

It won't so much be the link to the css file that causes the delay, so much as retrieving the font files (linked in the css file) from the Google API and displaying them.

This approach (@font-face) allows you to display non-standard fonts on your page, even if the user does not have the font installed on their machine, by downloading the font as part of the page. This does obviously take longer than using a 'standard' font such as Arial which will be locally installed on the machine.

So that's why there's a delay. However, I'd say it's a pretty small one - barely noticeable on my broadband connection.

You're going to have to either live with the delay or change the font. The font you've chosen seems pretty close to Verdana to me, which you can use without having to call the font file.

triptoway · 02-13-2013, 09:13 AM

First u have to make the css code to related application and then u have to attached on the css code to that page where u want to show.

VIPStephan · 02-13-2013, 10:28 AM

Quote:

Originally Posted by OurJud

Why is this external CSS needed, and is there anything I can do in order to use this font without it?

It isn’t needed, you could as well download the font and host it yourself (if you can modify the theme and have access to webspace on the same domain). Fontsquirrel has a ready-made font-face kit, or – for maximum control over performance – you can convert the base TTF file into the required formats with their font converter.

SB65 · 02-13-2013, 11:22 AM

Quote:

Originally Posted by VIPStephan

...you could as well download the font and host it yourself ....

I've always assumed that you can't do that on Tumblr?

OurJud · 02-13-2013, 02:17 PM

Quote:

Originally Posted by SB65

I've always assumed that you can't do that on Tumblr?

No, you can't. Tumblr is nothing more than a free blogging platform.

Thanks to all who replied.

SB65, I think I'll probably switch to Verdana, because while the delay is nominal - as you say - it does niggle me. The only thing with standard fonts is finding a nice size. With standard fonts I personally find 11px too small and 12px too big. This @Font was the first I've come across that offered something in between.

Having said that, it's all guess work I suppose, as it all depends on everyone's monitor and res settings what size they display at.

Thanks again.