Fonts, from a professional Graphic Designer’s perspective.


11 years ago

Early on in my graphic design career, I was designing items for the static end.  I rarely had to consider fonts.  The only thing that mattered was having the font on the computer in front of me, and my worry would stop there.  Along the way, I’ve learned there is a lot more to consider when it comes to fonts. This spans from the media the font is intended for, how widely it will be used, and for what period of time. Our focus in this article will be on fonts ideal for websites.

Different mediums to consider: (courtesy of fontsquirrel.com)

Commercial Desktop Use - Create commercial graphics and documents.

@font-face Embedding - Embed the font in your websites with CSS.

Ebooks and PDFs - Embed font in eBooks and portable documents.

Applications - Embed font in applications and software.

The font for your site is typically changed in the CSS section of the site. Depending on your platform, the CSS is accessible in a variety of ways.

Fontsquirrel offers a web font generator that allows you to convert most fonts into a web font for use online.

Consider why it’s important to know about your font:

  • How will it look on other browsers? 
  • How much will this font end up costing? Is it limited to desktop publishing, or can it be used in web publishing? Does your license restrict you from sharing your font with clients if required?
  • Reliability: An improperly created truetype font can potentially crash your computer. Using a subscription service, or purchasing from a reputable source typically shields you from the dangers of an incorrectly executed font.
  • When choosing your font, considering how the font will look on large and small screens while keeping aesthetic qualities, clarity, and loading times in mind.

FONT PROVIDERS:

Googlefonts- focuses on webfonts

Google fonts provides “hundreds of free, open-source fonts optimized for the web.” Why is this important? A low cost/ free font can save a good deal of money in the long run. Google fonts are a benefit as you can keep a clear eye on loading times, as well as cross bowser compatibility. There’s also a good deal of handy information about the current use of a particular font on a global scale

FontSquirrel.com- focuses on commercial-use fonts

Dafont.com- focus appears to be on personal use, donation base. There are a large number of commercial use fonts available. 

myfonts.com- a subscription-based service. Fonts.com Web Fonts offers a variety of plans to accommodate all budgets and all traffic levels, including a free plan.

Adobe Webfonts- (through Adobe type kit) a subscription is paid to access a number of high profile, professionally created fonts “that have been carefully developed to look great on screens and easily deployed on websites.”

With Creative Cloud updates, soon the fonts will be able to sync with Adobe products on desktop.

Edgewebfonts- the free subsidiary of Adobe Webfonts

Fontfabric

The League of Moveable Type

Veer

OTHER USEFUL TOOLS:

Typewonder.com- lets you test out web fonts on an existing published site.- Really amazing tool for test-driving fonts.      

Myfonts/WhatTheFont- Need a font identified?  This tool is great!