0% found this document useful (0 votes)
146 views

Understanding Typography: Type Properties

The document discusses typography, defining typeface properties like serifs, x-height, and weight, and classifying typefaces into categories such as serif, sans serif, monospace, handwriting and display. It also covers readability aspects like letter-spacing and how tighter or looser spacing can impact readability of text at different type sizes.

Uploaded by

reni
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
146 views

Understanding Typography: Type Properties

The document discusses typography, defining typeface properties like serifs, x-height, and weight, and classifying typefaces into categories such as serif, sans serif, monospace, handwriting and display. It also covers readability aspects like letter-spacing and how tighter or looser spacing can impact readability of text at different type sizes.

Uploaded by

reni
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 8

Understanding typography

Typography expresses hierarchy and brand presence


CONTENTS

 Type properties
 Type classification
 Readability

Type properties
A typeface is a collection of letters. While each letter is unique, certain shapes are shared across
letters. A typeface represents shared patterns across a collection of letters.

Typefaces that are selected for their style, legibility, and readability are most effective when following
the fundamental principles of typographic design.

Names of letterform parts: aperture, ascender, baseline, cap height, descender, leading, letter-spacing, sans serif,
serif, stem, stroke, x-height

Baseline
The baseline is the invisible line upon which a line of text rests. In Material Design, the baseline is an
important specification in measuring the vertical distance between text and an element.

Cap height
Cap height refers to the height of a typeface’s flat capital letters (such as M or I) measured from the
baseline. Round and pointed capital letters, such as S and A, are optically adjusted by being drawn
with a slight overshoot above the cap height to achieve the effect of being the same size. Every
typeface has a unique cap height.

X-height
X-height refers to the height of the lowercase x for a typeface, and it indicates how tall or short each
glyph in a typeface will be.

Typefaces with tall x-heights have better legibility at small font sizes, as the white space within each
letter is more legible.

The height of a typeface’s lower-case x determines its x-height.

Ascenders and descenders


Ascenders are an upward vertical stroke found in certain lowercase letters that extend beyond either
the cap height or baseline.

Descenders are the downward vertical stroke in these letters. In some cases, a collision between
these strokes can occur when the line height (the vertical distance between baselines) is too tight.

Weight
Weight refers to the relative thickness of a font’s stroke. A typeface can come in many weights; and
four to six weights is a typical number available for a typeface

Common weights:

1. Light
2. Regular
3. Medium
4. Bold

Type classification
Serif
A serif is a small shape or projection that appears at the beginning or end of a stroke on a letter.
Typeface with that have serifs are called a serif typeface. Serif fonts are classified as one of the
following:

Old-Style serifs resemble writing in ink, with:

 Low contrast between thick and thin strokes


 Diagonal stress in the strokes
 Slanted serifs on lower-case ascenders

Transitional serifs have:

 High contrast between thick and thin strokes


 Medium-High x-height
 Vertical stress in the strokes
 Bracketed serifs

Didone or neoclassical serifs have:

 Very high contrast between thick and thin strokes


 Vertical stress in the strokes
 “Ball” terminal strokes.

Slab serifs have:

 Heavy serifs with imperceptible differences between the stroke weight


 Minimal or no bracketing

1. EB Garamond, old-style serif


2. Libre Baskerville, transitional serif
3. Libre Bodoni, didone / neoclassical serif
4. Bitter, slab serif

Sans Serif
A typeface without serifs is called a sans serif typeface, from the French word “sans” that means
"without." Sans serifs can be classified as one of the following:

 Grotesque: Low contrast between thick and thin strokes, vertical or no observable stress
 Humanist: Medium contrast between thick and thin strokes, slanted stress
 Geometric: Low contrast between thick and thin strokes, with vertical stress, and circular round
forms


 Work Sans, grotesque sans serif
 Alegreya Sans, humanist sans serif
 Quicksand, geometric sans serif

Monospace
Monospace typefaces display all characters with the same width.

1. Roboto Mono, monospace


2. Space Mono, monospace
3. VT323, monospace

Handwriting
Handwriting typefaces are unconventional with a natural, handwritten feel. These typically are used
as H1 - H6 in your type scale. They come in the following forms:

 Black letter: High contrast, narrow, with straight lines and angular curves
 Script: Replication of calligraphic styles of writing (more formal)
 Handwriting: Replication of handwriting (less formal)

1. UnifrakturMaguntia, black letter


2. Dancing Script, script
3. Indie Flower, handwriting

Display
A miscellaneous category for all classification types that are only suitable for use at large point sizes.
Display fonts typically are used as H1 - H6 in your type scale.

1. Shrikhand, display
2. Chewy, display
3. Faster One, display

Readability
While legibility is determined by the characters in a typeface, readability refers to how easy it is to
read words or blocks of text, which is affected by the style of a typeface.

Letter-spacing
Letter-spacing, also called tracking, refers to the uniform adjustment of the space between letters in
a piece of text.
Larger type sizes, such as headlines, use tighter letter-spacing to improve readability and reduce space
between letters.
Tighter letter-spacing:

For smaller type sizes, looser letter spacing can improve readability as more space between letters
increases contrast between each letter shape. Text in all caps, even at small type sizes, has
improved readability because of its added letter spacing.

Looser letter spacing:

You might also like