[Update: This post was originally written in 2013 and several of the identified problems and suggested solutions are no longer applicable today].
If you’re a Windows user visiting a website with Japanese content you’ve probably noticed that kanji and kana are often rendered noticeably poorly. Here, for example, is what a portion of the Kanji Alive website looks like in FireFox using the browser’s default settings. Aside from small differences, the same would hold true for Internet Explorer and Google Chrome:
This doesn’t need to be the case. In this post, I’ll show you how to easily fix this by switching the Japanese font in your web browser from the old, bitmapped MS Gothic to the newer, anti-aliased Meiryo and turning on Windows ClearType. Once that is done, the same text should render much more clearly as seen below:
Three Easy Steps:
1) Install Meiryo font (WinXP only)
If you are running Windows XP, first download the current version of Meiryo directly from Microsoft and install it on your computer. Don’t be put off by any garbled text you might see in the Meiryo installer. Just click OK to continue. If you are running Windows Vista, Windows 7 or Windows 8 you can skip this step since you already have Meiryo on your computer.
2) Make Meiryo the default font for Japanese in your browser
Next, in Internet Explorer (v8 through 10) and FireFox, go to the browser’s font settings in Options (FireFox) or Internet Options (IE) and switch the default font for Japanese from MS Gothic to Meiryo (don’t select “Meiryo UI” if you see it, since this is not an appropriate font for extended text passages). Screenshots of the correct font settings for Internet Explorer and FireFox in Windows 7 are show below.
By default, Google Chrome does not let you specify fonts by language. However, a free Chrome extension written by Akio Kitano offers an easy workaround. It automatically substitutes Meiryo for MS Gothic. After you’ve installed the add-on, your Chrome Web Store window should indicate that the extension is active as show below:
Update (8/2013): An alternative to Kitano’s Meiryo extension is the Advanced Fonts Settings extension which allows you to specify Chrome’s font settings on a language by language basis.
3) Turn on Windows ClearType (optional)
Almost done. Now you just need to enable or adjust Windows ClearType to get the most of Meiryo, especially at larger font sizes. In truth, this step is optional, since not everyone likes the system-wide, text smoothing effect this produces. In Windows 7 and Windows 8 ClearType is turned on by default. Windows XP users should first enable ClearType. After that, use the ClearType Web tuner or downloadable PowerToy Tuner to tune your ClearType settings. In Windows 7 you can adjust its settings using the ClearType tuner.
After making these changes, log out of Windows and then login again to ensure that all your settings take effect. Now enjoy reading Japanese on the web in an attractive, award winning font!
Postscript: Once you’ve successfully set-up your computer to use Meiryo, we encourage you to also take a look at some other high-quality, Japanese fonts as possible additions or alternatives. For learning to read kanji, we particularly recommend the M+ family as well as Source Han Sans. Both are open-source and freely available.
The Kanji alive web app (http://app.kanjialive.com) uses M+ extensively because it offers an attractive design which is also easy to read. Source Han Sans is quite similar looking to M+ and has even better support for Japanese characters. This is why we decided to use Source Han Sans as the basis for our own, radicals only font. You can see Japanese Radicals in action on the 214 traditional Japanese radicals page where you’ll also find information on why we created it and where to download it for free.
Finally, with the Kanji alive web app you can easily compare our hand-drawn kanji animations with four different, commercial Morisawa typefaces especially approved by the Japanese Ministry of Culture for learning purposes: Kyokashotai (textbook), Mincho, Gothic and Maru. An animation demonstrating this is shown on the Overview page.