FAQ: Chinese Website Fonts & Character Sets
Choose one basic Chinese font, and the Unicode UTF-8 charset
Q: What fonts and character set should I use in a Chinese language web page?
Chinese websites usually specify one very basic font in their style sheet, if any, and let site visitors' browsers decide what to display from there based on whatever fonts are installed on the visitors' systems. Size, bold and color are applied to the same font via styles as well. Any other fonts or more elaborate styling are in images, not in text.
Simplified Chinese websites usually specify the Song font in their style sheet, in Chinese: "宋体". That single font name represents a whole family or range of fonts, and no fallback font names are necessary. Usually a Windows system will use the SimSun font to display those characters. Other operating systems use their own Song fonts, and this is not a problem.
Example: font:normal 12px/180% "宋体";
Traditional Chinese websites often specify only the general Song (宋體) font family as well. But in these markets this font family is more often known as Ming (明體), and many sites specifically name a font from Microsoft, 新細明體, and/or its predecessor 細明體, often but not always using their English font names, "PMingLiU" and "MingLiU". Although PMingLiU and MingLiU are not on Macs and most other operating systems, those systems will automatically choose their own fallback so the layout is not affected. Because one of those two fonts, MingLiU, does not offer proportional Western characters, even 100% Chinese sites using MingLiU often also specify a Western font family to ensure that numbers and letters look their best, as in the third example below.
Example: font-family:"PMingLiU, MingLiU";
Example: font-family:"細明體", Arial, Helvetica, sans-serif;
It is often useful to place "Arial Unicode MS" or "Lucida Sans Unicode" at the beginning of a Western font list, as they include letters with diacritics (tone marks) and other useful characters. That way so you don't have to worry about what version of Arial or Lucida Sans visitors have.
Chinese "web fonts" are still not common, and not only because there are just a few server-side solutions like Arphic iFontCloud and Adobe TypeKit available for this language. Truly global websites must plan for a wide variation of operating systems, internet access speeds, and the occassional national firewall in Chinese language markets. Employing web fonts may seriously impact user experience for many site visitors in those markets.
Unless you're doing something truly unique and simply can't live without a particular font, I wouldn't even consider depending on webfonts (or even worse, the older idea of asking users to allow a font download). At that point it's best to use images or other multimedia. For example, zdic.net makes extensive use of GIF images. Speaking of images, JPEGs are usually smaller and faster than PNGs, yet higher quality than GIFs.
All of the above assumes that your vistors have any Chinese at all on their systems. Chinese is an option that users outside East Asia must install on Windows XP and certain smart phones (some Blackberry, all Nokia S60). You can always display Chinese on Windows 10/8, Windows 7/Vista, Ubuntu, Macintosh, iOS and almost all Android systems
In the <head> of your web pages, do not specify a Western character set, as in "charset=ISO-8859-1". You must use a character set that includes Chinese.
Many mainland China websites specify their charset as "GB2312", while some Taiwan sites specify "big5", but any Chinese language site that is outward-facing or global uses the Unicode charset "utf-8". I recommend that you use UTF-8 as well. In fact the page you're reading right now contains the following tag:
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
Chinese fonts included with Windows 10 and 8
Chinese fonts included with Windows 7 and Vista
Chinese fonts included with Windows XP
Chinese fonts included with Ubuntu Linux
Chinese support in other operating systems
Chinese encoding standards: Big 5, GB2312, and more
OK? Please feel free to contact me if you require further clarification, or if you have any comments or suggestions.
« page top
« « Back to FAQ index