Anatomy of Type
The height of lowercase letters like “x.”
What is x-height?
This style of typeface has small decorative strokes at the ends of letters.
What is serif?
The vertical spacing between lines of text.
What is leading?
This CSS property is used to change the typeface of text on a webpage.
What is font-family?
You walk into a dark room with one match. Inside is a kerosene lamp, a candle, and a fireplace. What do you light first?
What is the match?
The invisible line that letters rest on.
What is the baseline?
This typeface family does not have decorative ends.
What is sans serif?
The adjustment of space between individual letters.
What is kerning?
This online resource from a popular search engine provides free fonts you can embed with CSS.
What is Google Fonts?
This “box” can travel thousands of miles but never moves an inch.
What is a mailbox?
The part of a letter that extends above the x-height.
What is the ascender line?
This typeface style imitates handwriting and often has connecting strokes.
What is script?
Adjusting spacing across an entire word or line of text.
What is tracking (letter spacing)?
The standard pixel font size for a browser.
What is 16px?
A man pushes his car to a hotel and loses his fortune. What happened?
What is he’s playing Monopoly?
The main vertical stroke of a letterform.
What is the stem?
Fonts like Cormorant or Times New Roman fall into this type classification.
What is a serif typeface?
This type of spacing is critical to prevent letters from appearing too close or too far apart.
What is kerning?
This relative CSS unit is commonly used in responsive design to ensure typography scales proportionally across devices.
What is REM?
This kind of “box” is often used by designers and developers, but you can’t keep anything inside it.
What is a text box (or input box)?
The open or closed space inside a letter such as “o” or “e.”
What is the counter?
Fonts like Arial, Roboto, or Helvetica belong to this classification.
What is sans serif?
The process of arranging text so that it aligns cleanly along the left, right, or center of a design.
What is text alignment?
Fonts should always be chosen to ensure this key web design principle, especially for visually impaired users.
What is accessibility (ADA)?
This “box” can hold every file, folder, and idea you have, but it only exists in the cloud.
What is Dropbox?