Post Archive

› November 24, 2004

Chris Palmieri on Japanese typography

  • Reported by Andreas

Chris Palmieri has published two fine articles on Japanese typography over at Functioning Form. In Chris' own words [links added]:

This two-part series offers a primer on Japanese typography for Western-trained designers. In [the] first installment, I will discuss basic typeface classification and white-space characteristics, explain some of the options and limitations of web-based Japanese typography, and make a few suggestions for creating attractive, legible type. In Part 2 of this series, I will address additional type issues, including analphabetic glyphs and the role of English in Japanese design.

Certainly worth your time.

A small note: as I expect the accompanying comparison chart to be illegible for those without Japanese fonts installed on their system, I took a screenshot of the top chart (Japanese WinXP SP2, FireFox 1.0, ClearType on, 96 DPI). Note that only the x-large fonts are antialiased—other sizes aren't... And yep, these two (four?) fonts are basically your only choice when it comes to rendering Japanese text on the web (under Windows, that is).

Update: FF1.0 renders the chart's "normal" line all in MS Mincho. IE6 does the opposite. The 10px and 11px lines are also partially rendered incorrect. Anybody an idea?

Comments

1. November 24, 2004 11:04 AM

Quote this comment

Philippe Posted…

Funny, FF1.0 Mac OS X renders the 'normal' line as Gothic (using Osaka , although my prefs are set to use Hiragino). Kind of weird.

BTW, is that the best rendering for Japanese text you get on *fox ? It is quite poor. Maybe using the Japanese name of the fonts would yield better results ? Or get a Mac OS X powered computer..;-)

2. November 24, 2004 11:33 AM

Quote this comment

Andreas Posted…

Yep. This is the best rendering you can get (has nothing to do with Firefox or IE - all programs render small/normal size MS Gothic and MS Mincho aliased).

As far as I know, there are two non-standard alternatives (which I use): Arial Unicode MS as a replacement of MS Gothic (sans-serif) and Bitstream Cyberbit instead of MS Mincho (serif). It's a bad idea to refer to them in stylesheets, though. The user might not have them installed (Arial Unicode MS comes with MS Office and Bitstream Cyberbit can only be downloaded from forgotten ftp-folders) and, what is worse, they look terrible when anti-aliasing is turned off.

3. November 24, 2004 02:14 PM

Quote this comment

Paul D Posted…

Well, the international typography options on English Windows installations aren't that great, the partial rendering doesn't surprise me.

The very nicest web-page rendering of Japanese I've seen is on my Mandrake Linux machine. Superbly crisp anti-aliasing, though I can't remember what the Linux fonts are called.

OS X is a close second. Japanese always looked crappy in Windows, one of the reasons I switched (I'm learning Japanese).

4. November 24, 2004 11:12 PM

Quote this comment

Philippe Posted…

The reason why the 'normal' line isn't displaying as expected is simple: there is no particular font-family associated with it, hence the browser will use whatever the default setting are.

I also ran a test locally, and using the Japanese name of the fonts for Windows looks better to me (tested with VPC, localized Japanese Win2K pro and IE 6)

5. November 25, 2004 07:18 AM

Quote this comment

Andreas Posted…

Thanks Philippe. Odd problem... I thought the ASCII names were sufficient, but apparently, that's not the case.

6. December 3, 2004 05:03 PM

Quote this comment

nate koechley Posted…

Wow, thanks for pointing me to this series, great stuff. I'm working on a multi-country CSS font system right now, so trying to learn as much as I can.