共通設計理論 教材 / Class LLL
中西混排、數字與單位
視覺間距,不等於原文多了一個空格
比較同一段混排文的英數字體、相鄰字距與量值不拆行。分清資料空格與顯示間距、中文出版慣例與SI量值寫法,避免把每個英數片段都一律加空格。
撰寫與維護:Class LLL · Lab Light Label|預估閱讀 9 分鐘
閱讀目標
- 區分資料字元與顯示字距
- 觀察英數換字體如何影響寬度與換行
- 把量值單位慣例與排樣不拆行分開
適用條件與學習範圍
中文旁的英文、檔名與25 mm,空白各自代表什麼?為了整齊插入空格,會不會改壞資料?
- 先能辨認原文與顯示樣式;可補讀字形結構與中文標點。
能固定原文做英數字體與顯示字距的單變因比較,指出檔名資料不應擅改,並說明量值單位寫法及不拆行是兩種不同責任。
以橫排、兩套已載入字體與原創資料為例。不是完整數字格式、所有單位/語系規則或自動修稿器;clreq §5.7仍TBD,不能作數字規範。
原理與判斷
同一段文字可能同時包含自然語句、產品名、檔名與量值。它們看起來都包含英數,卻有不同責任:視覺間距可以是樣式,檔名字元可能必須逐字相同,量值則需要讓數字與單位關係明確。 clreq §6.3.3討論漢字相鄰英數的間距與不需加入的標點情境,並把字距/空白與U+0020空格列為不同途徑。因此不能把「混排」簡化成每處插入一個半形空格;來源的地區、用途和文件狀態也要保留。
資料與呈現先分開
教具切0.25em時,只在直接相鄰的漢字與英數片段邊界加CSS margin,不改textContent。原始混排文仍可選取、複製;A與B字元相同,樣式不同。 這個有限樣本沒有實作所有行首行尾間距消除規則,0.25em是便於比較的上界選擇,不是最佳值。靠中文點號、開引號後或閉引號前不額外加入相鄰字距;更複雜分詞、連字與直排仍需另查。
換英數字體後,重新看實際排樣
兩版中文用Noto Sans TC,基準英數為Manrope。只把B英數切Noto,觀察字面、寬度與換行;兩套字體並不保證相同的拉丁文比例。 介面本身仍沿原品牌字體,英數切換只限教具文字。沒有用拉伸模擬另一字體,也不把相同18px當成實際黑面高度相同;需要時回字形教材辨認外框、基線與排樣空間。
數值與單位:先確認採用的規範
本例25 mm與23 °C採NIST SP811 §7.2的量值表示:數值與單位符號間留空白;平面角的度、角分、角秒符號是例外,例中的30°不插同樣空白。這是SI表達情境,不能直接推成所有中文敘事、價格、日期或品牌文案的唯一規則。 clreq這個固定版本的§5.7只有TBD,不能拿它證明完整數字格式。本文不換算單位、不偽造測量;25與23是原創排樣素材,並非實際紙張或室溫量測。
不拆行是另一層選擇;檔名是反例
「B量值單位不拆行」以nowrap包住本例25 mm及23 °C;它保留原有U+0020空格,只改是否在這個片段中斷行。空白慣例和換行綁定不是同一項規定,開啟後仍要檢查窄容器是否溢出。 換素材後看ClassLLL2026_final檔名。不要為了視覺舒服在內部插空格,或全面斷詞後誤認資料已變更。保留完整原文、提供必要捲動或另設資料呈現;換用途時,把語義與操作需求列入取捨。
步驟與觀察
固定原文與共同寬度
重設,讀原始混排文。兩版18px、240px;先只改B英數字體,再還原,描述字面與斷點而非評分。
改顯示字距,不改資料
切B混排字距0.25em,選取A與B原文,比較字元仍相同。不要因此在檔名內插入空格。
檢查量值是否跨行
換檔名與量值反例、縮到180px,切B量值單位不拆行。原有空格仍保留;檢查mm、°C與數字的關係,並注意30°採不同寫法。
沿標點返回並保留比較
補讀中文標點與禁則,返回/重載保留本頁。重設此頁再進標點頁,確認彼此方案隔離;帶回真實文件另做輸出檢查。
常見問題
每遇英文就加資料空格
先區分檔名、代碼、量值與自然語句;顯示字距可由樣式處理,不能任意改資料。
把25 mm不拆行寫成NIST要求的CSS
NIST說明量值與單位的表示空白;本站nowrap是排樣選擇,不是該文件規定的實作技術。
clreq已規定全部數字格式
本版§5.7仍TBD;具體量值另引NIST,日期、貨幣等不能沿用未核結論。
適用範圍與證據
原教材查核日期:2026-10-23 適用範圍:繁中橫排與英數混排的跨工具觀察;使用本地Noto Sans TC與Manrope,不提供工具選單。 來源狀態:實讀W3C clreq 2026-10-07 群組 Note Draft §1.2、6.1.1、6.3.2、6.3.3;§5.7仍TBD,不拿它證明數字格式。量值單位另核NIST SP811 Chapter7 §7.2及7.6;IBM 文字 Basics/縮放僅品牌排樣啟發,不作中文禁則來源。 示意限制:原創兩段混排文,重用QZ23雙座校樣架;平視可選取DOM由同一狀態驅動。範圍按實際行高歸組字元,標點span實測佔位。CSS strict/anywhere、OpenType halt比較不等於完整clreq引擎。0.25em顯示字距不插資料空格;量值不拆行是本站排樣選擇。 原生軟體實測:僅網站Chromium的原生文字排樣;未實測Photoshop、Illustrator、Figma、印刷及全部瀏覽器/字型。 學習成效驗證:無真人閱讀、眼動或學習成效研究;行數、較緊與較整齊都不是品質分數。
參考來源
- W3C clreq|2026-10-07 Group Note Draft §6.3.3;§5.7仍TBD
- NIST SP811 Chapter7|§7.2數值與單位空白;§7.6用途
- IBM Design Language|Type Basics(品牌啟發)
來源依原教材逐頁維護;本次建立閱讀網址不代表重新完成原生軟體或真人學習測試。如遇版本差異或內容錯誤,歡迎來信提出具體段落與版本。
相關知識
- 中文標點、禁則與標點擠壓 — 回到標點與斷點責任
混排字距與英數字體會影響斷點;仍須檢查行首行尾標點,而不是只增加空白。
- 字重、字寬與視覺尺寸 — 分開字體設計與外部變形
同字級換英數字體會改排樣;回看字重、字寬與視覺尺寸,避免用拉伸湊齊當成選字。