共通設計理論教材 / Class LLL

字形結構與中西文差異

同一字級，不是同一塊黑面

區分字級設定、字形輪廓、基線與本次字形外框。用x、H、g及國、永、口比較同字級的形狀與留白，知道拉丁x-height不能代替中文字面的描述。

撰寫與維護：Class LLL · Lab Light Label｜預估閱讀 8 分鐘

開啟互動教材查看參考來源

閱讀目標

用可指出的結構描述字形而非只說大或小
區分拉丁文大小寫與上伸下伸、繁中字面與外框
換字形與尺度後重查字級和可見輪廓

適用條件與學習範圍

都是64px，為什麼x、H、g和國的可見大小不同？量到字框，就能說哪個更容易閱讀嗎？

能辨認一個字符與它周圍的空間；不需先會軟體或字型設計。

能在樣本上指出基線、筆畫與字內空間，分清設定字級與本次字形外框，並以換字形或語言的例子限制原結論。

不把單字形外框當整套字體的最大高度、OS/2 x-height、中文字面標準或可讀性分數。字型選擇、混排、標點禁則與長文行距另行討論。

原理與判斷

字級是一個排樣設定，字形是具體字符的輪廓；同一個設定不要求每個字符把同一範圍塗滿。看x、H和g，先找共同的基線，再看哪一部分在上、哪一部分伸到下方。不要把「64px」直接讀成這個字的黑色形狀必定高64個螢幕像素。描述字形也要說語言與樣本。拉丁x-height用來談不含上伸／下伸部的小寫高度，cap height談大寫，不能把這兩個名詞直接套成中文字面的普遍比例。clreq草案區分漢字的文字外框與較小字面，提供的是中文排版描述；不代表每個字的筆畫外框都相同，也不是所有軟體已完整實作的承諾。

從筆畫與空間開始，不先替字體打分

筆畫形成輪廓，也留下內部或周圍的空間。觀察H的直筆和橫筆、g的內部空間，再看國、永、口的構成；指出哪個位置改變，會比只說字體有質感更可討論。這些是本次樣本的描述，不是把中文字分類成拉丁字母部件。 Ilene Strizver的署名文章提供拉丁字形術語；本頁只借用基線、筆畫、內部空間和大小寫觀察，不搬用她的字型圖版或把拉丁名稱升格成所有文字的結構模型。

字級、前進寬與外框分開讀

教具旁的短尺只代表設定字級；細線標示alphabetic基線，虛框跟隨這一次字形的Canvas外框。前進寬是排到下一個字符所用的距離，並不等於可見輪廓寬；單字形外框也不等於行盒、行距或字型的設計em邊界。表格在字型載入後讀取measureText的width、actualBoundingBoxAscent和actualBoundingBoxDescent，並列出上下界之和。本頁沒有解析字型檔OS/2的sxHeight或sCapHeight；不要把測量x得到的值冒稱那個欄位。投影使紙樣傾斜縮放，所以數字不是截圖上直接量出的像素。

中西文差異要靠具體字形重查

先比較x、H、g，觀察同一字級下的上界與下界，再改國或口。這是換樣本的反例：先前用x描述的高度不能代表H或國；某一個字的框較高，也不能推出整套字體看起來總是更大。 B選Manrope時，拉丁樣本使用Manrope；本地Manrope沒有本例繁中字集，繁中會明示回退Noto。兩版繁中字形可能相同，那不是測量壞掉，也不能拿來宣稱兩套字體有相同中文設計。字體名稱與實際出字來源要分開。

把結論帶回排樣，保留停止邊界

可以寫「這個字形在此字級、字重和瀏覽器中的外框比較高」，不要寫「這套字體一定更易讀」。下一步換成真正要排的詞句、標點與輸出尺度，檢查需要辨認的內容。單字形只是練習描述的起點，不能替代完整長文、真機或讀者測試。

步驟與觀察

固定字級與字重，只比較字體
重設此頁，確認A/B都400、64px，選x。A固定Noto，B用Manrope；先讀外框和前進寬，再指出自己看見的輪廓與留白差異。這一輪只替換B字體。
換H和g，檢查先前描述
保持同條件，把字形依次換H、g。比較基線上下界，指出哪一個樣本使原本「這個字多高」的說法失效；不是要求猜中哪個字較好看。
換成繁中，確認實際來源
選國、永或口，讀B的回退說明。可把B切回Noto建立相同來源基準；不要把Manrope選單名當成它含有中文字形的證據。
換尺度並寫下一步
把兩版字級一起改到32或96，描述設定值與外框如何改變；不是閱讀速度測驗。再沿字重／字寬頁，分開觀察原生字重與變形反例，返回保留此頁條件。

常見問題

字級相同，就認為黑面必定同高

分開列設定字級、本次字形外框及觀看尺度；換x、H、g或國，檢查同字級仍有不同輪廓的例子。

把拉丁文 x-height當作中文字面高度

x-height有拉丁小寫語境；中文先用文字外框、字面與具體筆畫描述，別硬套同一比例。

選了Manrope，就說所有字都由它出字

讀字集與回退提示。本例繁中實際用Noto，不能假冒Manrope中文版，也不能由選單名推論字形來源。

適用範圍與證據

原教材查核日期：2026-10-23 適用範圍：跨工具字形觀察；以本地Noto Sans TC與Manrope做單字形瀏覽器比較。不是Photoshop、Illustrator或Figma操作步驟。來源狀態：已實讀Ilene Strizver署名Anatomy原文、OpenType1.9.1 OS/2之usWeightClass/usWidthClass/sxHeight/sCapHeight、wght/wdth軸、head.unitsPerEm、WHATWG Canvas TextMetrics及clreq2026-10-07 群組 Note Draft§6.4。CSS Fonts4引用2026-10-22 Working Draft的font-synthesis-weight段，未稱正式Recommendation或全瀏覽器等效。示意限制：原創雙座量測儀與字型校樣，現有OFL-1.1字體套件。先確認需要的字型face載入，再列Canvas單字形前進寬及actualBoundingBox上下界；圖只作投影。原生wght與外描邊／水平壓縮明確分開，後兩者不是原生字重／wdth或瀏覽器假粗體重建。原生軟體實測：僅網站瀏覽器的字型載入與Canvas比較；不是字型檔OS/2欄位讀取、原生設計軟體實測、印刷打樣或各瀏覽器一致性結論。學習成效驗證：沒有真人閱讀、眼動、可讀性、美感或學習成效實驗；較粗、較寬或讀數較大不等於更好。

參考來源

來源依原教材逐頁維護；本次建立閱讀網址不代表重新完成原生軟體或真人學習測試。如遇版本差異或內容錯誤，歡迎來信提出具體段落與版本。