Have you ever wondered why Chinese websites are not as diverse in typographical styles as in most modern English websites? Do you want to find out how to make your next Chinese web project more appealing to users? Read on…
According to a survey conducted by Smashing Magazine, a majority of websites have already adopted non-standard fonts as their primary typeface in 2013, which shows a growing variety and increasing liberty of typographic style on the web. With the advent of Google Web Fonts, Typekit and many other stable and easy to setup webfont providers, worrying about web-safe fonts has slowly faded into the back of web designers' minds. Well, in the Chinese-speaking world, web designers don’t have that luxury.
The challenges in Chinese web typography
Chinese character set is huge. A standard Chinese character set consists of about 10,000 unique characters, with only 3,000 of those characters common in daily use. Because of the huge set of characters, Chinese font sizes normally range from 5 to 10 MB per file. Due to this reason, it is not feasible to use CSS @font-face embedding unless your website’s users have ultra-high internet speed. For a long time, people resort to using only “web safe” Chinese fonts, which are:
- 宋体, Song Ti, a serif typeface used in most older websites.
- 黑体, Hei Ti, a sans-serif that resembles “Helvetica”.
- 幼圆, You Yuan, a rounded font like comic-sans, but not as notorious.
- 隶书, Li Shu, a brush script.
- 微软雅黑, Microsoft Ya Hei a sans-serif, arguably the most modern-looking Chinese web safe font available. It is available on Windows operating systems since Vista.
For Mac OSX users, there is also a good choice: Hiragino Sans GB. It is a high quality sans-serif typeface similar to Microsoft Ya Hei on Windows.
The generally preferred practice is to not specify any Chinese font styles in the body paragraph css, and specify charset=“utf-8”. Doing this allows the browsers to choose the best font available to display for optimised legibility.
However, Chinese typography does have a much wider variety in styles. Throughout the history of China, the building blocks of the Chinese written language has evolved with time. In general, the Chinese character styles can be categorized into roughly 12 different styles, ranging from ancient oracles that symbolise natural objects and animals to modern sans-serif Chinese characters. Currently, there are two different sets of Chinese characters used in different regions of the Chinese speaking world — simplified Chinese and traditional Chinese.
Designers working on Chinese web projects often wish that they could choose from a wider set of webfonts to fulfil their creative pursuits. This need creates opportunities for Chinese font providers to develop innovative technologies to solve the problem.
New technologies are making Chinese webfonts more practical
JustFont is a Typekit-esque service for Chinese fonts. It has a decent font library for traditional Chinese characters but only a limited set for simplified characters.
DYNAFont is a well known Chinese typeface making company that constantly produces high quality Chinese typefaces. All the fonts listed on the site are produced by the company. If you specifically wish to use DYNA fonts on the web, this is the place to go.
With YouZiKu you can upload your own font file and convert it into a customized webfont file with only selected character set. It also has a wide range of typefaces to choose from.
iFontCloud has a wide range of traditional Chinese characters styles. If you are designing a Chinese website targeting mainly traditional Chinese readers, iFontCloud could come in handy to make your website stand out from the crowd.
fonts.com also has a collection of Chinese webfonts. However, different from the above services, fonts.com does not have a pre-filter function to reduce the font file size, a normal font file is around 2~4MB. Therefore it is not suitable for websites that target online users with slow internet speed.
Although these technologies allows designers and web developer to choose from a much wider range of typefaces, it is still recommended to use the technique sparsely, which means that it should only be used on short copy text and not on long running body text, as long body text has a much bigger set of distinct characters. The large font file will still substantially affect page loading performance.
P.S. There is a very comprehensive article on Chinese web fonts written by Kendra Schaefer. You can read it here.
Update: Smashing Magazine also published a post on Chinese web design trends, you can check out here.
Published by: minitheory in Design & Process