Brandikaran | Type Anatomy Crash Course Teaches You Must-Knows In Bite-Sized Tweets
59092
post-template-default,single,single-post,postid-59092,single-format-standard,qode-core-1.2,ajax_fade,page_not_loaded,,brandikaran-ver-2.0, vertical_menu_with_scroll,smooth_scroll,fade_push_text_right,grid_1300,blog_installed,wpb-js-composer js-comp-ver-5.0.1,vc_responsive

Type Anatomy Crash Course Teaches You Must-Knows In Bite-Sized Tweets

-

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.

-

-
Pablo Stanley@pablostanley

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

Twitter Ads info and privacy

 

-

-
Pablo Stanley@pablostanley
Replying to @pablostanley

(2-8)
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.

Twitter Ads info and privacy

 

 

-

-
Pablo Stanley@pablostanley
Replying to @pablostanley

(3-8)
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 fi, ff, ffi, st.

Twitter Ads info and privacy

 

-

-
Pablo Stanley@pablostanley
Replying to @pablostanley

(4-8)
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.

Twitter Ads info and privacy

 

-

-
Pablo Stanley@pablostanley
Replying to @pablostanley

(5-8)
UPPERCASE: Capital letters.
SMALLS CAPS: Lowercase glyphs that resemble uppercase letters but reduced in height and weight.
LOWERCASE: Little letters! The smaller form of characters in a typeface.

Twitter Ads info and privacy

 

-

-
Pablo Stanley@pablostanley
Replying to @pablostanley

(6-8)
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

Twitter Ads info and privacy

 

-

-
Pablo Stanley@pablostanley
Replying to @pablostanley

(7-8)
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.

Twitter Ads info and privacy

 

View image on Twitter
View image on Twitter -
-
Pablo Stanley@pablostanley
Replying to @pablostanley

(8-8)
PRACTICE!!!
Ok, it’s time to put into practice what we’ve just learned—can you name at least eight points from the image? 🤔 -

If you wanna learn more I recommend
Thinking with Type: https://www.amazon.com/dp/1568989695/ 
Flawless Typography by @Typewolf: https://www.typewolf.com/checklist 

Twitter Ads info and privacy

[via Pablo Stanley]

No Comments

Leave a Comment:

%d bloggers like this: