All right. 1
The next topic I want to talk about is typography. 2
Now, I know a lot of students always say to me 3
"But why do I need to learn about typography? 4
I just open up Word, click the dropdown, 5
find Times New Roman, 6
my favorite font. 7
And then just put that on everything. It's done right?" 8
Well let's think about this. 9
Well let's say it's Valentine's Day and you decide that you want to write a letter to your beloved Valentine 10
and you change the font to something cursive like this. 11
"You'll always be mine." 12
I don't know if she or he will be 13
but you have a good chance. 14
Now let's say that you chose the wrong font. 15
That's a bit of a problem. 16
Not only do I not think your Valentine is going to take very kindly to this, 17
you might also have the police on your back which is a bit of a problem. 18
So fonts really do matter and it's important to consider not only their mood but also how to combine 19
different fonts. 20
And it's a really really easy way to make your designs look very professional and really slick. Out of 21
all of the fonts in the world 22
there's pretty much two large families that you should really know about. 23
One is the Serif family where they have these little feet at the end of their central beams. 24
And the reason why they have these old feet is because the Serif typeface were inspired by the marble 25
carvings of days of yore. 26
So if you next go out and you take a look at the buildings around you especially if you're in a historical 27
area, take a look at places where they've carved into stone or marble and you'll notice that they also 28
have these little feet at the end of the central beams. 29
So why is that? 30
I don't know how many of you carved marble in your spare time but if you did you would know that once 31
you chisel has gone into the Rock and you need to exit your engraving it's actually not possible to 32
create 90 degree angles when you're carving into rock. 33
So this is where the Serif typeface gets their inspiration from. 34
And this is also the reason why when you're choosing a Serif typeface you're making your design look 35
more serious, more authoritative and also a little bit older as well. 36
So it's really good if you're designing something like a letterhead for a legal company or a magazine 37
for architectural design. 38
But when we take a look at the big family of Serif typefaces 39
they're actually further subdivided into smaller sub families like Old style, Transitional, Modern and 40
Slab-Serif. 41
Now the really interesting thing is you can actually tell how old a typeface would look by looking at 42
the difference between the thickest and the thinnest parts of each letter. 43
So compare the Old Style 'o' versus the Transitional 44
'o' versus the modern 45
'o'. And look at how that difference between the thickest part of the letter and the thinnest part gets 46
more and more exaggerated as you get towards a more modern font. 47
So if you want something that looks authoritative but modern then maybe you want to go for a modern 48
Serif typeface like Didot. But if you want it to come across as a little bit older, a little bit more aged 49
maybe you have a winery, maybe you want to go for an Old Style Serif instead. 50
Now just as different colors have different moods and emotions, different fonts also have different moods 51
and they also convey a different message to a user depending on which one you choose. 52
So the Serif family generally come across as traditional, stable, respectable, authoritative. 53
These are the words that get thrown around by designers when they're thinking about the Serif typeface. 54
So for example, the next time you go to a magazine rack pick up the Vogue magazine. 55
Take a look at their title and see how it's a modern Serif typeface. 56
It's got hugely exaggerated difference between the thick and thin parts of the lettering and it looks 57
authoritative and it knows what it is talking about. 58
Now on the other hand, if we think about the San-Serifs, they're kind of a different family because instead 59
of having the Serifs or the little feet at the end the central beams, they have perfect right angles. 60
And it's this right angle that makes the San-Serif family look so much more friendly, more approachable, 61
more novel and more contemporary. 62
So for example, you will tend to get words like sensible, simple, straightforward. And this is why a lot 63
of startups love using the San-Serif typeface in their websites. 64
For example, a Humanist typeface which is a subfamily of the San-Serifs. It's something that is known 65
as a highly readable typeface. And in fact, even within the Serifs and the San-Serifs, you will tend to 66
see designers going for the San-Serifs if they want to write body text which needs to be more legible 67
and more readable. 68
Now within this sub family, there's even differences in terms of legibility and readability. 69
So how easy are the words to read and how pleasant is it to read the letters. 70
There was a really interesting study done by MIT a few years back where they took two groups of users, 71
one they put them into a car which had a dashboard made of a Humanist typeface and the other car had 72
a dashboard which had a Grotesque San-Serif typeface. And what they did is they tracked the pupils of 73
the people who were driving the cars and they tested how long each driver needed to look down at the 74
dashboard before they got enough information from the speedometer or the odometer and before they could 75
come back and look at the road again. And really surprisingly they found that just by changing the font 76
from a Grotesque San-Serif to a Humanist San-Serif, they could save the drivers somewhere around 77
30 to 40 percent of the time that's required to understand the information. 78
So imagine that car is on a freeway that's driving at 60 miles, 100 miles an hour. 79
That difference in the amount of time the user needs to look down at the dashboard could be the difference 80
between life and death. 81
And as designers, we rarely get to make that kind of difference in the world right? 82
So knowing that the Humanist typeface, all of the fonts that belong in that category like Gill Sans, 83
Tahoma, Verdana, these are highly readable and highly legible fonts which you can use in the body types 84
for example of your sales pitch. 85
Now, even though we're not saving lives with our sales pitches, 86
if you manage to get the user to read through more of your sales copy then they're probably going to 87
be more convinced and more likely to buy your product 88
right? 89
So readability and legibility when you're choosing fonts is incredibly important. And the things that 90
you're looking for in the letters when you're looking for legibility are open shapes and a lot of space 91
between each of the letters and also the forms look unambiguous so they look different 92
for example here the 'g' and the 9 actually look different on the second line. And finally, varying proportions. 93
So having an 'O' that's very wide and a '0' that's a bit more narrow so you can actually tell the difference 94
between the two. 95
Now while we've talked about using fonts it's often that you see people go a bit overboard where they 96
choose 10 fonts in the same design. And that makes your design look very cluttered and very unprofessional. 97
I recommend actually sticking to just two fonts in one design. 98
So if you're making a poster keeping that to two fonts. If you're making a section of your website keeping 99
then again to two fonts. It just looks a lot cleaner and a lot tighter. 100
And when you're combining these two different fonts you want to try to go for similar moods. So find 101
fonts that have a similar mood to each other and also a similar time era. 102
You don't want something that looks ultramodern with something that looks like it's from the days of 103
yore combined together. It looks a little bit weird. 104
Now the things you want to contrast are the serifness. 105
So for example you on the heading to be a Serif and the body to be a San-Serif or the opposite way 106
round. It just creates more interest in your design. 107
And similarly, you can also create interest by just changing up the weights between the heading and the 108
body. So making the heading really really bold or even using a black typeface and making the body text 109
using something like thin or regular or light. These different weights can create contrast in your design. 110
Now if you don't remember anything from this talk on typefaces, I just want you to look at these six 111
fonts and try to wipe them from your memory because it is very very difficult to make these designs 112
look good unless I guess if you're running a lemonade stand. 113
But if you want to look professional, if you want to look designs, try to use one of the other fonts that 114
we've talked about and try to ignore these ones which are difficult to read and have moods that are 115
difficult to fit in in a professional setting. 116
The next time you're designing a website think about what typefaces you're going to choose. 117
Think about what you're trying to convey with those typefaces and then pick a font from the San-Serif 118
or the Serif family and maybe try to combine them 119
so you have a heading that's a San-Serif and a body that's a Serif and try to create contrast in your 120
designs. 121
So keep this in mind and hopefully they'll make your designs a lot more interesting and a lot more professional.