Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
Type comes in many different shapes and sizes, each with its own voice and personality. We’ll explore a few typefaces along with their letterforms to see the genres recognized today.
Making Sense of Type Classifications Part 1 and Part 2, Joseph Alessio
Type History Series, I Love Typography
Extreme Type Terminology Series, Paul Dean
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
In this part of the stage, we're going to
be looking at different classifications or
0:00
types of Typefaces.
0:03
You might be wondering, why is this
important?
0:05
Can't I just find something I like and use
it?
0:07
I'm glad you asked.
0:10
Knowing your different type genres and
what makes them tick will help you
0:12
choose a proper Typeface for the projects
at hand and make you a better designer.
0:15
For instance, if you're working with
clients who want the mood of
0:20
a site to convey eloquence, you need to
know what classes or
0:23
styles of Typefaces lean towards that
bent.
0:27
Or, if you're designing a site that's
heavily influenced by
0:30
a certain time period, you should utilize
a Typeface that would have been
0:33
appropriate to the genres at that time.
0:37
As I mentioned earlier, Typefaces have a
mood or a personality.
0:40
The way the letter forms look conveys a
message to the reader.
0:44
Knowing these genres will help us see how
our type is talking, and
0:48
what makes them distinct.
0:52
So without further ado, let's dive in.
0:53
Type has been classified in different ways
over the years.
0:57
But for simplicity sake, and because our
focus for
0:59
this course will be on web typography,
we'll look at three major genres.
1:02
Serif, Sans Serif, and Scripts, along with
their sub-genres.
1:07
Up first, we'll look at Serif Typefaces.
1:12
Like we learned from our terminology,
Typefaces can have serifs on their
1:15
letter forms and this would place them
within serif genre.
1:18
Simple enough, but within this genre we
have a number of
1:22
nuances that will set apart different
serifs into sub-genres.
1:25
The sub-genres we'll be covering are
Humanist, Old Style,
1:29
Transitional, Didone, and Slab.
1:33
After the invention of the printing press
in 1450,
1:35
logically, the creation of Typefaces
shortly followed.
1:38
Humanist typefaces arose in the 1460's and
1470's with strong calligraphic influence.
1:42
Printers were creating Typefaces based on
the strokes of
1:48
a pen when drawing letter forms.
1:51
They tend to have diagonal stress, lower
stroke contrast, and
1:53
relatively small x-height.
1:57
Their serifs are not as refined.
1:59
Humanist Typefaces are not as common
today, but
2:01
some examples of these are Janson,
Kennerley and Centaur.
2:04
Old Style came about next in the later
part of the 15th century.
2:09
The letter forms were getting more refined
as type and
2:12
less influenced from calligraphy.
2:15
We see less diagonal stress happening and
2:18
the serifs have also changed to be more
wedge-like.
2:20
These lasted two centuries strong.
2:23
Some examples include Goudy Old Style,
Palatino, Perpetua and Plantin.
2:25
This brings us to the 18th century where
we see transitional Typefaces on the rise.
2:30
The trend of decreasing calligraphic flow
continues.
2:36
And here we have vertical stress, thinner
and
2:39
flatter serifs along with exaggerated
contrast between thicks and thins.
2:41
Some examples include Baskerville,
Bookman, and Clearface (ITC).
2:47
Next, we have the Didones arriving in the
late 18th century.
2:51
The influence of the pen is really nowhere
to be found.
2:56
The serifs have become even thinner
without any sign of bracketing.
2:58
Contrast is taken to the extreme with
thick verticals and
3:02
ultra thin horizontals.
3:06
You might regard these Typefaces as
reminiscent of high fashion culture.
3:08
They work great at large sizes, with ample
amount of white space around them.
3:12
But as body copy at small sizes, their
serifs and
3:17
horizontals can quickly get lost.
3:20
Some examples include Bodoni and Didot.
3:22
Now, we'll head into the opposite
direction with Slab Serifs who have
3:25
extremely thick, slab-like serifs and low
contrast.
3:29
These came about in the early 19th
Century.
3:33
And were heavily influenced for
3:35
headlines in advertising because of their
bold, look at me appearance.
3:37
Most of these are utilized at large sizes,
but
3:41
a few have been known to also work well at
small sizes.
3:44
Some examples of these include, Rockwell,
Clarendon, Egyptienne, and Centinnel.
3:47
Next, let's move into the new genre of San
Serifs.
3:53
These Typefaces do not have serifs on
their letter forms or
3:57
literally are without serifs.
4:00
We'll look at the Grotesque,
Neo-Grotesque, Humanist, and Geometrics.
4:03
In the late 19th century, we see the rise
of Grotesque San Serifs.
4:08
Though we see san serifs as completely
normal today.
4:13
Don't forget there wasn't much of a
reference for them when they came about.
4:17
The design of an earlier one,
4:21
Akzidenz-Grotesk, has actually been
theorized to be derived from Didot
4:22
because the Typefaces have similar metrics
when the serifs from Didot are removed.
4:28
As we'll see in other genres, sans serifs
are typically low contrast.
4:33
Some examples of Grotesque also include
Franklin Gothic.
4:37
The Neo-Grotesque then arises,
4:41
refining some of the peculiarities in
early grotesques.
4:43
These are some of the more common sans
serifs and Helvetica fits right in there.
4:46
Although there's a desire for simplicity
here,
4:51
there aren't always great candidates for
body copy because the simplicity and
4:53
similarity in letter forms can also effect
legibility at small sizes.
4:57
Other examples include Univers.
5:02
Next, we have Humanist Sans, not to be
confused with Humanist Serifs.
5:05
And these get back to some calligraphic
roots with greater variations in
5:09
line widths.
5:13
These are often the most legible of the
sans serif's bunch.
5:14
Hence, their popular use as website body
copy.
5:17
Examples include Tahoma, Gill Sans and
Frutiger.
5:20
Lastly, in our sans serifs, we have our
Geometrics, which are quite popular today.
5:24
As the name implies,
5:29
their letter forms are based on geometric
shapes like circles and squares.
5:30
Examples include Futura, Bank Gothic and
Gotham.
5:35
Now we'll move into our final genre of
scripts,
5:39
which are Typefaces based on handwriting.
5:42
We'll subset this genre into Formal
Scripts and Casual Scripts.
5:45
Formal Scripts are based on letter forms
from writing masters in the 17th and
5:49
18th century.
5:54
They have some contrast between thick and
thin as they are inspired by
5:55
the way a quill or nimbo pen would handle
the letter forms.
5:59
They tend to be more elegant and work well
for events like weddings today.
6:02
Casual Scripts are a bit more free and
well, casual.
6:07
They tend to be more light hearted or
6:12
easy going that their seriously eloquent
counterparts.
6:14
The contrast can range from low to high,
depending on the typeface.
6:17
They are often inspired by the way a brush
or a marker would handle the letter forms.
6:20
All right.
6:26
That was a lot to cover.
6:27
I hope it helps you get to know type a
little better, so
6:28
we can make smarter choices down the road.
6:31
Also, think about if there's a certain
class that you naturally
6:33
gravitate towards.
6:36
In the next video, we'll look at designing
for print versus the web.
6:38
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up