Converting CJK Fonts to WOFF is Harder Than You'd Think

tl;dr: Don't even try online converters. They'll drop the CJK characters. Just install woff-tools and/or woff2 on your own machine. Most Linux package managers will have them; on Windows, you can use the EXEs in this GitHub repo.

A few days ago, I needed to install a web font (Noto Sans JP) for Japanese text on a site I was working on. The site supports IE11, so I would at least need a WOFF file, and a WOFF2 for newer browsers.

The obvious place to look was Google Fonts. It used to provide a ZIP download of any web font in multiple formats (at least TTF, WOFF, and WOFF2). But Google Fonts seems to have removed this feature; ZIP downloads only include OTF files now. If I wanted IE11 support, I'd need to convert these to WOFF.

That should be easy, right? Googling "convert OTF to WOFF" turns up dozens of online web font converters. These usually convert just the ASCII subset of characters by default, but some of them provide custom subsetting options. Except…

Screenshot of Font Squirrel custom subsetting options, which do not contain Japanese

Yeah, Japanese is nowhere to be found. Several other complex scripts are missing too, like Chinese, Korean, and Arabic. This was true for every online converter I tried.

Luckily, some of these converters support custom Unicode ranges. According to this StackOverflow answer, the Unicode ranges for Japanese text are 3000-303f, 3040-309f, 30a0-30ff, ff00-ffef, and 4e00-9faf. So let's try those.

The first converter I tried was Transfonter. I put in the custom Unicode ranges, and it converted the files… sort of.

Screenshot of Transfonter, showing input file sizes of 4.62MB, 4.43MB, and 4.18MB, and an output file size of 39KB

See those file sizes, including the download file size on the top left? Sure, OTF→WOFF should reduce the file size, but 13MB to 39KB just seems too good to be true. I tried including a TTF file in the result, opened it in a font viewer, and, sure enough, the Japanese characters aren't there.

OK, what about Font Squirrel? It seems like the most full-featured and professional online converter. So I tried uploading the OTF file, and…

Screenshot of Font Squirrel, showing NotoSansJP-Light.otf uploaded and listed as containing 52 glyphs

52 glyphs?!

This was a theme in every converter I tried. They don't recognize that Japenese characters exist, even if subsetting is disabled. I would assume this is true for any script that isn't listed in the Unicode subsets section.

OK, let's try this a different way. What software do these online converters use to convert the files? Is there a command-line tool I can use for this?

It turns out that there are two: woff-tools for WOFF, and woff2 for WOFF2. The actual executables are called sfnt2woff and woff2_compress.

If, like me, you use Debian Linux, then this is all you need to know: both of these apps are available as APT packages.

$ apt install woff-tools woff2

If you use a different OS, things might be trickier. woff2 is easy to set up; it's just an open-source C++ project on GitHub. But woff-tools, though technically open-source, is only available on a people.mozilla.org page that requires a login and permission to access. Luckily, there's a GitHub repo with Windows binaries of both sfnt2woff and woff2_compress.

I haven't tried any of this on Mac, but it looks like both of these utilities are available on Homebrew too.

Once we have the utilities, converting the OTFs to WOFFs is easy:

$ sfnt2woff NotoSansJP-Light.otf
$ woff2_compress NotoSansJP-Light.otf

Finally, working Japanese WOFF files!

WOFF2 compression actually reduces the size of these 4MB font files by half. And it's supported in all modern browsers, so there's no reason to serve the OTF files Google Fonts gives you.