The art of typography

The Art of Typography

Typography is the art and design of arranging written letters, numbers, and symbols to display a message. It’s the first message your customers see when they visit your website and it’s the first impression they get of your brand. In other words, it’s pretty important.

A Brief History of Web Fonts

At the dawn of the internet, fonts were controlled by the settings of each web browser. By the mid 1990s, Netscape introduced the ability to control the font display of websites. In the mid 2000s, web fonts were still very limited, leaving designers embedding photos of text to set websites apart from one another. As you can imagine, there were a few problems with this strategy.

In 2008, Cufón fonts arrived. Cufón replaced fonts with Javascript and vector graphics, allowing the rendering of just about any font into a website. While it was a big step forward, it came with significant drawbacks. If Javascript was turned off, fonts simply failed to render and not all fonts were licensed for use across the web. For these reasons, Cufón fonts were discontinued by early 2017.

Cufón fonts in use on a website in 2011
Cufón fonts in use on a website in 2011

Google Fonts launched in 2010 with a collection of 14 open source fonts to expand the use of typefaces across websites in a faster and more convenient way. Fast forward to today, Google Fonts contains more than 1,400 font families and is viewed more than 15 billion times a day. Read about Google’s font collection here.

Typography Categories

There are three typeface categories used on websites: heading, body, and accent fonts. Heading fonts are classified by size with H1 being the largest and H6 the smallest. To draw attention, heading, or display fonts, should be bolder and larger than the body font. Font styles can vary between typography categories, however, it’s best to stick with three or fewer font faces to keep continuity.

The body font should be a medium weight, serif or sans-serif font, making it easier to read. That’s why it’s best to avoid using script or intricate font faces in the body.

Finally, accent fonts are used sparingly throughout the site. They’re best used as your company’s catchphrase or slogan, or for an idea you’re drawing attention to.

An example of heading, body, and accent fonts.
An example of heading, body, and accent fonts.

A Few of Our Favorite Fonts

It’s a good idea to keep your website updated with trending fonts and color styles to create interest and maintain credibility.

Open Sans

Created: 2011 | Style: Sans-Serif

Open Sans is an open source font commissioned by Google and designed by Steve Matteson. As of this writing, the Mythic Limited website uses Open Sans throughout the body of the site. We like Open Sans for its clean, open structure, and popularity.


Created: 1988 | Style: Sans-Serif

Avenir was designed by Adrian Frutiger for the foundry Linotype. Avenir is used by a number of high profile companies including Apple, Disney, Bloomberg, Toyota, Land Rover, and CBS.


Created: 2010 | Style: Sans-Serif

Raleway was originally designed by Matt McInerney for the foundry The League of Moveable Type in a single thin weight. In 2012 and 2013 it was expanded to include a total of six weights. Check out the “w” in Raleway.

Dancing Script

Created: 2011 | Style: Script

Dancing Script is a casual script created in 2011 by Pablo Impallari. It draws on inspiration from popular typefaces from the 1950’s for its fun, informal look.

Libre Caslon

Created: 2018 | Style: Serif

Libre Caslon is a revival serif font created in 2018 by Pablo Impallari. It traces its origins to the works of William Caslon and William Caslon II from the 18th century. Later, in the 1950’s, advertising firms used hand stenciled lettering based on William Caslon’s work. This font is inspired by these works and has been refined for the web and expanded to 103 language sets.

Leave a Comment