2013-08-23

At AppStorm, we love fonts. In our spare time, we talk about fonts and typography with each other on Twitter and App.net. Sometimes, when we feel too geeky and really want to discuss ligatures in a meaningful way without being mocked, we jump ship and start talking about it in emails and private messaging.

The bottom line is, we’re type geeks. It’s a serious problem. I own books on it. And like many people, we also have websites to justify our inflated narcissistic sense of self-importance. We want to make sure that we use the right fonts on our websites — after all, we’re the sort of crazies who believe fonts are extensions of our own personalities. Here are some great places to start next time you’re looking for high-quality web fonts for your site.

Like the article? You should subscribe and follow us on twitter.

Typekit



Typekit, the site that started the web font revolution, is nearly ubiquitous. It’s probably the most popular paid option for adding fonts to your site, and for a very good reason: It’s a huge selection at a fair price, and it plays nicely with all sorts of other services, including Squarespace. Typekit is the service I’d be using if I needed it, and it’s one I plan on using in the future. It’s a font lover’s playground, used by millions of sites all over the world. Typekit likes to brag about being used by Twitter and The New York Times, and who can blame them? This is a company that has built its reputation on having incredible fonts with no downtime whatsoever.

The fonts come from Adobe and nearly 100 other foundries and designer, including some of which are the finest fonts in existence. Their pricing tears range from $0-$100 for most use cases, with $49.99/year getting you most of the features you need — including unlimited fonts for your sites and the option to sync fonts to your desktop for personal use. That being said, if you want to step your toes into the water, you can get access to two fonts for a website with 25,000 hits per month or less, absolutely free. Or, if you have a Creative Cloud subscription, you can use TypeKit’s $49/yr plan for free!

Price: Free; $24.99+/year

H&FJ Webfonts



H&FJ are obsessive about their webfonts. They care about the details and the little things, possibly more than any other company. Their website is a beautiful repertoire of clear expertise and obsession with details. If Apple is the king of detailed hardware design, H&FJ are blowing the competition away in this regard on their websites. Typekit is great, but H&FJ could give them a run for their money.

If you’re putting together a website and hand-coding it instead of relying on another service, like Squarespace, I’d really strongly recommend you consider their brand-new web font service. Their fonts are beautiful and well-known as some of the classiest available, and they’re designed specifically for web browsers. Unlike Typekit’s pricing model, which is a little confusing, H&FJ is meant to keep things simple. The subscription starts at $99 a year and goes up from there based on page views. It’s more expensive than Typekit, but you might get away with the argument that the slightly higher quality fonts and differentiation factor is worth it.

Price: $99+/year

Font Squirrel



Font Squirrel is like a dream come true. The site exists purely to help you find great free fonts licensed for web use or desktop use. It’s an independent site, and they’re not afraid to send you to a foundry’s site for a font, so it might take some extra clicking. And you will have to be hosting your own site on a server where you can upload font files if you want to go this route, but it’s free!

There’s enough fonts to keep you busy for a while, and you might find a few unexpected treasures there. The site even has a handy code to find out what commercial products you can legally use their fonts for, which I think is a big help. And if you’re looking for free fonts for your latest design project or a big new client and you just need some new fonts for Adobe Illustrator or even Pages, this isn’t a bad place to start. (And did I mention it’s free?)

Price: Free

Font Squirrel Font Generator

This is still technically from Font Squirrel, but the service is so cool that it definitely deserves an entirely separate mention from the rest of the site. If the fonts that are available on Font Squirrel just aren’t good enough for you, or you have some old fonts you purchased in your pre-web development days, you might have some you’re attached to or even some that aren’t available in online font kits. Maybe you’ve gone full-out geek and you’ve designed your own font because you’re the Steve Jobs of typography design. You’ll have to convert those fonts to make them suitable for the web.

This free (again, free!) service from Font Squirrel is for just that very thing. All you have to do is upload the font you’re putting on the web and go to town. It’ll convert it to a web format so you can upload it to your server and embed it in your site. This is a painless service, and one that I can’t recommend with anything less than total elation. Just remember: only use it for fonts that you’re actually licensed to use online; all fonts aren’t licensed for online use.

