As a graphic designer, I do website designs, but not the development. Someone asked me today if I know about Typekit, and I hadn't heard of it so I googled it, and it seemed pretty much like a paid for version of Google Web Fonts; which I occasionally use. I don't know the technical, developer reasons for using one or the other, but I don't want my client buying something when he could have just used something else for free, and got the same sort of results. So, my question is, is one better than the other? Or are there good and bad points to both?
Add a comment
|
4 Answers
Another option that's more flexible than either of those is using @font-face.
It's free, and you can use whatever font you want. Just have to upload the font to wherever the site's hosted and specify it in the css. Only thing is you have to convert the font format to be compatible with different browsers.
Here's an example - say you want to use the LeagueGothic font:
1) Use a font convertor to convert it to .ttf, eot, woff etc. http://www.fontsquirrel.com/fontface/generator
2) Upload all the font files to a fonts folder
3) In your CSS, include (make sure to update the path url accordingly):
@font-face {
font-family: 'LeagueGothicRegular';
src: url('../fonts/League_Gothic-webfont.eot');
src: url('../fonts/League_Gothic-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/League_Gothic-webfont.woff') format('woff'),
url('../fonts/League_Gothic-webfont.ttf') format('truetype'),
url('../fonts/League_Gothic-webfont.svg#webfontFHzvtkso') format('svg');
font-weight: normal;
font-style: normal;
}
4) And when you want to use it, just call it:
h3{
font-family: 'LeagueGothicRegular', 'Gill Sans', 'Lucida Grande', Trebuchet, sans- serif;
}
Haven't tried Typekit, but I think it essentially does the same thing - just takes out the conversion step and hosting for you, and also provides lots of fonts to choose from. @font-face is really not that much more work though, so I personally prefer it.
Check out this post for more info: http://sixrevisions.com/css/font-face-guide
-
5FYI: there are potential legal ramifications for embedding fonts in this manner, as it provides a copy of the typeface in full on the client computer. Essentially free download of unlicensed software.– horatioMar 23, 2012 at 14:18
-
1
-
it is a good method, but one must check the license if one wants to comply with it.– horatioMar 29, 2012 at 14:10
-
Unless it's a totally free font, serving a font like this needs a special "web fonts" or "server" licence that is different to the standard desk licence that would allow you to embed a font in flash or a pdf or an image file. Many of the big foundries are mistrustful of new technology like this and offer few options: for some older fonts, relying on a 3rd party hosting setup is pretty much the only legal way, unfortunately. Good news for small modern font designers though, who can nip in and make names for themselves while the established dinosaurs are still figuring out what to do... Jun 19, 2012 at 12:07
First, are you happy with the type selections and the character spacing of fonts on Google Web Fonts? I haven't used them yet, although I have seen at least one or two sites with excellent results using them. At the same time, some of the displays of their fonts show poor letterfit (mostly too much space between letters).
If you need to match to Adobe Fonts used in print, sounds like Typekit might fit the bill. They don't currently show too many Adobe fonts at their basic account level, although there's plenty of choice. The basic account is pretty inexpensive, so a client should be able to afford it. I'm using it on a blog on DrupalGardens at the moment, and enjoy being able to use Myriad Pro.
Probably comes down to choosing the fonts you want to use, seeing which site has what you want or close to it, and going with the flow. You might check out Typecast, a new website currently in private beta, where you can design in the browswer, choose webfonts from Google, Typekit, Fonts dot com, etc., create your site design with web fonts, see exactly how it will look, then order up the fonts that work for you. I've asked to join the beta, to check it out. Should certainly make the process smoother for designers.
In terms of technology they are pretty much the same.
In terms of product, they differ in that Google is focusing on open source offerings (no cost) while Typekit is focusing on commercial type licensing.
The decision as to which to use would really come down to which typeface you want to use.
Note that a lot of foundries and type distributors are now offering services like typekit, so definitely shop around a bit.
-
1It seems like typekit might have more professional options, since they are owned by adobe now (AFAIK). I wonder about uptime and server load when I think about these services. typekit and google both seem like they have resources that ensure near 100% uptime, so your fonts won't fail to load.(??)– horatioMar 22, 2012 at 17:59
-
Nothing has 100% uptime, but yea, both Adobe and Google should be up a huge majority of the time. And yes, Typekit was bought by Adobe. I'm not convinced that Typekit is a long term business model, but being a part of Adobe makes sense (at least Adobe can easily license their own font library via it).– DA01Mar 22, 2012 at 18:02
-
1So for a small business or for websites that are more of a part time job/hobby, would we say Google Web Fonts? I remember reading one comment about Typekit having its fair share of downtime, but I'm not sure how old the comment was.– WillowMar 22, 2012 at 18:09
-
1As a designer, you should be choosing typefaces based on the needs of the project which include business objectives as well as budget considerations. A hobby site likely is lacking on the budget side of things so you may very well want to lean towards Google's offerings.– DA01Mar 22, 2012 at 18:39
You should also check out webfonts.fonts.com as they have a tremendous selection of web fonts as well. They also carry many of the top branding fonts that brands use like Helvetica, Avenir, Univers, Frutiger and many more. They also carry many third party foundry fonts too. Check it out!
