Type Anatomy Crash Course Teaches You Must-Knows In Bite-Sized Tweets
The back bone’s connected to the neck bone, and the neck bone’s connected to the head bone. If only there was a song to remember typographic body parts as easily as the human anatomy.
Pablo Stanley, design lead at InVision, thankfully has the next best thing: a Twitter thread to help you conquer the basics of typography.
Each post in the eight-part tweetstorm teaches you a couple of type anatomy terms, and is paired with a short video to serve as a visual aid. Check out the full crash course below.
TYPE ANATOMY 101 THREAD! (1-8)
Let’s nerd-out with some basic type elements
BASELINE: The line where all the letters sit.
CAP HEIGHT: The distance from the baseline to the top of the capital letters.
X-HEIGHT: The height of lowercase letters excluding ascenders and descenders
STEM: Vertical, full-length stroke in upright characters.
SERIF: A stroke added at the beginning and end of main strokes.
BOWL: The closed, curved part of letters such as b, d, o, B.
DESCENDER: The part of lowercase letters, such as q and y, that extends below the baseline.
LIGATURES occur where two or more letters are joined as a single glyph. Some ligatures represent specific sounds or words such as the æ ligature and the ampersand (&) which represents the Latin letters e and t. Other ligatures are stylistic for example ﬁ, ﬀ, ﬃ, ﬆ.
TERMINAL: The end of a stroke without a serif.
EYE: The enclosed space in a lowercase “e.”
FINIAL: A curved end.
SPINE: The main curved stroke of the letter S
ASCENDER: The portion of a lowercase letter that extends above the x-height.
CROSSBAR: Horizontal stroke in letters
COUNTER: The open space in a closed area within a glyph
EAR: A stroke on the upper-right of lowercase g and some r
NECK: A stroke that connects the top and bottom of double-story g’s
LOOP: Counter below the baseline of a two-story g
TRACKING VS KERNING:
These two sometimes get confused.
Tracking adjusts the overall spacing between all the characters of a word or block of text—this affects the density.
Kerning refers to the spacing between a pair of letters to correct for visually uneven spacing.
Ok, it’s time to put into practice what we’ve just learned—can you name at least eight points from the image?
[via Pablo Stanley]