Meet Your Type: Typography book

8/7/2019 Meet Your Type: Typography book

1/52

MEET YOUR TYPEa feld guide to love & typography


2/52

CONTENTS


3/52

CONTENTS

TIME TO COMMITont licensing and creation

page 38

page 26

MAKING IT WORKtypographic details

page 16

COULD THIS BE THE ONE?appropriate type ace selection

page 04

TIME FOR THE TALKthe elements o typography


4/52


5/52

THE BIRDS & THE BEEStype ace vs. ont

5

typography.


6/52

TIME FOR THE TALKthe elements o type


7/52


8/52

08

ABCDEGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz

MILOTHIN.OTF = FONT

uzzpeach

MILO THIN

MILO REGULAR ITALIC

braTRAININGMILO TEXT

MILO EXTRA BOLD


9/52

007

A type aceis a single set o characters that share stylistic unity.A type ace usually comprises an alphabet o letters, numbers,punctuation and diacritical marks.

Old school typographers de ned a ontas a complete characterset o a particular type ace in one size. When type made the leapto the digital realm, a ont became an electronic le that renderedthe type ace in all sizes.

You may notice that youre changing. Youre noticingdi erent letter orms. You may eel di erent aroundthem. Dont be embarrassed; these eelings are natural.A ew basics can help you through the awkward years.

THE BIRDS & THE BEEStype ace vs. ont

TYPEFACE

FONT

A type ace is what you seea ont is what you use to makeit happen.


10/52

The distance between the baseline

and the top o a capital letter.

The imaginary, yet crucial line

where all obedient letter orms sit.

The enclosed negative

space within a letter.

COUNTERBASELINECAP HEIGHT

Double chin, big eet, or bowed legs. Little details willtell you a lot about your type. Go ahead and check themout its not shallow. Its your job.

FF DIN PRO

YOU JUST WANT ME FOR MY BODYtype anatomy


11/52

Even though it sounds

li e-threatening, it isjust the endpoint o the letter orm.

Width o a character in relation tothe height. Being wider than youare tall isnt always a bad thing.

The height o a lowercase x or the height o

lower case letters.

The male anatomy o a

lower case letter that hangsbelow the baseline.

Quite ambitious, this parto a lower case letter risesabove the x height.

ASCENDER SET WIDTH

TERMINAL

X HEIGHT

DESCENDER

More than any other part o the body, the x-height candramatically a ect type readability. Avoid extremely small orvery large x-heights i that is important to you.


12/52

010DOES (POINT) SIZE MATTER?type measurement

Youve probably heard the rumor: the bigger your type,the better. While that is sometimes true, on otheroccasions smaller is better. No matter what size youreworking with, i used properly, it can be e ective.

The point system is used by women everywhereto reward their men or good behavior.A similarly archaic system, using points andpicas , measures typographic dimensions.

Worrying too much about size can lead to anin eriority complex. Point size has very little to dowith the actual size o your type anyway. Sometype aces can appear much larger than othersat the same point size. So measure however

you want points, picas, inches, centimeters,or (gulp) millimeters. Just remember to alwaysprint a test page be ore committing to a size.

THE POINT SYSTEM

POINT SIZE

When concerned aboutreadability, pay asmuch attention to thex-height as the pointsize. X-heights that are

too small or too largecan dramatically affectreadability.


13/52

011

to pleae you.

Oh,THE LENGTHS I GO

OXTAIL OT

196 PT

17.5 PT

44 PT

72 POINTS = 1 INCH

6 PICAS = 1 INCH

12 POINTS = 1 PICA

POINT

PICA

INCH


14/52

At FONTSHOP.COMyou can browse through thousandso onts in these and other categories. Consider it yourpersonal little black & yellow book.

SANS SERIF SLAB SERIFSERIF

ARE WE MEANT FOR EACH OTHER?type history & classi ication

Lean and clean,these lovemachines weredesigned or theindustrial age.Theyre hard-working andmodern, with noneed or ancyseri s.

Based onthe carvingso the ancientRomansnowtheres a groupwho knew aboutlovinseri s

eature small eet at the end o the letter orms.

The big-bonedcousin in everytype amilytheirseri s are bluntand opinionated.No nonsenseheresay I loveyou like youmean it.

Everyone has a past.While some thingscan be overlooked,type history is notone o them.

Pre-screen with alittle backgroundcheck and avoid a loto baggage later.

