A Guide to Chinese CSS Font Family Declarations(kendraschaefer.com)
kendraschaefer.com
A Guide to Chinese CSS Font Family Declarations
http://www.kendraschaefer.com/2012/06/chinese-standard-web-fonts-the-ultimate-guide-to-css-font-family-declarations-for-web-design-in-simplified-chinese/
9 comments
> 微软雅黑体：Microsoft YaHei [as of Win7]
It is wrong to attribute Microsoft YaHei to Windows 7. YaHei was actually introduced with Windows Vista.
It is wrong to attribute Microsoft YaHei to Windows 7. YaHei was actually introduced with Windows Vista.
Well, actually if you search for "免费中文字体" in baidu.com and find "下载" in the pages you've got, you'll very likely find out what you've downloaded are not font files, but some annoying and useless ads or even virus. So anyway, use Google.
There is a serious problem: Most Chinese fonts are HUGE, especially when you want to cover both Simplified and Traditional glyphs. For example, a CFF OTF Chinese font, covering all Han characters in BMP is about 34MB large, while its TTF variant is 12 MB.
And there is still no good automatic way to generate gridfits, though there is one for LGC, and Chrome is moving to Direct2D.
And there is still no good automatic way to generate gridfits, though there is one for LGC, and Chrome is moving to Direct2D.
But most pages in Chinese won't be showing all 10k+ glyphs on the same page. Small pages won't have very many characters at all, a few paragraphs would only be a few hundred different characters, so a minimal font file would be on the order of kilobytes. 3k+ characters covers 98% of the text in a common newspaper, that font file is on the order of a megabyte.
I've used FontForge to export much smaller font files containing only particular characters. But there are also ways to store char fonts in json using libs like typeface.js and cufon.
I've used FontForge to export much smaller font files containing only particular characters. But there are also ways to store char fonts in json using libs like typeface.js and cufon.
> the order of a megabyte
which is not acceptable for loading a web page.
As the owner of a chinese-language website, I've read this guide (alongside many others) several times and found it extremely useful. However, I still have issues getting the same (standard) fonts to show up in every browser. I wonder if this is an issue on my side, or due to browsers not handling Chinese fonts adequately.
This is extremely helpful for someone trying to internationalize a website or web application to Chinese. I really do hope more work in this domain comes out and I learned many interesting things from the article. Thanks for taking the time to write about your findings!
I've written an article on Chinese fonts too. But it is in Chinese: http://lepture.com/zh/2014/chinese-fonts-and-yue-css
A good example of bad Chinese font use is Facebook chat (in a desktop browser).
The font is tiny, and with traditional characters can be very difficult to read.
The font is tiny, and with traditional characters can be very difficult to read.
I didn't even know it existed different Chinese fonts. Shows how narrow-minded I am.
Try using QQ to talk to Chinese people and you'll quickly become aware. Tencent has made the "interesting" design decision to have you perceive other people's messages in the font of their choice, not your choice.
Presumably not an issue for real Chinese people, but it can give me difficulties.
Presumably not an issue for real Chinese people, but it can give me difficulties.
Sometimes I even prefer SimSun, which is a serif font, and a bitmap font not supporting sub-pixel rendering, at least it has aligned baselines.