Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS - Why do Chinese websites use English font-family

I have worked on a couple of multi lingual website with both an English and Chinese version. I would always specify a Chinese CSS font-family for the Chinese version, and an English one for the English version. Makes sense right?

Example:

Chinese:

html body.chinese {
   font-family: '宋体',宋体b8b体,Microsoft YaHei, Arial, sans-serif
}

English:

html body {
   font-family: Arial,Helvetica,"Nimbus Sans L",sans-serif;
}

Then I noticed that my font didn't always display correctly in Chinese depending on the OS/browser, so I went to take a look at how some famous Chinese websites do it...

What I found out is that they don't specify Chinese font-families, but just English ones like Arial.

Take a look at baidu.com:

body {
   font: 12px arial;
}

Weibo.com:

body, button, input, select, textarea {
   font: 12px/1.125 Arial,Helvetica,sans-serif;
   _font-family: "SimSun";
}

1) Does anyone know why baidu does not specify a common Chinese font like SongTi?

2) And why does weibo to the same, but they add '_font-famly: "SimSun"' underneath their font declaration with a prepended underscore?

FYI: I used both English and Chinese computers/browsers to check and I'm located in China. It always displays like this.

like image 454
Jones03 Avatar asked May 21 '14 07:05

Jones03


People also ask

What font does China use?

Sim Sun is the number one widely used Chinese font. Its popularity is largely due to the fact that it is the default Chinese input font in Windows. Song Ti is probably the earliest Chinese font used in China, tracing back to the Song Dynasty (960-1279) when printing technology was flourishing.

Why is multiple font-family used in CSS?

The font-family property specifies the font for an element. The font-family property can hold several font names as a "fallback" system. If the browser does not support the first font, it tries the next font.

What is the difference between font-family and font style in CSS?

With a font-family you set more than one font to the selected item that could be reverted to should the 1st font fail to load, the 2nd will take it's place and so on while with the font-style you set only one font to selected item with no back up font to revert to.


1 Answers

I found a good guide about Chinese font-family definitions for CSS here: http://www.kendraschaefer.com/2012/06/chinese-standard-web-fonts-the-ultimate-guide-to-css-font-family-declarations-for-web-design-in-simplified-chinese/

Basically most websites just declare an English font and let the browser fallback to the default Chinese font for either serif (usually '宋体' aka SimSun) or sans-serif (usually SimHei).

like image 73
Jones03 Avatar answered Sep 27 '22 22:09

Jones03