Jon Tan / silo / typography / @font-face test with Fontin Regular by Jos Buivenga

A companion test suite for the article, @font-face in IE: Making Web Fonts Work.

IE 4+, Safari 3, and Firefox 3.1 beta users should see Fontin except in the contexutal links and footer. See a Safari 3 screenshot, and IE7 screenshot with ClearType and IE6 without ClearType (with Standard rendering).

Paragraphs to a Traditonal Scale up to 24px with a line height of 1.5em

0.75em / 12px

As exprienced readers read, their eyes spring jerkily along the lines. These brief moments are known as saccades, and they alternate with fixed periods lasting 0.2–0.4 seconds. A line is perceived in a series of saccades, followed by a large saccade as the eye jumps back to the left to start a the next line. Information is only absorbed during the fixed period. With average type size, as used for books, a saccade represents 5–10 letters, or about 1–2 words in English. A saccade may begin or end with a word.

0.875em / 14px

As exprienced readers read, their eyes spring jerkily along the lines. These brief moments are known as saccades, and they alternate with fixed periods lasting 0.2–0.4 seconds. A line is perceived in a series of saccades, followed by a large saccade as the eye jumps back to the left to start a the next line. Information is only absorbed during the fixed period. With average type size, as used for books, a saccade represents 5–10 letters, or about 1–2 words in English. A saccade may begin or end with a word.

1em / 16px

As exprienced readers read, their eyes spring jerkily along the lines. These brief moments are known as saccades, and they alternate with fixed periods lasting 0.2–0.4 seconds. A line is perceived in a series of saccades, followed by a large saccade as the eye jumps back to the left to start a the next line. Information is only absorbed during the fixed period. With average type size, as used for books, a saccade represents 5–10 letters, or about 1–2 words in English. A saccade may begin or end with a word.

1.25em / 18px

As exprienced readers read, their eyes spring jerkily along the lines. These brief moments are known as saccades, and they alternate with fixed periods lasting 0.2–0.4 seconds. A line is perceived in a series of saccades, followed by a large saccade as the eye jumps back to the left to start a the next line. Information is only absorbed during the fixed period. With average type size, as used for books, a saccade represents 5–10 letters, or about 1–2 words in English. A saccade may begin or end with a word.

1.313em / 21px

As exprienced readers read, their eyes spring jerkily along the lines. These brief moments are known as saccades, and they alternate with fixed periods lasting 0.2–0.4 seconds. A line is perceived in a series of saccades, followed by a large saccade as the eye jumps back to the left to start a the next line. Information is only absorbed during the fixed period. With average type size, as used for books, a saccade represents 5–10 letters, or about 1–2 words in English. A saccade may begin or end with a word.

1.5em / 24px

As exprienced readers read, their eyes spring jerkily along the lines. These brief moments are known as saccades, and they alternate with fixed periods lasting 0.2–0.4 seconds. A line is perceived in a series of saccades, followed by a large saccade as the eye jumps back to the left to start a the next line. Information is only absorbed during the fixed period. With average type size, as used for books, a saccade represents 5–10 letters, or about 1–2 words in English. A saccade may begin or end with a word.

Sample text from Detail in Typography (Hyphen Press, 2008) by Jost Hochuli.

Full Traditional Scale

PxEmSample Text
120.750Ampadoje&
140.875Ampadoje&
161Ampadoje&
181.125Ampadoje&
211.313Ampadoje&
241.5Ampadoje&
362.25Ampadoje&
483Ampadoje&
603.75Ampadoje&
724.5Ampadoje&

Footnotes

Created on Friday, 31st October, 2008. Happy Halloween! Updated screenshots 2nd November, 2008.

Sharing

  1. Tweet this or follow Jon on Twitter
  2. Del.ici.ious logoAdd to del.icio.us
  3. Digg iconPost to Digg
  4. Feed iconRSS / Atom feed (log)