What is the difference between a google font and the web version of a regular font, e.g. futura web font? Love, Lady Island.
AnonymousDear Lady Island,
Other than the fact that Google fonts were developed by sexy artificial intelligences, there is no ontological difference between a Google font and a regular font you might find on your computer. Except maybe that the Google font has a bit of an inferiority complex, and is a little bit insecure when it comes to dealing with “real” fonts, you know, the kind that ship with your computer.
The difference between the fonts lies in the method of delivery, kind of like the difference between chain pizza restaurants. It’s really the same crappy pie, but you can get it from some Chinese dude wearing designer jeans, or a high school kid in a Domino’s uniform. In the end you’re still going to get a stomach ache.
When a browser looks at a web page, it finds an instruction like “Hey, render this font in ‘Arial, Helvetica, sans-serif.’” This instruction is defined in CSS. So what your browser does is look for Arial first on your computer, then if it can’t find that, it looks for Helvetica, and then finally it settles for any old sans-serif, kind of like a woman in her forties.
The age-old problem is that nobody has “Goudy Old Rocky Horror Picture Show Comic Sans” on their computer, right? So what Google has basically done is put a bunch of fonts, including “Goudy Old Rocky Horror Picture Show Comic Sans” on their incomprehensibly large array of servers, and created a way for keyboard jockeys like myself to reference this fancy font on Google. This way, when you write an instruction like “Goudy Old Rocky Horror Picture Show Comic Sans, Arial, Helvetica, sans-serif,” Google (sort of) temporarily copies the font we specify (see below) to your machine, and so the browser is able to read the font as if you had it locally.
On the keyboard jockey end of things, I add a tag that looks like this:
<link href=’http://fonts.googleapis.com/css?family=Macondo+Swash+Caps’ rel=’stylesheet’ type=’text/css’>
This is the link between Google’s server (where this fancy font is stored) and my web page. It basically “adds” the Google font to any visitor’s computer on the fly, that way instructions like “Goudy Old Rocky Horror Picture Show Comic Sans, Arial, Helvetica, sans-serif” will work, because you technically “have” Goudy Old Rocky Horror Picture Show Comic Sans on your machine.
What’s the difference between Typekit and Google Fonts then? Well, the only real difference is that Typekit costs money, and has more fonts than Google.
There are other ways to “serve” your visitors non-standard fonts like Google does. Font Squirrel, a packaging service, will “package” the font for you, and provide the proper code to use it on your site. This is essentially the same as using one of Google’s font. The difference is that A) You can package any font you want this way, and B) it takes a bit more work, because you have to add more code than Google (which as we can see above, is 1 line).
Why don’t we just always package every font and upload them? Because that would be illegal. People own fonts and things that are owned have copyrights, unlike cheating significant others who do whatever the hell they want even if it ruins your life. Google’s fonts are all free, and you’re paying to use Typekit’s fonts. Font Squirrel leaves it up to you to make sure you’re not stealing.
Other than the fact that Google fonts were developed by sexy artificial intelligences, there is no ontological difference between a Google font and a regular font you might find on your computer. Except maybe that the Google font has a bit of an inferiority complex, and is a little bit insecure when it comes to dealing with “real” fonts, you know, the kind that ship with your computer.
The difference between the fonts lies in the method of delivery, kind of like the difference between chain pizza restaurants. It’s really the same crappy pie, but you can get it from some Chinese dude wearing designer jeans, or a high school kid in a Domino’s uniform. In the end you’re still going to get a stomach ache.
When a browser looks at a web page, it finds an instruction like “Hey, render this font in ‘Arial, Helvetica, sans-serif.’” This instruction is defined in CSS. So what your browser does is look for Arial first on your computer, then if it can’t find that, it looks for Helvetica, and then finally it settles for any old sans-serif, kind of like a woman in her forties.
The age-old problem is that nobody has “Goudy Old Rocky Horror Picture Show Comic Sans” on their computer, right? So what Google has basically done is put a bunch of fonts, including “Goudy Old Rocky Horror Picture Show Comic Sans” on their incomprehensibly large array of servers, and created a way for keyboard jockeys like myself to reference this fancy font on Google. This way, when you write an instruction like “Goudy Old Rocky Horror Picture Show Comic Sans, Arial, Helvetica, sans-serif,” Google (sort of) temporarily copies the font we specify (see below) to your machine, and so the browser is able to read the font as if you had it locally.
On the keyboard jockey end of things, I add a tag that looks like this:
<link href=’http://fonts.googleapis.com/css?family=Macondo+Swash+Caps’ rel=’stylesheet’ type=’text/css’>
This is the link between Google’s server (where this fancy font is stored) and my web page. It basically “adds” the Google font to any visitor’s computer on the fly, that way instructions like “Goudy Old Rocky Horror Picture Show Comic Sans, Arial, Helvetica, sans-serif” will work, because you technically “have” Goudy Old Rocky Horror Picture Show Comic Sans on your machine.
What’s the difference between Typekit and Google Fonts then? Well, the only real difference is that Typekit costs money, and has more fonts than Google.
There are other ways to “serve” your visitors non-standard fonts like Google does. Font Squirrel, a packaging service, will “package” the font for you, and provide the proper code to use it on your site. This is essentially the same as using one of Google’s font. The difference is that A) You can package any font you want this way, and B) it takes a bit more work, because you have to add more code than Google (which as we can see above, is 1 line).
Why don’t we just always package every font and upload them? Because that would be illegal. People own fonts and things that are owned have copyrights, unlike cheating significant others who do whatever the hell they want even if it ruins your life. Google’s fonts are all free, and you’re paying to use Typekit’s fonts. Font Squirrel leaves it up to you to make sure you’re not stealing.
