Japanese Web Fonts Available for Use on AMP-Compliant Websites

Migu 1C font

M Plus 1p font

Google Fonts does provide Japanese fonts, most notably the Noto font family (“Noto” for “NO TOfu”). This is the go-to font family for Japanese fonts because of its universal availability. “Tips of using Noto fonts in the CSS font-family property” is a must-read for anyone who wishes to use this font family.

Google’s offerings include some usable Mincho (think serif) fonts, but not a single Gothic (think sans-serif) font looks good enough to my tastes, even when you include those available for early access (which might change over time, naturally).

If I were forced to pick one from this limited selection, then it would be M PLUS 1p. I do not like the spacing of this font — there seems to be too much space between characters, but for body text, this might do, particularly if you choose medium weight, not regular weight.

The creator provides other variants and makes them readily available as web fonts. This page (written in Japanese) gives you convenient comparisons of all the variations of the M Plus font family. My pick would be 1c and then 1p; I prefer the narrower spacing of 1c.

It turns out that there are other “free” Japanese fonts other than those that I have mentioned already. The info there seems to be a little outdated. Adobe Typekit is now part of Adobe Fonts, and I find none of their Japanese Gothic fonts appealing. You would get more choice if you subscribed to their Creative Cloud service, but I do not.

Typesquare, run by Morisawa, a famous Japanese font foundry, offers many beautiful Japanese fonts (My Chrome browser on Windows 10 somehow only shows a blank page when I access the site; I used Firefox instead to access the site). Even with a free account, they allow use of exactly one web font on exactly one domain, for up to 10,000 page views (the English page does not mention the upper limit of page views but the corresponding Japanese page does). This might be enough for a website where you do not anticipate a lot of traffic. You are supposed to use a custom-made Javascript file to load their webfont(s), but this is not one of the two acceptable methods for an AMP-compliant website. You could self-host their fonts, but you cannot do it for free.

There is a list of freely available Japanese fonts. Among them, Migu 1C is my favorite Gothic font. I would argue it is head and shoulders above the rest in that even full-width hirgana and katana letters are proportionately spaced. Unfortunately, it is not readily available as a web font, so at the very minimum, I will have to host the font file somewhere on the Web so it can be fetched by either HTTP or HTTPS.

Fonts.com offers many beautiful fonts for a price, including the famous Meiryo font from Microsoft. Its licensing fees are not instantly clear. The page on licensing of this font family mentions “Pay as you go” or “Pay once” payment models for web fonts, but when I try to purchase a font from this family as a web font, then the cart said $129.00 for 250,000 page views. I do not know if it is a one-time fee, or a monthly recurring fee.

It is important to note that some server rental services for the Japanese market include use of certain Japanese web fonts provided by Morisawa. If you need to rent a server anyway, that might be a good option. As far as I know, most of Sakura Internet’s server rental services come with such a feature with its Standard Plan (515 yen/mo) and up. They allow you to use the fonts with up to three domains and for up to a total of 75K page views a month. Note they do not include this feature in its cheapest offering, Light Plan (129 yen/mo). Similarly, all of XServer’s server rental services offer an equivalent feature, with a notable differing being the fact XServer allows use of those fonts only on just one domain and for up to 25K page views a month. Their cheapest plan is X10, which costs about 1,000 yen/mo, which varies depending on the duration of your contract with them. It comes with a free domain name registration.

Since those added features rely on Typesquare, the procedure to use the Morisawa fonts are similar, i.e., by loading a Javascript file (the procedure by Sakura Internet, and also that by XServer). This means that you cannot use the fonts on your AMP-compliant websites. Both of Sakura Internet and XServer let you use those fonts in WordPress (Sakura Internet explains how). I know WordPress sites can be made AMP-compliant, but I have no idea if your WP-powered website can be made AMP-compliant and use Morisawa fonts at the same time.

広告