Differences

This shows you the differences between two versions of the page.

--- ideas:bad-font-metrics [2018/01/12 10:38] – created fantasai
+++ ideas:bad-font-metrics [2018/01/12 10:49] – [List of Font Metrics Used by CSS] fantasai
@@ Line 1: / Line 1: @@
-====== Bad Font Metrics Are Bad ======
+====== Bad Font Metrics Are Bad: Why Good Font Metrics Matter ======
 CSS relies on accurate font metrics to generate correct layouts. Unfortunately, most fonts provide inaccurate font metrics. This page is a collection of where CSS uses, or would like to use, font metrics and why it sucks to have bad font metrics in your font.
+=== List of Font Metrics Used by CSS ===
+  * alphabetic baseline
+  * ascent (''insert OpenType label here'')
+  * descent (''insert OpenType label here'')
+  * ex height (''insert OpenType label here'')
+  * cap height (''insert OpenType label here'')
+  * ...
+===== Font-relative Units =====
+CSS has a variety of [[https://www.w3.org/TR/css-values/#font-relative-lengths|font-relative length units]], which authors use to lay out content on their pages. Inaccurate font metrics mean layouts using these length units don't visually line up with the shapes of the letters they're meant to reference.
+XXX Draw some examples of cap height and ex height stripes and things.
+XXX Gaiji example using ic unit to maintain sizing relative to surrounding text.
 ===== Superscripts and Subscripts =====