Choosing and Using Webfonts on Your Website

If you know anything about typography and branding, you know that your font options to represent your organization or company are basically unlimited. What many people don’t realize is that fonts for websites require different licenses (and even different font file types) than standard desktop fonts.

Typefaces fall under intellectual property laws just like music, photography, and other forms of art. While regular desktop font licenses apply to use on a certain number of machines (for example, 1 license per computer), webfonts licenses are typically priced according to the number of pageviews your website receives per month.

Generally, font licenses break down into one of three categories: Open Source, Subscription, and Foundry Licensing. Each type can be adapted for web use, but the specific rules vary, and the license terms are dependent on how the distributors opt to make their product available to the market. Here’s a 1000-foot view of these categories, based on some font sources we prefer to use here at Keybridge:

Google Fonts (Open Source, Free Use)

The open-source font library provided by Google is our first stop when selecting typefaces for a web or branding project. All foundries represented in Google Fonts have opted to provide their fonts for commercial use, totally free of charge. Google currently has nearly 2,000 font families available to use, and their filters for narrowing down those selections are fairly intuitive for the average user.

Any typeface in Google Fonts can be downloaded with just a couple of clicks, and our favorite WordPress Theme supports the entire library with no extra steps to import them onto the site — they’re just there, automatically. Google also provides an API that can be used to display Google fonts on your website, so you can still use them natively even if you don’t have a Keybridge-designed site.

A few of our favorite fonts available from Google: Outfit, Cormorant, Josefin Slab.

Adobe Fonts (Open Source, with Subscription)

Previously known (and occasionally still referred to) as Typekit, the Adobe Fonts library is nearly as extensive as Google’s. Though some of the most popular font families overlap with Google (for example, one of the most ubiquitous open source webfonts currently in use, Open Sans), Adobe does offer some more quirky options. The caveat of using Typekit fonts is that they require an active Adobe subscription to use. On the plus side, displaying Adobe Fonts on WordPress is nearly as easy as using Google Fonts — Adobe provides a simple embed code that you can use to call your selected fonts without the need to upload and host them on your own site.

Some of our can’t-live-without fonts in Adobe: Gotham, Proxima Nova, Minion.

Licensing Fonts from Other Type Foundries

A type foundry is a studio or company that designs and/or distributes typefaces. While Google and Adobe curate font families created by various designers, most foundries will make their own fonts available to license directly from their website (including Monotype, Hoefler&Co., and TypeType, just to name a few). These same typefaces are often available through third-party font distributors as well (such as: MyFonts, Fontspring).

If your brand guidelines call for a very specific typeface, licensing the webfont version (in addition to the regular desktop font license) is a surefire way to help your website stay on-brand and compliant. If your brand font isn’t available on Adobe or Google, you’ll need to make sure you have the appropriate license to continue using it on your website. Simply uploading your desktop font files to your CMS without a dedicated webfont license could open your organization to a lawsuit.

A Word of Caution Regarding “Free” Font Sites

A quick internet search for a premium typeface will often pull a few results from some sketchy websites claiming to offer the sought font for free usage. Unfortunately, these are usually bootleg copies of a typeface which may have missing glyphs or weights, or even carry viruses. As a general rule of thumb, if a font family is not available on Google or Adobe, or not otherwise listed as Open Source by other legitimate foundries, you should avoid downloading questionable “free” versions.

Some foundries do offer their partial or full library for free commercial use (for example, ITF’s Fontshare), and still other groups curate verified, professional grade open source fonts (such as the League of Moveable Type). When it comes to “free” fonts for your website, we strongly recommend you do your research — check applicable licenses for webfont clauses, and check whether the original foundry offers the font as open source — before using them on your site or elsewhere.

In short, fonts on the web can be as simple or as complicated as you’re willing to make them.

Have font questions or just want to talk type? Reach out to our team of web experts!

[social_warfare]
Webfonts blog feat img
This post:

Choosing and Using Webfonts on Your Website

Scroll to Top