GARAMOND FF SCALA SANS STYMIE


15/52

013

DISPLAY NON-WESTERN SYMBOLSBLACKLETTER

Display aces arethe crazy onesyou date be oregetting marriedto someone nice

rom the Midwest.Theyre not built

or long-readingrelationships.

Dont expectyour parents tounderstand thelure o exotic,non-western type.The language o love knowsno bounds.

Blackletter typewas originallydesigned tomimic thecalligraphy o 12th centuryEuropean monks.Poor lonely,single monks.

Telling someonehow you eel canbe hard to putinto wordsenterdingbats, orsymbol ontsthe best wayto say

f +O =

SCRIPT

The trashyromance novelyou hope willnever endscriptevolved romcursive styles.Best used whenthings start to getserious.

WAZAFETTE FRACTUR HELVETICA CYRILLICZEBRAWOOD ZAPF DINGBATS

I I could rearrange the alphabet I would put U and I together.


16/52

014

The traditional type amily includes roman, italic,bold, and small cap styles. Modern amilies canbreak the mold and include other styles.

Extended amiliescan branch out to include not-so-distant cousins like hairline, black, extendedand condensed styles, to name a ew.

The yours, mine, and ours o typography: someamilies include seri , sans seri , and every style

in between. They begin to work as completetypographic systemsin-laws and all.

TRADITIONAL FAMILY

EXTENDED FAMILY

SUPER FAMILY

MEET THE PARENTStype amily

Whoa! It seems early, but sometimes the true test comes

when you meet the whole amily. Regardless, its alwaysgood to know what youre getting into.

isnt ourfamily super?


17/52

just wait

Uncle Rick FINALLY MADE

Parole!

until you meet

my family

BLACK ITALIC

SMALL CAPS

CONDENSED BOLD

ROMAN (REGULAR)ITALIC

SMALL CAPS

BOLD

TRADITIONAL FAMILY : FF Scala

SUPER FAMILY : FF Scala / Scala Sans


18/52


19/52

COULD THIS BE THE ONE?appropriate type ace selection


20/52

018

Avoid the embarrassment o typographic rejectionby rst determining the likes and dislikes o yourtarget audience. Get inside their head. Grab their

attention. Unleash the pheromones and cast yourspell. Understanding their pre erences is essentialbe ore wooing them with type.

In order to attract a mate, youve got to set the bait.

Some people are drawn to curvy swashes, some likegrungy scripts, and some go or bold and simple.Knowing what your audience wants can help youchoose a type ace that will make em tingle.

THE CHASEtype selection

When surveying the datingpool, consider the ollowing:age, income, marital status,dental hygiene, ethnicity, sex,education, geographiclocation, buying patterns,political interests, etc.


21/52

FIRST CRUSH

COUGAR

prowlon theAQUAMARINE OT

FF FONTESQUE SANS & BOKKA SHADOW

POSTER BODONI BT

Make

OFFICE ROMANCE

PRESENTABLE

yourself TIMES NEW ROMAN

@ ---------->------------------

Who isyour audience?

Play theGame


22/52

YES

WHATS YOUR MESSAGE?

HOW ARE YOU USING THE TYPE?

headline copy?

does it need to set a mood?

what medium?

large amounts of copy?

NO

NO

NO

PRINT

SCREEN

YES

YES

YESYES


23/52

TEXT FACE

DISPLAY FACE

SCREEN FONT

My one

ONLY& FF SERIAMASS TEXT

friend request

FF SCREEN MATRIX

FF META OFFICE

boy toyFF TOKYO

Life of the partyFF MINIMUM

A ter a wild night on the town, sometimes a little

quiet is what you need. Look or someone who iseasy to read and in it or the long haul. Classic acesmay not be as ashy, but their loyalty and simplicitywill win you over in the end.

Avoid the disappointment o an online pro lethat doesnt quite measure up in real li e. Some

onts simply look better on screen while others

look better in print.

Consider this type when you need to make astatement, put on a show or your riends, orjust have some un. These outspoken aces areknown or setting a mood, but can sometimesbe over the top. They may be great or a summer

ing just dont get too attached.


24/52

022MAKE ME A MATCHtype pairing

Any love doctor will tell you, to make it work, youve got

to be in synch. So when playing matchmaker, chooseyour type aces care ully. Each one has a role to play whether the task is commonplace or kinky.

