Fonts and Typography OpenType Features and Variable Fonts 2 — Questions and Answers
Question 1: What advantage do variable fonts offer over traditional static fonts?
- A single file replaces multiple weight and style font files, reducing HTTP requests (Correct answer)
- They render faster on all monitors
- They remove the need for CSS font declarations
- They are always free to use commercially
Correct answer: A single file replaces multiple weight and style font files, reducing HTTP requests
Variable fonts consolidate multiple weights and styles into one file, reducing the number of separate font files browsers must download and improving page performance.
Question 2: What does the OpenType 'kern' feature control?
- Adjusts spacing between specific letter pairs to improve visual balance (Correct answer)
- Converts text to kerned all-caps
- Applies horizontal scaling to letters
- Sets the minimum line height
Correct answer: Adjusts spacing between specific letter pairs to improve visual balance
The `kern` OpenType feature enables font-defined kerning pairs, automatically adjusting space between specific letter combinations (like 'AV' or 'To') for optical balance.
Question 3: What is a 'registered axis' in OpenType variable fonts?
- A standardized axis defined by the OpenType specification with a four-letter tag (Correct answer)
- An axis that requires font licensing registration
- A proprietary axis locked to one foundry
- An axis only available in desktop software
Correct answer: A standardized axis defined by the OpenType specification with a four-letter tag
Registered axes are officially standardized by the OpenType specification (wght, wdth, ital, slnt, opsz), ensuring consistent behavior across applications that support variable fonts.
Question 4: What does the OpenType 'tnum' feature do?
- Makes numbers tabular (fixed-width) for alignment in tables and columns (Correct answer)
- Converts numbers to text words
- Applies old-style numerals
- Makes numbers subscript
Correct answer: Makes numbers tabular (fixed-width) for alignment in tables and columns
The `tnum` (tabular numbers) feature makes each numeral the same width, so numbers align properly in columns and tables without misalignment.
Question 5: Which CSS property enables OpenType typographic features like ligatures and small caps?
- font-feature-settings (Correct answer)
- font-variant
- font-style
- font-variation-settings
Correct answer: font-feature-settings
`font-feature-settings` provides low-level access to OpenType features using their four-letter tags, such as `'liga' 1` for ligatures or `'smcp' 1` for small caps.
Question 6: What does the `wdth` axis control in a variable font?
- The width or condensed/expanded proportion of letterforms (Correct answer)
- The word spacing of the font
- The tracking applied globally
- The weight of the font stroke
Correct answer: The width or condensed/expanded proportion of letterforms
The `wdth` (width) axis controls how condensed or expanded the letterforms appear, with lower values producing condensed variants and higher values producing extended ones.
What advantage do variable fonts offer over traditional static fonts?