Free

Free coded apps to suit all. No sign up, no email, usable offline, updates when I can, feedback welcome. Send feedback

Thinking

TTF, OTF and WOFF2: what's the difference?

TTF and OTF are font files for installing on a computer, while WOFF2 is a compressed format for websites. Font by Zaweba exports all three from one project.

TTF, OTF and WOFF2: what's the difference?

TTF (TrueType) and OTF (OpenType) are desktop font formats, the files you install on a computer so programs can use them. WOFF2 is a compressed format made for websites, so pages load the font quickly. Font by Zaweba exports all three from the same project, so you never have to choose just one.

Knowing which to use where saves confusion, so here's a plain explanation.

TrueType and OpenType

TrueType is the older of the two desktop formats and is supported almost everywhere. OpenType came later and builds on it. Both store the same essential things: the shapes of the letters, their spacing, kerning between pairs, and information such as the family name, designer and licence.

The main technical difference is in how the curves of the letters are described inside the file. In everyday use you're unlikely to notice. Word processors, layout programs and drawing apps all handle both, and text set in one looks the same as text set in the other.

So which should you install? Either works. If a print shop or a particular program asks for one format, give it that one. Otherwise pick one and stick with it, since installing both versions of the same font at once can confuse programs about which one to use.

WOFF2

WOFF2 stands for Web Open Font Format 2. It's a compressed wrapper for a font, designed for the web. Websites that use their own font serve a WOFF2 file, and browsers download it along with the page. The compression keeps files small, which helps pages appear quickly.

You don't install a WOFF2 on your own computer to type with. It belongs on a website, referenced from the site's CSS with an @font-face rule.

How Font by Zaweba handles them

When you export from Font by Zaweba, you can export one style or a whole four-style family (Regular, Bold, Italic and Bold Italic), and the files come out as TTF, OTF and WOFF2. Every file is checked for its tables, overlaps and contour direction, and any warnings are listed when the export finishes.

For the desktop, Install for me installs the font or family for your Windows account with no administrator prompt, and offers to replace an older version if one is already installed.

For the web, the web kit is the easiest route. It creates a folder with the WOFF2 files, a fonts.css of ready made @font-face rules and an index.html demo page, so you can copy the folder to your site and start using the font.

Which one for which job

Typing a letter, a worksheet or a report on your own computer: install the TTF or OTF.

Sending a font to someone else to use in their programs: send the TTF or OTF, along with a note of the licence you set.

Putting the font on a website: use the WOFF2 files from the web kit.

Sending a document to a printer: the font usually travels inside the PDF. Fonts made in Font by Zaweba are marked installable, so they can be embedded in PDFs and documents.

A note on names and versions

Whatever the format, the information you enter in the font settings, the family name, designer, version, copyright and licence, is written into each file. Bump the version each time you export a changed font. It helps programs and browsers tell an old copy from a new one, which avoids the frustrating moment when your changes don't seem to appear.