One lover at a time; maybe two . No need orthree i youve got a winner. Even the mostcomplicated projects, like the Fredericks o Hollywood catalog, can be solved using onlyone or two type aces.

Opposites attract. I your onts are too similarto each other, it seldom works. Considerpairing a ashy, extrovert (display ace) with anunderstated, introvert (text ace). Also considerpairing another weight rom the same amily

(type amily that is).

SIMPLICITY

CONTRASTWhen combiningtwo type aces (eveni theyre the samepoint size), you mayneed to adjust theirpoint sizes to make

their x-heights match.


25/52

023


26/52


27/52

MAKING IT WORKtypographic details


28/52

Someone always seems to dominate in a

relationship. Its important to know when tolead and when to ollow. There are clear wayso establishing hierarchy, regardless o whoswearing the pant-suit.

026TAKING THE LEADhierarchy

HIERARCHY

Hierarchy = Rank = Order of Importance

E ective hierarchy gets people tolook where you want them to look,when you want them to look there.Without it the reader is le t con usedand rustrated. Emphasis can bestressed by size, weight, color, styleand placement.

Emphasis can generally becreated by using a single stylechangenearly eliminatingthe need to ever use a bolditalic. Ever.


29/52

crackTHE WHIPSCREAM!

Make your type****************

FF CHAMBERS BLACK

FF AVANCE BOLD

BREE THIN

FF CHAMBERS REGULAR

POPPI

can you loosenthe handcuffs?

HONEY,

1

3


30/52

CENTERED

FLUSH RIGHT

FLUSH LEFT

JUSTIFIED


31/52

029 WHEN THE STARS ALIGNtype alignment

CENTEREDHandy or prim, poetic passages.Not meant or large amounts o text.

FLUSH LEFTType purists pre er this de ault ora good reason: its the easiest to readbecause we read it most o ten.

FLUSH RIGHTA nice break rom the norm, but a bithard to read; should only be used or

small captions or special callouts.

JUSTIFIEDA crisp, handsome look, but vulner-able to awkward hyphens and rivers

(gaps running through the text.)

E ective communication will help you avoid classiccourting catastrophes like the snuggle-blunder and the

miss-kiss . When you talk it out and align yourselves,therell be no need or a blooper reel.


32/52

030

Even in the best relationship, everybody needs a littlespace. Take some time to breathe. Dont ruin a beauti ulthing just because someone gets clingy.

HOW CLOSE IS TOO CLOSE? kerning, leading, letterspacing

Adjusting the space between individual letterswhen awkward pauses come between them.

KERNING

The overall spacing between letters in a block o text, it is also known as tracking. Generally, thelarger the type, the less letterspacing required.

LETTERSPACING

The amount o horizontal space between twolines o text leading is measured rom baselineto baseline. A healthy balance between point sizeand leading can keep things together andmoving ahead smoothly.

LEADING

While addingspace betweencapital letters isacceptable, extraspace betweenlowercase lettersusually causesthe love to ade.quickly.


33/52

Generally, largertype requirestighter kerning.

XOXOXOXOXOXXOXOXOXOXOXOXOXXOXOXOXXOXOXOXOXOXOXOXOXXOX0

LustXOXOXOXOXOXXOXOXOXOXOXOXOX

XOXOXOXXOXOXOXO

XOXOXOXOXXOX0

XOXOXOXOXOXXOX

OXOXOXOXOXOX

XOXOXOXXOXOXOXO

XOXOXOXOXXOX0

LEADING

LETTERSPACING

KERNING Love

l o n e l y smotherhealthy

UPTIGHT AND HARD TO READ

ITS GETTING AWKWARD

COMPATIBLE CHARACTERS

PLAYING TOO FAST AND LOOSE

AHH, PERFECTION

WERE DRIFTING APART I NEED SOME SPACELOVE AT FIRST SIGHT

FF META PRO MEDIUM

DELICATO BOLD

CORPULENT


34/52

032LOVE ME AS I AMtype distortion

Instead o resorting to typedistortion, consider usingFONTSHOPS TYPE NAVIGATOR.

Search or the per ecttypographic proportions likewidth, height and weight attypenav. ontshop.com

The longer youre with someone, the more

aws you notice. When things get really bad,remember your mothers warning: you cantchange em. True love is unconditional.Love them the way they are .

