Chinese typography

Chinese typography cannot copy Latin rules, because a "character" plays a different role than a Latin "word": Han characters nearly fill a square, may break between any two of them, and punctuation has its own rules for the space it occupies.

Character frames and full width#

Han characters are drawn inside a roughly square character frame with a little space on each side. Each occupies one full-width (equal to the font size).

Punctuation is also full-width, but the ink covers only half: a full stop or comma sits in one corner and the rest is white space. So:

• several marks in a row look very loose;
• the gap between a mark and the next character looks exaggerated;
• marks at the start or end of a line leave ugly holes unless handled.

That is what palt (proportional widths) solves — the mark takes its ink width instead of a full square.

Line-start and line-end rules#

Chinese has two hard rules:

• line-start prohibition: full stops, commas, enumeration commas, closing quotes and closing brackets may not start a line;
• line-end prohibition: opening quotes and opening brackets may not end a line.

The handling is called kinsoku: either squeeze the previous character in, or push the mark to the next line.

Browsers apply basic rules by default, but mixed Chinese-Latin text, runs of punctuation and bracketed quotations are often handled poorly — the most commonly criticised part of Chinese typesetting.

Mixed Chinese and Latin#

Four things to watch when they sit side by side:

1. Spacing: a little air (about a quarter em) between Han and Latin, otherwise they collide; CSS text-autospace / text-spacing-trim aim at this, with uneven support, so in practice people add spaces or rely on layout software;
2. Baseline: the Latin midline and the Han centre are not at the same height, so baseline alignment makes Latin look low;
3. Size: many Chinese designs set the Latin slightly smaller (about 95%), because Latin's larger x-height makes it look heavier at the same size;
4. Font choice: a Chinese family for the body, a separate Latin family for the Latin, expressed through the order of font-family.

Line height and tracking#

Chinese needs more room between lines:

• Han characters fill their frames, so lines have no natural gap and tight leading smears them together;
• body line height is usually 1.6–1.8, wider than the 1.4–1.7 typical for Latin;
• tracking is normally 0 — Han characters are equal width, and extra tracking destroys the block texture; it belongs to headlines and posters.

Regional forms#

The same code point can have different standard drawings in Simplified Chinese, Traditional Chinese and Japanese. Classic examples:

• the top of 骨 points left in Chinese fonts, right in Japanese ones;
• the number of inner strokes in 直 and 值;
• the first stroke of 门.

locl switches these per language. So:

• a Japanese font on a Chinese page looking "off" is not a broken font — it follows Japanese standards;
• on a multilingual site, the lang attribute affects glyph choice (see GSUB / GPOS).

Switch the direction: in vertical writing punctuation rotates and brackets flip, and whether that works depends on the font having vert.

Vertical writing#

Vertical setting uses vert / vrt2 to rotate or replace glyphs (brackets, dashes, ellipses) and places text top-to-bottom, right-to-left.

In CSS that is writing-mode: vertical-rl. Note that the font must support vertical forms, or brackets point the wrong way.

Observing it here#

• Specimens exist in Chinese and Latin versions, so weight and style differences are visible side by side;
• when coverage renders with a real font, Chinese blocks show that font's actual glyphs;
• the type preview accepts Chinese text, so you can try line height and tracking — but kinsoku and mixed-script spacing are the browser's business, not something this site controls.

Further reading#

• W3C: Chinese Layout Requirements
• CSS Text: text-autospace, text-spacing-trim
• This site: GSUB / GPOS, Line height (leading)