Unit 1: Intro to Design
Unit 2: Figma Fundamentals
Unit 3: The Creative Process
Unit 4: Color Theory
Unit 5: Introduction to Illustrator
Unit 6: Typography
Unit 7: Layout
Unit 8: Typesetting
Unit 9: User Interface Design
Unit 10: Design Systems
1 of 2

Font Formats

There are many different font formats, but most commonly when buying a font online you will get either one or more of the following formats:

  • OTF (OpenType)
  • TTF (TrueType)
  • SVG
  • EOT (Embedded Open Type)
  • WOFF (Web Open Font Format)
  • WOFF2

So which one should you use? Let’s explain what each type of font is and what they are good for.

Before we explain all of the currently available font formats, we have to explain a format that is the precursor, which is PostScript font.

Adobe launched PostScript Type 1 in 1984. It became very popular among desktop publishers but has since been phased out.

What is a OpenType Font (.otf)

TrueType was created by Apple in the late 1980s as a competition to Adobe’s PostScript Type 1. It is available since 1991 (Apple’s Macintosh System 7). Apple licensed TrueType to Microsoft for free and it became available on Microsoft Windows 3.1 in 1992.

OpenType is a cross-platform font file format developed jointly by Adobe and Microsoft. The two main benefits of the OpenType format are its cross-platform compatibility, which can be used on both Macintosh and Windows platforms without conversion, and its ability to support widely expanded character sets and layout features, which provide richer linguistic support and advanced typographic control.

OpenType Fonts (OTF) support expanded characters which allows for alternate characters and ligatures. This additional space provides type designers with the freedom to include add-ons such as small caps.

Most OpenType fonts will include more language-specific glyphs than TrueType or PostScript Type 1 fonts. We will talk about TrueType font next. This is more likely to be a “better” font, as it supports more advanced typesetting features.

What is a TrueType Font (.ttf)

TrueType Font was a joint effort by Apple and Microsoft in the early 1980s, several years after the release of the PostScript font format. Each company has made independent extensions to TrueType, which is used in both Windows and Macintosh Operating Systems .

It has long been the most common format for fonts on Mac and Windows operating systems. Moreover, almost all major browsers have supported it. Like Type 1, the TrueType format is available for development of new fonts.

TrueType fonts contain both the screen and printer font data in a single component, making the fonts easier to install. For this reason, TrueType is a good choice for those who have limited experience working with and installing fonts. True Type Fonts (TTF) are clearly readable at any size. Because of that TTFs are good all around files for both on screen viewing and printing purposes.

What is a SVG Font (.svg)

An SVG font is a new version of the OpenType format, with SVG standing for Scalable Vector Graphics. The SVG glyph format allows the characters to be displayed in multiple colors and different transparencies, and some may even be animated. These attributes are not supported by regular OTF and TTF formats.

OpenType SVG fonts are also known as color fonts. One difference between regular fonts and SVG fonts is the file size. The SVG font files are embedded with so much information that instead of dealing with kilobytes, it’s megabytes.

SVG fonts are particularly useful when designing with brush-inspired fonts. You’ll notice watercolor effects contain semi-transparent areas. Here are a couple of examples of fonts with multiple transparent sections.

What is a Embedded Open Type Font (.eot)

Embedded OpenType (EOT) fonts are a compact form of OpenType fonts designed by Microsoft for use as embedded fonts on web pages. These files use the extension .eot. They are supported only by Microsoft Internet Explorer, as opposed to competing WOFF files, which means their usage is very limited.

What is a Web Open Font Format Font (.woff or .woff2)

Web Open Font Format (WOFF) is a file format for web fonts developed by Mozilla. A WOFF file can contain compressed TTF and OTF files as well as licensing information and other metadata.

Similar to ZIP files, WOFF files act as containers for other files, specifically TrueType Font (TTF) and OpenType Font (OTF) files. These types of files give web designers the ability to use fonts outside of the standard characters found on most computers.

WOFF has been superseded by the WOFF2 format. WOFF2 offers even better compression algorithms, which reduces the original file size by an additional 30 percent. Therefore, WOFF2 files take up less bandwidth and load even faster. WOFF files have the extension .woff, while WOFF2 files have the extension .woff2.

Scroll to Top