I you eel the urge to widen, shorten or outlineyour typeresist! Abuse is not the answer.Type designers have meticulously created theideal proportions or each letter orm. I thetype isnt working, never eel ashamed to getout o the relationship and nd a di erent typethat suits you better.

DISTORTION: VERTICAL HORIZONTAL FAUX ITALICS


35/52

Dont orget to holddown the shi t key whenscaling to preservenatural proportions!

FF META & FF META SERIF

Im not

stretched, Im

just big boned


36/52

034

NUMBERS

LIGATURES

ALTERNATIVE TYPESTYLESspecial characters

X O

An elegant expression o typographic ondness,ligatures create a single character out o two.

Old style fgures1 are designed to work withintext, while lining fgures2 align better in chartsand graphs.

Make sure to always activate smart quotes andstandard ligatures in your application pre er-ences.

On occasion, some typographers pre ercharacters with a little more style and ourishthan those set in straight letter orms. Used in

moderation, these alternate or swash characters are a great way to dress up boring type.

Some characters are in a class o their own. While theymay seem amboyant or eccentric, dont be a raid to give

them a try. Adding a little spice can be very liberating.

SMART QUOTES

SWASH CHARACTERS

456 7891 2


37/52


38/52


39/52

TIME TO COMMITont licensing and ont creation


40/52

BALL &

CHAIN


41/52

039 MAKING IT LEGALlicensing a type ace

When youre sure youve ound the one, you gotta lock it

down. Licensing a ont sounds like a big commitment ,but making it ofcial supports the development o thenext generation o beauti ul type. Do it or the kids.

Cold eet? Shackup frst. Many type

oundries o er atry-be ore-you-buyoption. Previewbe ore you purchase

your avorite onts atFONTSHOP.COM.

FONT LICENSE

I, (insert name), do take you, (insert type ace), to bemy law ully wedded ont. To love, honor andcherish and not pass around in class, post online,email to riends, siblings, or co-workers rom thisday orward until death do us part. Amen.

Congratulations! Youve just committed to asingle-user ont license. Luckily, type oundriesare open to polygamous relationships and willgladly license their onts to multiple users.


42/52

040

Designing a type ace is a huge commitment.Prepare or long hours, sleepless nights and lots o nasty surprisesit s de nitely not or everyone. Forthose willing to take on the challenge, designingoriginal type can be a rewarding experience.

Now that youve ound your match, its only natural towant to make beauti ul type together. Maybe its time tostart thinking about expanding your amily.

NINE MONTHS LATERtype creation

I you decide tocreate your owntype ace, the

ertility experts atFONTSTRUCT.COM can provide all thenecessary tools or

the typographicincubation process.

Dont be embarassed i it s not happening or you.Some people aren t able to conceive. For them,adoption might be the best bet. A ter all, there areplenty o onts out there just waiting to beadopted, nurtured, and loved.


43/52

41

BE ADVISED:Abduction is not the same as adoption.

CA O OC O


44/52

042CALL THE LOVE DOCTORexpert advice

The honeymoon is over . Isnt this what you expected? It

doesnt have to be this way: i you eel the magic start toade, re er to this handy list o interventions. We neversaid it would be easy, we only said it would be worth it.

FONT SELECTION Make surethe type ace and everythingassociated with it is appropriate

or your project. There is nothing

worse than dating someone whois stuck in the seventies wheneveryone else has moved on tothe eighties.

NUMBERS When set in bodycopy, numbers can look large.Try reducing the point size o the numbers slightly so theyblend in better.

READABILITY Columns that aretoo short or too wide are hardto read. An ideal measure is6070 characters per line, or40 when romancing online.


45/52

CLUTTERAvoid distractingbackground patterns or busyphotos behind the type.

POINT SIZE Always choose thebody copy size rst, and make

everything else work with it.

SPACING ISSUES Tighten up theletterspacing when using largetype, such as in a headline.

LEADINGThe bigger the bodycopy, the smaller the leading,especially i you use all caps.

BOREDOM Consider adding dropcaps, rules, or other specialgraphic devices into the mix.

When small type is REVERSEDona dark background, adding a bitof tracking can help readability.

CONTRAST Squint at your layoutto see the type color. If everythingis gray, add emphasis somewhere.

HIERARCHY Design a clear visualpath or the viewer to ollow.Just like your signi cant other,the most important text shouldget the most attention.

