Web fonts save lives.

Web fonts saves lives. Alright, maybe they don’t save lives, but they’re pretty awesome and make the web look a whole lot better. As awesome as they are, there are a few things that everyone should know to get the most out of them.

1. Most fonts are licensed

Your favorite font library is full of licensed fonts that may or may not be cool to use on the internet. While it’s pretty easy to put a TTF through a font generator like Font Squirrel and spit out a ready-to-use font, it may go against the font’s license. Don’t do that. Why? When you use a web font, you’re actually exposing the source of it for everybody to see, use, and download. Because that font is licensed, that license should be respected.

If the font license doesn’t always cooperate with your needs, you can look for alternatives such as Typekit, Google Web Fonts, or Font Squirrel. But again, that should be communicated with clients or other parties early on to protect everybody involved.

2. Set font expectations for clients, designers, developers, and everybody in between

Fonts can be a real pain in the butt. Depending on the font, they can be displayed differently in Photoshop, Windows, Mac, Chrome, Internet Explorer — the list goes on. To prevent that from happening, it’s best to set that expectation up front. The reason for this is because of the rendering engine. Photoshop renders the fonts different than Webkit (a browser rendering engine), so it’s possible that they’re also displayed slightly differently everywhere that a font is used.

3. Choose your font wisely

Typography is very important and is a big part of web design. When designing or developing for the web, look for font families with lots of variety in font weights and styles. If your font only ships with one font style and weight it’s obviously not going to be very versatile. Once something becomes bold or italic, that font will look pretty nasty. The browser will do its best to render it, but design software packages like Photoshop won’t even give you the option to use a faux style.

Look for fonts that scale nicely. Do some testing before you choose that font to make sure it looks good small and big. Sometimes really effective display fonts become unreadable once they reach a certain size.

It’s important that you do your research on licensing, set proper expectations, and select a font that best serves your purposes. If you remember to do that, you’ll be well on your way to saving lives using web fonts effectively.

Posted By

Posted on

Have a project
to discuss?

Let's see if we can help.

Start a Conversation
dribbblefacebookinstagramtwittervimeoyoutube