Now that we understand how to anchor our content with a text typeface,

let's see how to go about choosing a display face for the web.

As we saw earlier, display typefaces are meant for

larger sizes like big headlines, site titles, or pool quotes.

This allows for a bit more expressive and creative opportunity with letter forms.

Nice intricacies like thing serifs will be lost a point sizes, but

here they can shine.

Big bold condensed text with narrow counters would close up at body sizes, but

here you can soak them all in.

A nice casual sign painter script would hardly be legible in paragraphs, but

here it can flow beautifully as a heading.

So how should we go about choosing one?

First, make sure it's legible and readable.

Just because the type is bigger doesn't mean that

every character of a type face will be legible.

If a person can't read a headline or a title then the message hasn't been

enhanced by good typography, it's been lost by bad.

Although there's much more room for expression with display type.

Make sure you're choosing a well designed legible type face.

Just because something looks cool in a specimen image doesn't mean it'll

be usable.

Make use of the test we talked about by blurring your eyes to

see if the typeface has even overall color in all its characters.

Most web font sites include a type tester with their type faces.

Write out example headlines to make sure it's evenly spaced and

see what sizes it works best at.

Display type should have a tighter spacing than text typefaces.

Other things that can help readability in display faces are short

ascenders and descenders.

In the setting of headlines,

these features help reduce choppiness in the text.

Again, one of the big questions will be to ask,

does the mood of the typeface fit the content?

For text faces we talked about channeling the mood with subtle nuances in typefaces.

With display, we have a bit more room for expressiveness and mood.

We can use the words we came up with through our content exercise in

the previous video, and apply them to our search for

a display face that fits the right vibe.

If you're creating a site that's set around a certain time period in history,

look for typefaces that are true to that period.

That will take some research, but instead of choosing the mood we

think the period should look like, we'll be truly conveying what it is like.

Jessica Hische has some great thoughts on this,

which are linked to in the teacher's notes.

Next, we'll again want to think about who are our readers or users.

If we're creating a site for people in a specific industry, for

relevance, let's say web designers, then that effects how we choose a type face.

Take for instance this example on how to play into the typographic styles people in

the web design industry are accustomed to.

Let's say we want to display snippets of example CSS in blog posts on the site.

Code programs like TextWrangler or

Sublime are used by web designers, and default to mono-spaced typefaces.

These are fonts originally created for

typewriters whose characters all occupy the same amount of horizontal space.

They're great for code, but they wouldn't be a great choice for

text faces [SOUND] due to the decreased legibility and long paragraphs.

We can still play into this [SOUND] industry norm with our CSS

snippets though.

By utilizing a mono-space font, we can typographically make the snippet appear as

it would in an actual code environment.

Chris Coyier does an amazing job of this at http://www.csstricks.com.

And even goes a step further with color.

So take into account who are your readers, and

what style of typefaces they might be accustomed to.

I won't fully go into other priorities again,

as they were covered in the previous video.

But similarly to text typefaces, take into account the budget, and make sure

the display face has everything you need in regards to weights, styles, or accents.

Because display is used in less context.

There's a bit more flexibility here,

but you never want to set body text in all caps, you can actually

utilize a display face to great effect that only has upper case characters.

Also, it's possible to have a good typography with a single weighted font for

your display face.

These situations might not be ideal, but they can be worked with.

Lastly, there might be a scenario where you land a client who

already has a typeface for their brand.

The process then is sometimes as simple as finding the web font

version of that typeface.

But other times there might not be web font licenses available for it yet.

In that case you want to find a typeface that channels a similar mood and

style to the print version as you translate their brand to the web.

You could Google alternative to insert typeface name here.

But what's the fun in that?

Utilize all the knowledge you take in here to make a well informed decision for

what alternative fits best your client's needs.

You might just arrive at a different conclusion than those online forums.

Later on in the course, we'll get into more details on how to pair typefaces.

But I hope this has helped to still some of the ambiguity around choosing

a typeface for the Web.

Think about where it's going to live,

what makes it legible, if its mood matches the content and audience.

Does it have everything you need?

And what factor will cost play?

This is by no means an exact science, so please have some fun along the way.

The answer to these questions should help guide you in a good direction.

And leave room for your own personal taste and design choices.

Next, we'll look at the different ways to implement web fonts on a site.