Top Banner
Definition: The style, arrangement, and appearance of text on a page.
50

Definition: The style, arrangement, and appearance of text on a page.

Apr 02, 2015

Download

Documents

Jarrod Sage
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Definition: The style, arrangement, and appearance of text on a page.

Definition: The style, arrangement,

and appearance of text on a page.

Page 2: Definition: The style, arrangement, and appearance of text on a page.
Page 3: Definition: The style, arrangement, and appearance of text on a page.

David Carson

Page 4: Definition: The style, arrangement, and appearance of text on a page.
Page 5: Definition: The style, arrangement, and appearance of text on a page.
Page 6: Definition: The style, arrangement, and appearance of text on a page.
Page 7: Definition: The style, arrangement, and appearance of text on a page.
Page 8: Definition: The style, arrangement, and appearance of text on a page.

Type Effects forPhotoshop and Illustrator

Page 10: Definition: The style, arrangement, and appearance of text on a page.

Even everyday type should be designed well. It reflects on youand your business.

Page 11: Definition: The style, arrangement, and appearance of text on a page.
Page 12: Definition: The style, arrangement, and appearance of text on a page.
Page 13: Definition: The style, arrangement, and appearance of text on a page.

• Display Type: Large type (e.g., used in headlines)

• Body Copy: Small type found in the body.

Page 14: Definition: The style, arrangement, and appearance of text on a page.

FONT FAMILIES

Page 15: Definition: The style, arrangement, and appearance of text on a page.
Page 16: Definition: The style, arrangement, and appearance of text on a page.

SA

NS

SER

IF

Page 17: Definition: The style, arrangement, and appearance of text on a page.

OLD

STYLE

Page 18: Definition: The style, arrangement, and appearance of text on a page.
Page 19: Definition: The style, arrangement, and appearance of text on a page.
Page 20: Definition: The style, arrangement, and appearance of text on a page.
Page 21: Definition: The style, arrangement, and appearance of text on a page.
Page 22: Definition: The style, arrangement, and appearance of text on a page.

• CONCORDANT TYPE: Type that is all the same font (can be boring).• CONTRASTING TYPE: Type that contrasts must contrast dramatically.• CONFLICTINT TYPE: Type that conflicts is too similar (not good).

Page 23: Definition: The style, arrangement, and appearance of text on a page.

Subheading

A type hierarchy exists when the most important type is in largest, heaviest weight; the subheadings are smaller yet bold; and the least important text (the body copy) is in the smallest and lightest. Body copy also needs to be in a simple font (not script or decorative) so that it can be easily read.

Bullets and Emphasis

Use italics or bold for emphasis, not all capital letters. Use bullets or numbers to offset important points like those below:

Use bullets or numbers to offset important points.Bullets should be solid and bold.Do not use asterix, complex wingdings or symbols.Do no use too much space between your bullet and text.

Page 24: Definition: The style, arrangement, and appearance of text on a page.

Principles Designers Know

• Words carry emotional impact.• Letter forms carry emotional impact.• The shape and design of a font impacts

how we use the typeface.• Social connotations are connected

to letter forms and typography.• Social contexts affect the way type

is used and understood.

Page 25: Definition: The style, arrangement, and appearance of text on a page.

BEWARE

Page 26: Definition: The style, arrangement, and appearance of text on a page.

AVOID

Page 27: Definition: The style, arrangement, and appearance of text on a page.
Page 28: Definition: The style, arrangement, and appearance of text on a page.
Page 29: Definition: The style, arrangement, and appearance of text on a page.
Page 30: Definition: The style, arrangement, and appearance of text on a page.
Page 31: Definition: The style, arrangement, and appearance of text on a page.
Page 32: Definition: The style, arrangement, and appearance of text on a page.
Page 33: Definition: The style, arrangement, and appearance of text on a page.
Page 34: Definition: The style, arrangement, and appearance of text on a page.
Page 35: Definition: The style, arrangement, and appearance of text on a page.
Page 36: Definition: The style, arrangement, and appearance of text on a page.
Page 37: Definition: The style, arrangement, and appearance of text on a page.

Cooper Black

Goudy Stout

Page 38: Definition: The style, arrangement, and appearance of text on a page.
Page 39: Definition: The style, arrangement, and appearance of text on a page.

And Other Poorly Designed Fonts

• Anyone can create a font, but few people know how to create consistent letter forms, kerning, and metrics.

Page 40: Definition: The style, arrangement, and appearance of text on a page.

Leading, Tracking, Kerning

Page 41: Definition: The style, arrangement, and appearance of text on a page.

Illustrator Photoshop

Page 42: Definition: The style, arrangement, and appearance of text on a page.

Leading

Leading is the space between baselines of type.Here’s how the term originated (to help you remember):In the olden days, lead had to be added toincrease the vertical space when laying out type.This is normal leading for this size and family of font.Sans serif type usually needs a little wider leadingto be legible than serif type does.

This is wide leading, used for dramatic effect.

Short blocks of text can have increased leading

Like this. Often wide leading Is found in text

that sits on top of color blocks..

Page 43: Definition: The style, arrangement, and appearance of text on a page.

Illustrator: Leading Photoshop: Leading

Page 44: Definition: The style, arrangement, and appearance of text on a page.

Tracking

T r a c k I n g I s t h e c o n s I s t e n t s p a c I n g

b e t w e e n l e t t e r s t h r o u g h o u t l I n e s o f t y p e.

T h I s i s a n e x a m p l e o f i n c r e a s e d t r a c k I n g .

This is normal tracking. When you loosen your tracking, its also a good idea to increase leading.

Page 45: Definition: The style, arrangement, and appearance of text on a page.

Illustrator: Tracking Photoshop: Tracking

Page 46: Definition: The style, arrangement, and appearance of text on a page.

Kerning

Kerning is the space between letter pairs.All type 20 points or higher needs to be hand kerned.

To adjust kerning in an Adobe program, place cursor between letters, and use Alt+Left/Right Arrow (PC) or Option+Left/Right Arrow (Mac)

Tight kerning is preferred to loose kerning, generally.

Page 47: Definition: The style, arrangement, and appearance of text on a page.

Difference Between Tracking and Kerning

Kerning is space between letter pairs that has to beadjusted to correct optical illusions of space (see below).

Tracking is space between all letters in a line of type.It can be increased or decreased for dramatic effect (see above).

Page 48: Definition: The style, arrangement, and appearance of text on a page.

Questions Designers Always Ask

• What font and why?• What point size and why?• What color and why?• What size leading, tracking,

kerning and why?

Page 49: Definition: The style, arrangement, and appearance of text on a page.

Quiz Yourself• What is leading? Tracking? Kerning?• Times Roman belongs to what type family? What characteristics demonstrate that?• Ariel belongs to what type family?

What characteristics demonstrate that?• What defines a “Modern” font?• What font families are for display type only?• What font families are best for body copy?• Conflicting type is type that is ___________.• Concordant type is ____________________.• What is a “type hierarchy?”• Identify 3 things to avoid with type.• True or False: Letter forms carry emotional impact.

Page 50: Definition: The style, arrangement, and appearance of text on a page.

Questions?