Price: Free

Fontspring

Would you prefer to own the fonts you use and host them directly on your site, rather than paying for a font subscription? Then Fontspring’s catalog is where you should be looking. They’ve got free fonts, sure, but Font Squirrel has those better covered. What’s most interesting, though, is its extensive catalog of fonts licensed for the web. You can purchase perpetual licenses for popular fonts like Museo Sans, Proxima Nova, and more from over 180 foundries represented by Fontspring. Then, you can upload them to your site and keep using them forever without paying a dime extra.

Price: Free; $5+ per font

Google Fonts

What are you, new here? Google Fonts have been around forever, but they’re always worth mentioning. In the rush to create a great-looking website, we often forget about some of the cool services “little” companies like Google have been providing for a while now.

Google Fonts is a collection of open-source web fonts for your web disposal. Google’s made it pretty easy to add fonts to your website, but out of all the places you could find fonts, I don’t think they have the best selection. Of course, it’s all free. It’s not free in the same sense that Font Squirrel is, though. Font Squirrel’s five finger discount is shocking. Google’s feels trivial, because these aren’t — at least, to my eyes — awe-inspiring fonts. But take a look and see what you think. There’s no accounting for personal taste.

Price: Free

Edge Web Fonts

And we’re back to Adobe again. Their free Edge Web Fonts service is pretty stupendous, and it’s filled to the brim with high-quality typefaces. Of course, that’s to be expected from Adobe. I don’t love a lot of the Adobe products, but I love their fonts. Powered by Typekit, it’s easy to see why the non-existent price point is such a big deal for these bad boys.

The fonts themselves are all lovely and easy to add to your own website — as simple as using Google Fonts, in fact. In fact, if you’re new to fonts and want a great rundown on why it’s so important you use nice ones and what fonts you should be using for your own website, Adobe’s got you covered. Their Edge Web Fonts service is in partnership with both Typekit and Google, and I think it sits in between the two of them as far as quality goes. For the price, Adobe’s reputation and knowhow are hard to beat.

Price: Free

Fonts.com

Fonts.com is basically a storefront for all sorts of typography — not just web fonts. But they do offer a subscription option exclusively for web fonts, and it’s used by a variety of clients: Nike, IBM, Sony, and other big names. Why might you want to consider fonts.com? Well, if you’re in love with Helvetica or Frutiger, this is the only place you can get big names like that.

Personally, I’m not sure it’s the plan for me. If I’m going to purchase a subscription for web fonts, I want unique fonts and not just big names. But clearly, the fonts are good enough for a lot of high-profile customers, and they might be right for you. Fonts.com offers a free subscription, but that requires a garish badge that wasn’t even made for a high-resolution 4K or Retina display, so for all practical intents, subscriptions start at $10/month and go up to $100/month.

Price: Free with badge; $10-$100/month

Fontdeck

Perhaps you want a paid option that offers plenty of high-quality typefaces, but you want to pay for exactly what you need, and nothing more. Fontdeck sounds like the service you need. It lets you try out any font you want live on your site for free, and then you can subscribe to just the fonts you want starting at $2.50/year per font. That’ll let you get up to 1 million pageviews per month, with a modest monthly fee if you need more than that.

If you’re only looking at using one or two fonts on your site, Fontdeck is a really attractive option that’s well-worth checking out.

Price: ~$7.50/font/year

Go Improve Your Site’s Typography!

That’s it for our roundup of great web font tools and services. There’s an embarrassment of riches when it comes to web fonts these days, and there’s absolutely no reason to stick with Arial and Georgia for your site’s fonts. Instead, go try out some of these services in Typecast — a simple web app that lets you see how web fonts from Typekit, Google Fonts, Fontdeck, and Fonts.com — and see what fonts you want to use on your site, then get them added to your CSS. It’ll only take a few minutes, and it’ll make your site look a ton nicer.

If you use one of these services, or another similar one, to improve the typography on your site, we’d love to hear your favorite in the comments below!

    

Show more