Use ewer onts and type acestyles in your project. The oldadage twos company threes acrowd works with type as well.

WIDOWS & ORPHANS Show

compassion to orphans (wordsabandoned at the beginningo a column) and widows(words le t alone at the endo a paragraph).

i

044IT DOESNT HAVE TO END THIS WAY


46/52

044

FontStruct fontstruct.comHate the game? Make the type ace o your dreams with thisonline ont generator. You dont even have to wait or a visa!

When it comes to love, some people are clearly more

experienced than others. Look to these tried and trueFontShop resources as your own typographic supportgroup always on hand when an ugly relationship is get-ting you down.

FOLDSTRUCT

IT DOESNT HAVE TO END THIS WAYFontShop resources

045


47/52

045

046IT ONLY GETS SWEETER


48/52

046

Font fontshop.com/blog/fontmagTalk about ree love! Create a FontShop account, and get this acclaimedtypography publication and regular new ont updates or nothing.

IT ONLY GETS SWEETERmore FontShop resources


49/52

TheFontFeed fontfeed.comImpress them with your typographic knowledge. This ber blog has it all:interviews, eye candy and new type aces, all gleaned rom sources worldwide.

FontShu fe apple.com/iphone/apps-for-iphoneSay goodbye to boring dates! Bust out this handy app when your date just isntcutting it. Just dont let him catch you drooling at all the other FontFont hotties.

FontShop Education fontshop.com/help/educationEveryone needs a mentor. Come here or answers to all o your type-relatedquestions. Theres even some in o or your know-it-all pro essors.

FontCase fontshop.com/products/fontcaseIts hard to keep track o them all, so let this award-winning ont manager keep

your onts organized and at your ngertips.

Type Glossary fontshop.com/help/glossaryThe language o love has a lingo all its own. Use this ofcial Type Glossary togain uency in essential type terminology.

Baby, i you were on a page, theyd call you fne print.

048WATCH & LEARN


50/52

048

Websites & Blogs100types.comaiga.orgbitique.co.ukdailydropcap.comdesignobserver.comdesignworkli e.com

orm i ty ive.comriendso type.com

gra ikcache.comilovetypography.comministryo type.co.uktdc.orgthinkingwithtype.comthevisualdictionary.net

typographer.orgtypographica.orgtypophile.comwelovetypography.com

MagazinesCommunication Arts commarts.comCreative Review creativereview.co.ukEye eyemagazine.comHOW howdesign.com

Idea idea-mag.comPrint printmag.com

BooksDesigning Type by Karen ChengDesigning With Type: The Essential Guide to Typographyby James Craig, William Bevington, Irene Korol ScalaStop Stealing Sheep by Erik SpiekermannThe Complete Manual of Typography by Jim FeliciThe Elements of Typographic Style by Robert BringhurstThinking With Type by Ellen LuptonType: The Secret History of Letters by Simon Loxley

Whats a nice ligature like you doing in a place like this?

WATCH & LEARNother resources

049

TERMS OF ENDEARMENT


51/52

049 TERMS OF ENDEARMENTindex

ALIGNMENT028ASCENDER009BASELINE008

BLACKLETTER013CAP HEIGHT008CENTERED028CLASSIFICATION012COUNTER008DESCENDER009DISPLAY FACE013FLUSH LEFT028FLUSH RIGHT028

FONT007FONT LICENSE042

JUSTIFIED028HIERARCHY026KERNING030

LEADING030LETTER SPACING030LIGATURE034NON WESTERN013NUMBERS034POINT SIZE011SANS SERIF012SCREEN FONT021SCRIPT013

SERIF012SET WIDTH009

SLAB SERIF012SMART QUOTES034SPECIAL CHARACTERS034

SWASH CHARACTERS034SYMBOL013TERMINAL009TEXT FACE021TYPE CREATION040TYPE DISTORTION032TYPEFACE007TYPE FAMILY014TYPE PAIRING022

TYPE SELECTION020X HEIGHT009

2010 FSI FONTSHOP INTERNATIONAL. ALL RIGHTS RESERVED.

BOOK DESIGN: BYU, CLASS OF 0910.

PE


52/52

ERIK SPIEKERMANN

MEET YOUR TYP

Im obviously a typomaniac. Other people like lookingat girls bottoms. I get my kicks out o looking at type.

Meet Your Type: Typography book

Documents

Transcript of Meet Your Type: Typography book